Changeset 230700 in webkit

Timestamp:

Apr 16, 2018 10:17:26 PM (6 years ago)

Author:

Alan Bujtas

Message:

[LayoutReloaded] Add support for replaced box.
​https://bugs.webkit.org/show_bug.cgi?id=184680

Reviewed by Antti Koivisto.

Basic support for inline replaced.

• LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js:

(InlineFormattingContext.prototype._handleInlineBox):
(InlineFormattingContext.prototype._handleInlineBlock):
(InlineFormattingContext.prototype._handleReplaced):

• LayoutReloaded/FormattingContext/InlineFormatting/Line.js:

(Line.prototype.lastLineBox):
(Line.prototype.addInlineBox):
(Line.prototype.addInlineContainerBox): Deleted.

• LayoutReloaded/TreeBuilder.js:

(TreeBuilder.prototype._createAndAttachBox):

• LayoutReloaded/Utils.js:

(Utils._dumpBox):

• LayoutReloaded/test/index.html:
• LayoutReloaded/test/inline-simple-replaced.html: Added.

Location:

trunk/Tools

Files:

• ChangeLog (modified) (1 diff)
• LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js (modified) (3 diffs)
• LayoutReloaded/FormattingContext/InlineFormatting/Line.js (modified) (3 diffs)
• LayoutReloaded/TreeBuilder.js (modified) (1 diff)
• LayoutReloaded/Utils.js (modified) (1 diff)
• LayoutReloaded/test/index.html (modified) (1 diff)
• LayoutReloaded/test/inline-simple-replaced.html (added)

trunk/Tools/ChangeLog

@@ +1 @@
+2018-04-16  Zalan Bujtas  <zalan@apple.com>
+
+        [LayoutReloaded] Add support for replaced box.
+        https://bugs.webkit.org/show_bug.cgi?id=184680
+
+        Reviewed by Antti Koivisto.
+
+        Basic support for inline replaced.
+
+        * LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js:
+        (InlineFormattingContext.prototype._handleInlineBox):
+        (InlineFormattingContext.prototype._handleInlineBlock):
+        (InlineFormattingContext.prototype._handleReplaced):
+        * LayoutReloaded/FormattingContext/InlineFormatting/Line.js:
+        (Line.prototype.lastLineBox):
+        (Line.prototype.addInlineBox):
+        (Line.prototype.addInlineContainerBox): Deleted.
+        * LayoutReloaded/TreeBuilder.js:
+        (TreeBuilder.prototype._createAndAttachBox):
+        * LayoutReloaded/Utils.js:
+        (Utils._dumpBox):
+        * LayoutReloaded/test/index.html:
+        * LayoutReloaded/test/inline-simple-replaced.html: Added.
+
 2018-04-16  Zalan Bujtas  <zalan@apple.com>
 

trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js

@@ -105 +105 @@
         if (inlineBox.text())
             return this._handleText(inlineBox);
+        else
+            return this._handleReplaced(inlineBox);
     }
 
@@ -111 +113 @@
         let displayBox = this.displayBox(inlineBlockBox);
 
-        // TODO: auto width/height
+        // TODO: auto width/height and check if content actually at all.
         this._adjustLineForInlineContainerStart(inlineBlockBox);
         displayBox.setWidth(Utils.width(inlineBlockBox) + Utils.computedHorizontalBorderAndPadding(inlineBlockBox.node()));
         this.layoutState().formattingContext(inlineBlockBox).layout();
         displayBox.setHeight(Utils.height(inlineBlockBox) + Utils.computedVerticalBorderAndPadding(inlineBlockBox.node()));
+        this._line().addInlineBox(displayBox.size());
         this._adjustLineForInlineContainerEnd(inlineBlockBox);
-        this._line().addInlineContainerBox(displayBox.size());
     }
 
@@ -156 +158 @@
             this._line().moveContentHorizontally(floatWidth);
     }
+
+    _handleReplaced(replacedBox) {
+        // TODO: intrinsic size and check if content actually at all.
+        let displayBox = this.displayBox(replacedBox);
+        this._adjustLineForInlineContainerStart(replacedBox);
+        displayBox.setWidth(Utils.width(replacedBox) + Utils.computedHorizontalBorderAndPadding(replacedBox.node()));
+
+        displayBox.setHeight(Utils.height(replacedBox) + Utils.computedVerticalBorderAndPadding(replacedBox.node()));
+        this._line().addInlineBox(displayBox.size());
+        displayBox.setTopLeft(this._line().lastLineBox().lineBoxRect.topLeft());
+        this._adjustLineForInlineContainerEnd(replacedBox);
+   }
 
     _adjustLineForInlineContainerStart(inlineContainer) {

trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/Line.js

@@ -32 +32 @@
 
     LayoutRect rect();
-    lineBoxes();
+    Vector<InlineDisplayBox> lineBoxes();
 
-    shrink(float width);
-    adjustWithOffset(LayoutUnit offset);
-    moveContentHorizontally(LayoutUnit offset);
-    addInlineContainerBox(LayoutSize);
-    addTextLineBox(unsigned startPosition, unsigned endPosition, LayoutSize size);
+    void shrink(float width);
+    void adjustWithOffset(LayoutUnit offset);
+    void moveContentHorizontally(LayoutUnit offset);
+    void addInlineContainerBox(LayoutSize);
+    void addTextLineBox(unsigned startPosition, unsigned endPosition, LayoutSize size);
 };
 */
@@ -64 +64 @@
     }
 
+    lastLineBox() {
+        return this.m_lineBoxes[this.m_lineBoxes.length - 1];
+    }
+
     shrink(width) {
         this.m_availableWidth -= width;
@@ -80 +84 @@
     }
 
-    addInlineContainerBox(size) {
+    addInlineBox(size) {
         let width = size.width();
         ASSERT(width <= this.m_availableWidth);

trunk/Tools/LayoutReloaded/TreeBuilder.js

@@ -55 +55 @@
         if (name == "RenderBlock" || name == "RenderBody")
             box = new Layout.BlockContainer(node, id);
-        else if (name == "RenderInline") {
+        else if (name == "RenderInline")
             box = new Layout.InlineContainer(node, id);
-        } else if (name == "RenderText") {
+        else if (name == "RenderText")
             text = new Text(node, id);
-        } else
+        else if (name == "RenderImage")
+            box = new Layout.InlineBox(node, id);
+        else
             box = new Layout.Box(node, id);
 

trunk/Tools/LayoutReloaded/Utils.js

@@ -585 +585 @@
             return indentation + box.node().tagName + " " + box.name() + "\n";
         }
+        if (box.name() == "RenderImage") {
+            let boxRect = layoutState.displayBox(box).rect();
+            return indentation + box.node().tagName + " " + box.name() + " at (" + Utils.precisionRound(boxRect.left()) + "," + Utils.precisionRound(boxRect.top()) + ") size " + Utils.precisionRound(boxRect.width()) + "x" + Utils.precisionRound(boxRect.height()) + "\n";
+
+        }
         if (box.isAnonymous())
             return "";

trunk/Tools/LayoutReloaded/test/index.html

@@ -83 +83 @@
     "inline-block-with-fixed-width-height.html",
     "inline-with-relative-positioning.html",
-    "inline-with-out-of-flow-descendant.html"
+    "inline-with-out-of-flow-descendant.html",
+    "inline-simple-replaced.html"
 ];