Attachment 359133 Details for Bug 193431 – Patch

[patch] Patch

bug-193431-20190114212704.patch (text/plain), 18.69 KB, created by zalan on 2019-01-14 21:27:19 PST

(hide)

Description:

Filename:

MIME Type:

Creator: zalan

Created: 2019-01-14 21:27:19 PST

Size: 18.69 KB

patch

obsolete

>Subversion Revision: 239927
>diff --git a/Source/WebCore/ChangeLog b/Source/WebCore/ChangeLog
>index 2870e6b8095f05a11adae1efb068f71a2f7dea95..6286e838f1912f3500b33541099a0b5a49723c89 100644
>--- a/Source/WebCore/ChangeLog
>+++ b/Source/WebCore/ChangeLog
>@@ -1,3 +1,37 @@
>+2019-01-14  Zalan Bujtas  <zalan@apple.com>
>+
>+        [LFC] Use the containing block's padding box to position out-of-flow elements.
>+        https://bugs.webkit.org/show_bug.cgi?id=193431
>+
>+        Reviewed by NOBODY (OOPS!).
>+
>+        If the element has 'position: absolute', the containing block is established by the nearest ancestor
>+        with a 'position' of 'absolute', 'relative' or 'fixed', in the following way:
>+
>+        1. In the case that the ancestor is an inline element, the containing block is the bounding box around the padding
>+        boxes of the first and the last inline boxes generated for that element. In CSS 2.2, if the inline element is split
>+        across multiple lines, the containing block is undefined.
>+
>+        2. Otherwise, the containing block is formed by the padding edge of the ancestor.
>+
>+        This patch covers #2. 
>+
>+        Test: fast/block/block-only/out-of-flow-with-containing-block-border-padding.html
>+
>+        * layout/displaytree/DisplayBox.h:
>+        (WebCore::Display::Box::width const):
>+        (WebCore::Display::Box::height const):
>+        (WebCore::Display::Box::contentBoxTop const):
>+        (WebCore::Display::Box::contentBoxLeft const):
>+        (WebCore::Display::Box::paddingBoxTop const):
>+        (WebCore::Display::Box::paddingBoxLeft const):
>+        (WebCore::Display::Box::paddingBoxBottom const):
>+        (WebCore::Display::Box::paddingBoxRight const):
>+        (WebCore::Display::Box::paddingBoxHeight const):
>+        (WebCore::Display::Box::paddingBoxWidth const):
>+        * page/FrameViewLayoutContext.cpp:
>+        (WebCore::layoutUsingFormattingContext):
>+
> 2019-01-14  Zan Dobersek  <zdobersek@igalia.com>
> 
>         DOMCacheStorage: use-after-move in doSequentialMatch()
>diff --git a/Source/WebCore/layout/FormattingContextGeometry.cpp b/Source/WebCore/layout/FormattingContextGeometry.cpp
>index 6643c1470fa1aef0ae9957869095a75c2ea353ce..cc38f183d60a9a490dcc2c299ad184601ec29c84 100644
>--- a/Source/WebCore/layout/FormattingContextGeometry.cpp
>+++ b/Source/WebCore/layout/FormattingContextGeometry.cpp
>@@ -273,11 +273,12 @@ VerticalGeometry FormattingContext::Geometry::outOfFlowNonReplacedVerticalGeomet
>     auto& style = layoutBox.style();
>     auto& displayBox = layoutState.displayBoxForLayoutBox(layoutBox);
>     auto& containingBlockDisplayBox = layoutState.displayBoxForLayoutBox(*layoutBox.containingBlock());
>-    auto containingBlockHeight = containingBlockDisplayBox.height();
>-    auto containingBlockWidth = containingBlockDisplayBox.width();
>+    auto containingBlockHeight = containingBlockDisplayBox.paddingBoxHeight();
>+    auto containingBlockWidth = containingBlockDisplayBox.paddingBoxWidth();
> 
>     auto top = computedValueIfNotAuto(style.logicalTop(), containingBlockWidth);
>     auto bottom = computedValueIfNotAuto(style.logicalBottom(), containingBlockWidth);
>+    auto isStaticallyPositioned = !top && !bottom;
>     auto height = usedHeight ? usedHeight.value() : computedHeightValue(layoutState, layoutBox, HeightType::Normal);
>     auto computedVerticalMargin = Geometry::computedVerticalMargin(layoutState, layoutBox);
>     UsedVerticalMargin::NonCollapsedValues usedVerticalMargin; 
>@@ -353,6 +354,14 @@ VerticalGeometry FormattingContext::Geometry::outOfFlowNonReplacedVerticalGeomet
>     ASSERT(bottom);
>     ASSERT(height);
> 
>+    // For out-of-flow elements the containing block is formed by the padding edge of the ancestor.
>+    // At this point the non-statically positioned value is in the coordinate system of the padding box. Let's convert it to border box coordinate system.
>+    if (!isStaticallyPositioned) {
>+        auto containingBlockPaddingVerticalEdge = containingBlockDisplayBox.paddingBoxTop();
>+        *top += containingBlockPaddingVerticalEdge;
>+        *bottom += containingBlockPaddingVerticalEdge;
>+    }
>+
>     LOG_WITH_STREAM(FormattingContextLayout, stream << "[Position][Height][Margin] -> out-of-flow non-replaced -> top(" << *top << "px) bottom("  << *bottom << "px) height(" << *height << "px) margin(" << usedVerticalMargin.before << "px, "  << usedVerticalMargin.after << "px) layoutBox(" << &layoutBox << ")");
>     return { *top, *bottom, { contentHeight(), usedVerticalMargin } };
> }
>@@ -390,11 +399,13 @@ HorizontalGeometry FormattingContext::Geometry::outOfFlowNonReplacedHorizontalGe
>     auto& style = layoutBox.style();
>     auto& displayBox = layoutState.displayBoxForLayoutBox(layoutBox);
>     auto& containingBlock = *layoutBox.containingBlock();
>-    auto containingBlockWidth = layoutState.displayBoxForLayoutBox(containingBlock).contentBoxWidth();
>+    auto& containingBlockDisplayBox = layoutState.displayBoxForLayoutBox(containingBlock);
>+    auto containingBlockWidth = containingBlockDisplayBox.paddingBoxWidth();
>     auto isLeftToRightDirection = containingBlock.style().isLeftToRightDirection();
>     
>     auto left = computedValueIfNotAuto(style.logicalLeft(), containingBlockWidth);
>     auto right = computedValueIfNotAuto(style.logicalRight(), containingBlockWidth);
>+    auto isStaticallyPositioned = !left && !right;
>     auto width = computedValueIfNotAuto(usedWidth ? Length { usedWidth.value(), Fixed } : style.logicalWidth(), containingBlockWidth);
>     auto computedHorizontalMargin = Geometry::computedHorizontalMargin(layoutState, layoutBox);
>     UsedHorizontalMargin usedHorizontalMargin;
>@@ -496,6 +507,14 @@ HorizontalGeometry FormattingContext::Geometry::outOfFlowNonReplacedHorizontalGe
>     ASSERT(right);
>     ASSERT(width);
> 
>+    // For out-of-flow elements the containing block is formed by the padding edge of the ancestor.
>+    // At this point the non-statically positioned value is in the coordinate system of the padding box. Let's convert it to border box coordinate system.
>+    if (!isStaticallyPositioned) {
>+        auto containingBlockPaddingVerticalEdge = containingBlockDisplayBox.paddingBoxLeft();
>+        *left += containingBlockPaddingVerticalEdge;
>+        *right += containingBlockPaddingVerticalEdge;
>+    }
>+
>     LOG_WITH_STREAM(FormattingContextLayout, stream << "[Position][Width][Margin] -> out-of-flow non-replaced -> left(" << *left << "px) right("  << *right << "px) width(" << *width << "px) margin(" << usedHorizontalMargin.start << "px, "  << usedHorizontalMargin.end << "px) layoutBox(" << &layoutBox << ")");
>     return { *left, *right, { contentWidth(), usedHorizontalMargin, computedHorizontalMargin } };
> }
>@@ -517,11 +536,12 @@ VerticalGeometry FormattingContext::Geometry::outOfFlowReplacedVerticalGeometry(
>     auto& style = layoutBox.style();
>     auto& displayBox = layoutState.displayBoxForLayoutBox(layoutBox);
>     auto& containingBlockDisplayBox = layoutState.displayBoxForLayoutBox(*layoutBox.containingBlock());
>-    auto containingBlockHeight = containingBlockDisplayBox.height();
>-    auto containingBlockWidth = containingBlockDisplayBox.width();
>+    auto containingBlockHeight = containingBlockDisplayBox.paddingBoxHeight();
>+    auto containingBlockWidth = containingBlockDisplayBox.paddingBoxWidth();
> 
>     auto top = computedValueIfNotAuto(style.logicalTop(), containingBlockWidth);
>     auto bottom = computedValueIfNotAuto(style.logicalBottom(), containingBlockWidth);
>+    auto isStaticallyPositioned = !top && !bottom;
>     auto height = inlineReplacedHeightAndMargin(layoutState, layoutBox, usedHeight).height;
>     auto computedVerticalMargin = Geometry::computedVerticalMargin(layoutState, layoutBox);
>     UsedVerticalMargin::NonCollapsedValues usedVerticalMargin; 
>@@ -564,6 +584,14 @@ VerticalGeometry FormattingContext::Geometry::outOfFlowReplacedVerticalGeometry(
>     if (boxHeight > containingBlockHeight)
>         bottom = containingBlockHeight - (*top + usedVerticalMargin.before + borderTop + paddingTop + height + paddingBottom + borderBottom + usedVerticalMargin.after); 
> 
>+    // For out-of-flow elements the containing block is formed by the padding edge of the ancestor.
>+    // At this point the non-statically positioned value is in the coordinate system of the padding box. Let's convert it to border box coordinate system.
>+    if (!isStaticallyPositioned) {
>+        auto containingBlockPaddingVerticalEdge = containingBlockDisplayBox.paddingBoxTop();
>+        *top += containingBlockPaddingVerticalEdge;
>+        *bottom += containingBlockPaddingVerticalEdge;
>+    }
>+
>     LOG_WITH_STREAM(FormattingContextLayout, stream << "[Position][Height][Margin] -> out-of-flow replaced -> top(" << *top << "px) bottom("  << *bottom << "px) height(" << height << "px) margin(" << usedVerticalMargin.before << "px, "  << usedVerticalMargin.after << "px) layoutBox(" << &layoutBox << ")");
>     return { *top, *bottom, { height, usedVerticalMargin } };
> }
>@@ -589,11 +617,13 @@ HorizontalGeometry FormattingContext::Geometry::outOfFlowReplacedHorizontalGeome
>     auto& style = layoutBox.style();
>     auto& displayBox = layoutState.displayBoxForLayoutBox(layoutBox);
>     auto& containingBlock = *layoutBox.containingBlock();
>-    auto containingBlockWidth = layoutState.displayBoxForLayoutBox(containingBlock).contentBoxWidth();
>+    auto& containingBlockDisplayBox = layoutState.displayBoxForLayoutBox(containingBlock);
>+    auto containingBlockWidth = containingBlockDisplayBox.paddingBoxWidth();
>     auto isLeftToRightDirection = containingBlock.style().isLeftToRightDirection();
> 
>     auto left = computedValueIfNotAuto(style.logicalLeft(), containingBlockWidth);
>     auto right = computedValueIfNotAuto(style.logicalRight(), containingBlockWidth);
>+    auto isStaticallyPositioned = !left && !right;
>     auto computedHorizontalMargin = Geometry::computedHorizontalMargin(layoutState, layoutBox);
>     UsedHorizontalMargin usedHorizontalMargin;
>     auto width = inlineReplacedWidthAndMargin(layoutState, layoutBox, usedWidth).width;
>@@ -657,6 +687,14 @@ HorizontalGeometry FormattingContext::Geometry::outOfFlowReplacedHorizontalGeome
>     ASSERT(left);
>     ASSERT(right);
> 
>+    // For out-of-flow elements the containing block is formed by the padding edge of the ancestor.
>+    // At this point the non-statically positioned value is in the coordinate system of the padding box. Let's convert it to border box coordinate system.
>+    if (isStaticallyPositioned) {
>+        auto containingBlockPaddingVerticalEdge = containingBlockDisplayBox.paddingBoxLeft();
>+        *left += containingBlockPaddingVerticalEdge;
>+        *right += containingBlockPaddingVerticalEdge;
>+    }
>+
>     LOG_WITH_STREAM(FormattingContextLayout, stream << "[Position][Width][Margin] -> out-of-flow replaced -> left(" << *left << "px) right("  << *right << "px) width(" << width << "px) margin(" << usedHorizontalMargin.start << "px, "  << usedHorizontalMargin.end << "px) layoutBox(" << &layoutBox << ")");
>     return { *left, *right, { width, usedHorizontalMargin, computedHorizontalMargin } };
> }
>diff --git a/Source/WebCore/layout/displaytree/DisplayBox.h b/Source/WebCore/layout/displaytree/DisplayBox.h
>index 16782c44ebcb765869f1691174131572b17df065..1d45aa3dfb6909b84fdb39091ad4f621bf171c9a 100644
>--- a/Source/WebCore/layout/displaytree/DisplayBox.h
>+++ b/Source/WebCore/layout/displaytree/DisplayBox.h
>@@ -133,8 +133,8 @@ public:
>     LayoutPoint bottomRight() const { return { right(), bottom() }; }
> 
>     LayoutSize size() const { return { width(), height() }; }
>-    LayoutUnit width() const { return borderLeft() + paddingLeft().valueOr(0) + contentBoxWidth() + paddingRight().valueOr(0) + borderRight(); }
>-    LayoutUnit height() const { return borderTop() + paddingTop().valueOr(0) + contentBoxHeight() + paddingBottom().valueOr(0) + borderBottom(); }
>+    LayoutUnit width() const { return borderLeft() + paddingBoxWidth() + borderRight(); }
>+    LayoutUnit height() const { return borderTop() + paddingBoxHeight() + borderBottom(); }
>     Rect rect() const { return { top(), left(), width(), height() }; }
>     Rect rectWithMargin() const;
> 
>@@ -160,13 +160,20 @@ public:
>     Optional<LayoutUnit> paddingBottom() const;
>     Optional<LayoutUnit> paddingRight() const;
> 
>-    LayoutUnit contentBoxTop() const { return borderTop() + paddingTop().valueOr(0); }
>-    LayoutUnit contentBoxLeft() const { return borderLeft() + paddingLeft().valueOr(0); }
>+    LayoutUnit contentBoxTop() const { return paddingBoxTop() + paddingTop().valueOr(0); }
>+    LayoutUnit contentBoxLeft() const { return paddingBoxLeft() + paddingLeft().valueOr(0); }
>     LayoutUnit contentBoxBottom() const { return contentBoxTop() + contentBoxHeight(); }
>     LayoutUnit contentBoxRight() const { return contentBoxLeft() + contentBoxWidth(); }
>     LayoutUnit contentBoxHeight() const;
>     LayoutUnit contentBoxWidth() const;
> 
>+    LayoutUnit paddingBoxTop() const { return borderTop(); }
>+    LayoutUnit paddingBoxLeft() const { return borderLeft(); }
>+    LayoutUnit paddingBoxBottom() const { return paddingBoxTop() + paddingBoxHeight(); }
>+    LayoutUnit paddingBoxRight() const { return paddingBoxLeft() + paddingBoxWidth(); }
>+    LayoutUnit paddingBoxHeight() const { return paddingTop().valueOr(0) + contentBoxHeight() + paddingBottom().valueOr(0); }
>+    LayoutUnit paddingBoxWidth() const { return paddingLeft().valueOr(0) + contentBoxWidth() + paddingRight().valueOr(0); }
>+
>     Rect marginBox() const;
>     Rect nonCollapsedMarginBox() const;
> 
>diff --git a/Tools/ChangeLog b/Tools/ChangeLog
>index 79e58efbd47bcbc9c6ecdccfbb9b6e53fb98aa6e..95548b277e81fdfcc1bd71d275364459392bb755 100644
>--- a/Tools/ChangeLog
>+++ b/Tools/ChangeLog
>@@ -1,3 +1,12 @@
>+2019-01-14  Zalan Bujtas  <zalan@apple.com>
>+
>+        [LFC] Use the containing block's padding box to position out-of-flow elements.
>+        https://bugs.webkit.org/show_bug.cgi?id=193431
>+
>+        Reviewed by NOBODY (OOPS!).
>+
>+        * LayoutReloaded/misc/LFC-passing-tests.txt:
>+
> 2019-01-14  Zalan Bujtas  <zalan@apple.com>
> 
>         [LFC][BFC] Add basic box-sizing support.
>diff --git a/Tools/LayoutReloaded/misc/LFC-passing-tests.txt b/Tools/LayoutReloaded/misc/LFC-passing-tests.txt
>index 2826337d4dfbe7b9ce186b505f4fe01f66663c30..4ec9d7649aeef911eaccb6e33954043d38969f4f 100644
>--- a/Tools/LayoutReloaded/misc/LFC-passing-tests.txt
>+++ b/Tools/LayoutReloaded/misc/LFC-passing-tests.txt
>@@ -77,6 +77,7 @@ fast/block/block-only/relative-right.html
> fast/block/block-only/relative-siblings.html
> fast/block/block-only/relative-simple.html
> fast/block/block-only/box-sizing-inflow-out-of-flow-simple.html
>+fast/block/block-only/out-of-flow-with-containing-block-border-padding.html
> fast/block/basic/002.html
> fast/block/basic/003.html
> fast/block/basic/006.html
>diff --git a/LayoutTests/ChangeLog b/LayoutTests/ChangeLog
>index 739fefad9376014a18e972447a004f82048ab15c..2afe2bc8fbc28ef4cee36926f1b4cb6434aa0f78 100644
>--- a/LayoutTests/ChangeLog
>+++ b/LayoutTests/ChangeLog
>@@ -1,3 +1,13 @@
>+2019-01-14  Zalan Bujtas  <zalan@apple.com>
>+
>+        [LFC] Use the containing block's padding box to position out-of-flow elements.
>+        https://bugs.webkit.org/show_bug.cgi?id=193431
>+
>+        Reviewed by NOBODY (OOPS!).
>+
>+        * fast/block/block-only/out-of-flow-with-containing-block-border-padding-expected.txt: Added.
>+        * fast/block/block-only/out-of-flow-with-containing-block-border-padding.html: Added.
>+
> 2019-01-14  Zalan Bujtas  <zalan@apple.com>
> 
>         [LFC][BFC] Add basic box-sizing support.
>diff --git a/LayoutTests/fast/block/block-only/out-of-flow-with-containing-block-border-padding-expected.txt b/LayoutTests/fast/block/block-only/out-of-flow-with-containing-block-border-padding-expected.txt
>new file mode 100644
>index 0000000000000000000000000000000000000000..cf325a46cbc93696e7b4f359014560c630783ba0
>--- /dev/null
>+++ b/LayoutTests/fast/block/block-only/out-of-flow-with-containing-block-border-padding-expected.txt
>@@ -0,0 +1,33 @@
>+layer at (0,0) size 800x600
>+  RenderView at (0,0) size 800x600
>+layer at (0,0) size 800x600
>+  RenderBlock {HTML} at (0,0) size 800x600
>+    RenderBody {BODY} at (8,8) size 784x584
>+layer at (8,8) size 56x56
>+  RenderBlock (relative positioned) {DIV} at (0,0) size 56x56 [border: (3px solid #008000)]
>+layer at (21,13) size 10x10
>+  RenderBlock (positioned) {DIV} at (13,5) size 10x10 [bgcolor=#0000FF]
>+layer at (8,64) size 56x56
>+  RenderBlock (relative positioned) {DIV} at (0,56) size 56x56 [border: (3px solid #008000)]
>+layer at (21,105) size 10x10
>+  RenderBlock (positioned) {DIV} at (13,41) size 10x10 [bgcolor=#0000FF]
>+layer at (8,120) size 56x56
>+  RenderBlock (relative positioned) {DIV} at (0,112) size 56x56 [border: (3px solid #008000)]
>+layer at (21,125) size 10x46
>+  RenderBlock (positioned) {DIV} at (13,5) size 10x46 [bgcolor=#0000FF]
>+layer at (8,176) size 56x56
>+  RenderBlock (relative positioned) {DIV} at (0,168) size 56x56 [border: (3px solid #008000)]
>+layer at (13,189) size 10x10
>+  RenderBlock (positioned) {DIV} at (5,13) size 10x10 [bgcolor=#0000FF]
>+layer at (8,232) size 56x56
>+  RenderBlock (relative positioned) {DIV} at (0,224) size 56x56 [border: (3px solid #008000)]
>+layer at (49,245) size 10x10
>+  RenderBlock (positioned) {DIV} at (41,13) size 10x10 [bgcolor=#0000FF]
>+layer at (8,288) size 56x56
>+  RenderBlock (relative positioned) {DIV} at (0,280) size 56x56 [border: (3px solid #008000)]
>+layer at (13,301) size 46x10
>+  RenderBlock (positioned) {DIV} at (5,13) size 46x10 [bgcolor=#0000FF]
>+layer at (8,344) size 56x56
>+  RenderBlock (relative positioned) {DIV} at (0,336) size 56x56 [border: (3px solid #008000)]
>+layer at (13,349) size 46x46
>+  RenderBlock (positioned) {DIV} at (5,5) size 46x46 [bgcolor=#0000FF]
>diff --git a/LayoutTests/fast/block/block-only/out-of-flow-with-containing-block-border-padding.html b/LayoutTests/fast/block/block-only/out-of-flow-with-containing-block-border-padding.html
>new file mode 100644
>index 0000000000000000000000000000000000000000..f65db9352224c060a513c5b7a2d1410719940edd
>--- /dev/null
>+++ b/LayoutTests/fast/block/block-only/out-of-flow-with-containing-block-border-padding.html
>@@ -0,0 +1,35 @@
>+<style>
>+.container {
>+	border: 3px solid green;
>+	padding: 10px;
>+    height: 30px;
>+    width: 30px;
>+    position: relative;
>+}
>+
>+div div {
>+	background: blue;
>+    position: absolute;
>+}
>+</style>
>+<div class=container>
>+    <div style="top: 2px; width: 10px; height: 10px"></div>
>+</div>
>+<div class=container>
>+    <div style="bottom: 2px; width: 10px; height: 10px"></div>
>+</div>
>+<div class=container>
>+    <div style="top: 2px; bottom: 2px; width: 10px;"></div>
>+</div>
>+<div class=container>
>+    <div style="left: 2px; width: 10px; height: 10px"></div>
>+</div>
>+<div class=container>
>+    <div style="right: 2px; width: 10px; height: 10px"></div>
>+</div>
>+<div class=container>
>+    <div style="left: 2px; right: 2px; height: 10px;"></div>
>+</div>
>+<div class=container>
>+    <div style="top: 2px; left: 2px; right: 2px; bottom: 2px;"></div>
>+</div>

Actions: View | Formatted Diff | Diff

Attachments on bug 193431: 359133