[webkit-changes] [262378] trunk

Mon, 01 Jun 2020 08:19:43 -0700

Title: [262378] trunk
Revision
262378
Author
svil...@igalia.com
Date
2020-06-01 08:18:31 -0700 (Mon, 01 Jun 2020)

Log Message

[css-flexbox] Tables as flex items should obey the flex container sizing
https://bugs.webkit.org/show_bug.cgi?id=212355

Reviewed by Manuel Rego Casasnovas.

Source/WebCore:

For most of the boxes, "width:auto" means use all the available space from your container in the inline
direction. This means that a flex container does not need to do anything in particular to stretch them
in the inline axis. However that is not true for tables because their width mostly depend on the sum of
the sizes of their columns (whichever algorithm is used). That's why the layout code of tables should
check whether or not it has an override for the content logical width which is the way flexbox uses to
stretch flex items (and use that override width).

* rendering/RenderTable.cpp:
(WebCore::RenderTable::updateLogicalWidth): Stretch till overrideContentLogicalWidth() if needed.

LayoutTests:

Unskipped passing tests and added new expectations for Win and iOS which have
different renderings of some UI components causing a couple of test to fail by
small offsets.

* TestExpectations: Unskipped table-as-item-narrow-content.html that is passing now.
* css3/flexbox/flexitem-expected.txt: Updated. All tests passing.
* gpu-process/TestExpectations: Removed flexitem.html test.
* platform/ios/TestExpectations: Ditto.
* platform/ios/css3/flexbox/flexitem-expected.txt: Added.
* platform/win/TestExpectations: Removed flexitem.html test.
* platform/win/css3/flexbox/flexitem-expected.txt: Added.
* platform/wincairo/TestExpectations: Removed flexitem.html test.

Modified Paths

Added Paths

Diff

Modified: trunk/LayoutTests/ChangeLog (262377 => 262378)


--- trunk/LayoutTests/ChangeLog	2020-06-01 14:17:12 UTC (rev 262377)
+++ trunk/LayoutTests/ChangeLog	2020-06-01 15:18:31 UTC (rev 262378)
@@ -1,3 +1,23 @@
+2020-05-26  Sergio Villar Senin  <svil...@igalia.com>
+
+        [css-flexbox] Tables as flex items should obey the flex container sizing
+        https://bugs.webkit.org/show_bug.cgi?id=212355
+
+        Reviewed by Manuel Rego Casasnovas.
+
+        Unskipped passing tests and added new expectations for Win and iOS which have
+        different renderings of some UI components causing a couple of test to fail by
+        small offsets.
+
+        * TestExpectations: Unskipped table-as-item-narrow-content.html that is passing now.
+        * css3/flexbox/flexitem-expected.txt: Updated. All tests passing.
+        * gpu-process/TestExpectations: Removed flexitem.html test.
+        * platform/ios/TestExpectations: Ditto.
+        * platform/ios/css3/flexbox/flexitem-expected.txt: Added.
+        * platform/win/TestExpectations: Removed flexitem.html test.
+        * platform/win/css3/flexbox/flexitem-expected.txt: Added.
+        * platform/wincairo/TestExpectations: Removed flexitem.html test.
+
 2020-05-31  Zalan Bujtas  <za...@apple.com>
 
         [iBooks] Empty pages appear in book

Modified: trunk/LayoutTests/TestExpectations (262377 => 262378)


--- trunk/LayoutTests/TestExpectations	2020-06-01 14:17:12 UTC (rev 262377)
+++ trunk/LayoutTests/TestExpectations	2020-06-01 15:18:31 UTC (rev 262378)
@@ -4245,7 +4245,6 @@
 webkit.org/b/210089 imported/w3c/web-platform-tests/css/css-flexbox/flex-minimum-height-flex-items-013.html [ ImageOnlyFailure ]
 webkit.org/b/210093 imported/w3c/web-platform-tests/css/css-flexbox/select-element-zero-height-001.html [ ImageOnlyFailure ]
 webkit.org/b/210093 imported/w3c/web-platform-tests/css/css-flexbox/select-element-zero-height-002.html [ ImageOnlyFailure ]
-webkit.org/b/210102 imported/w3c/web-platform-tests/css/css-flexbox/table-as-item-auto-min-width.html [ ImageOnlyFailure ]
 webkit.org/b/210144 imported/w3c/web-platform-tests/css/css-flexbox/anonymous-flex-item-005.html [ ImageOnlyFailure ]
 webkit.org/b/210465 imported/w3c/web-platform-tests/css/css-flexbox/flex-wrap-002.html [ ImageOnlyFailure ]
 webkit.org/b/210475 imported/w3c/web-platform-tests/css/css-flexbox/image-items-flake-001.html [ ImageOnlyFailure ]
@@ -4264,8 +4263,6 @@
 webkit.org/b/212046 imported/w3c/web-platform-tests/css/css-flexbox/percentage-size-subitems-001.html [ ImageOnlyFailure ]
 webkit.org/b/212046 imported/w3c/web-platform-tests/css/css-flexbox/scrollbars-auto.html [ ImageOnlyFailure ]
 webkit.org/b/212046 imported/w3c/web-platform-tests/css/css-flexbox/scrollbars.html [ ImageOnlyFailure ]
-webkit.org/b/212046 imported/w3c/web-platform-tests/css/css-flexbox/table-as-item-fixed-min-width.html [ ImageOnlyFailure ]
-webkit.org/b/212046 imported/w3c/web-platform-tests/css/css-flexbox/table-as-item-narrow-content.html [ ImageOnlyFailure ]
 
 # CSS Masonry Layout not supported.
 imported/w3c/web-platform-tests/css/css-grid/masonry.tentative [ Skip ]

Modified: trunk/LayoutTests/css3/flexbox/flexitem-expected.txt (262377 => 262378)


--- trunk/LayoutTests/css3/flexbox/flexitem-expected.txt	2020-06-01 14:17:12 UTC (rev 262377)
+++ trunk/LayoutTests/css3/flexbox/flexitem-expected.txt	2020-06-01 15:18:31 UTC (rev 262378)
@@ -10,12 +10,7 @@
 PASS .flexbox 9 
 PASS .flexbox 10 
 PASS .flexbox 11 
-FAIL .flexbox 12 assert_equals: 
-<div class="flexbox">
-  <!-- FIXME: This table should flex. -->
-  <div data-expected-display="table" data-expected-width="600" style="display: inline-table"></div>
-</div>
-width expected 600 but got 0
+PASS .flexbox 12 
 PASS .flexbox 13 
 PASS .flexbox 14 
 PASS .flexbox 15

Modified: trunk/LayoutTests/gpu-process/TestExpectations (262377 => 262378)


--- trunk/LayoutTests/gpu-process/TestExpectations	2020-06-01 14:17:12 UTC (rev 262377)
+++ trunk/LayoutTests/gpu-process/TestExpectations	2020-06-01 15:18:31 UTC (rev 262378)
@@ -15,7 +15,6 @@
 css3/color/canvas.html [ Skip ]
 css3/flexbox/z-index-with-normal-flow-only.html [ Skip ]
 imported/w3c/web-platform-tests/css/css-flexbox/canvas-dynamic-change-001.html [ Skip ]
-css3/flexbox/flexitem.html [ Skip ]
 css3/blending/blend-mode-clip-accelerated-blending-canvas.html [ Skip ]
 displaylists/canvas-display-list.html [ Skip ]
 dom/svg [ Skip ]

Modified: trunk/LayoutTests/platform/ios/TestExpectations (262377 => 262378)


--- trunk/LayoutTests/platform/ios/TestExpectations	2020-06-01 14:17:12 UTC (rev 262377)
+++ trunk/LayoutTests/platform/ios/TestExpectations	2020-06-01 15:18:31 UTC (rev 262378)
@@ -1249,7 +1249,6 @@
 webkit.org/b/178487 compositing/video/video-clip-change-src.html [ ImageOnlyFailure ]
 
 # CSS tests to triage
-webkit.org/b/178588 css3/flexbox/flexitem.html [ Failure ]
 webkit.org/b/178588 css3/zoom-coords.xhtml [ Failure ]
 webkit.org/b/178588 fast/css/active-display-none.html [ Failure ]
 webkit.org/b/178588 fast/css/button-height.html [ Failure ]

Added: trunk/LayoutTests/platform/ios/css3/flexbox/flexitem-expected.txt (0 => 262378)


--- trunk/LayoutTests/platform/ios/css3/flexbox/flexitem-expected.txt	                        (rev 0)
+++ trunk/LayoutTests/platform/ios/css3/flexbox/flexitem-expected.txt	2020-06-01 15:18:31 UTC (rev 262378)
@@ -0,0 +1,65 @@
+
+PASS .flexbox 1 
+PASS .flexbox 2 
+PASS .flexbox 3 
+PASS .flexbox 4 
+PASS .flexbox 5 
+PASS .flexbox 6 
+PASS .flexbox 7 
+PASS .flexbox 8 
+PASS .flexbox 9 
+PASS .flexbox 10 
+PASS .flexbox 11 
+PASS .flexbox 12 
+PASS .flexbox 13 
+PASS .flexbox 14 
+PASS .flexbox 15 
+PASS .flexbox 16 
+FAIL .flexbox 17 assert_equals: 
+<div class="flexbox">
+  <input data-expected-display="block" data-expected-width="75" type="checkbox" value="radio">
+  <input data-expected-display="block" data-expected-width="75" type="file" value="file">
+  <input data-expected-display="block" data-expected-width="75" type="image" value="image">
+  <input data-expected-display="block" data-expected-width="75" type="password" value="password">
+  <input data-expected-display="block" data-expected-width="75" type="radio" value="radio">
+  <input data-expected-display="block" data-expected-width="75" type="reset" value="reset">
+  <input data-expected-display="block" data-expected-width="75" type="submit" value="submit">
+  <input data-expected-display="block" data-expected-width="75" type="text" value="text">
+</div>
+width expected 75 but got 69
+FAIL .flexbox 18 assert_equals: 
+<div class="flexbox" style="height:200px">
+  <button data-expected-display="block" data-expected-width="100" data-expected-height="200">button</button>
+  <canvas data-expected-display="block" data-expected-width="100" data-expected-height="200">canvas</canvas>
+  <iframe data-expected-display="block" data-expected-width="100" data-expected-height="200" src="" bgcolor=#fff&gt;iframe&lt;/body&gt;"></iframe>
+  <object data-expected-display="block" data-expected-width="100" data-expected-height="200">object</object>
+  <select data-expected-display="block" data-expected-width="100" data-expected-height="200">
+    <option>select</option>
+  </select>
+  <textarea data-expected-display="block" data-expected-width="100" data-expected-height="200">textarea</textarea>
+</div>
+width expected 100 but got 98
+button
+
+object
+
+
+
+
+button
+
+
+
+button
+
+object
+
+
+
+
+
+Some text
+Some more text
+
+
+
Property changes on: trunk/LayoutTests/platform/ios/css3/flexbox/flexitem-expected.txt
___________________________________________________________________

Added: svn:eol-style

+LF \ No newline at end of property

Modified: trunk/LayoutTests/platform/win/TestExpectations (262377 => 262378)


--- trunk/LayoutTests/platform/win/TestExpectations	2020-06-01 14:17:12 UTC (rev 262377)
+++ trunk/LayoutTests/platform/win/TestExpectations	2020-06-01 15:18:31 UTC (rev 262378)
@@ -2097,7 +2097,6 @@
 css2.1/20110323/abspos-replaced-width-margin-000-ref.htm [ Failure ]
 
 css3/flexbox/button.html [ Failure ]
-css3/flexbox/flexitem.html [ Failure ]
 css3/flexbox/image-percent-max-height.html [ ImageOnlyFailure ]
 webkit.org/b/107356 fast/css/sticky/sticky-top-zoomed.html [ ImageOnlyFailure ]

Added: trunk/LayoutTests/platform/win/css3/flexbox/flexitem-expected.txt (0 => 262378)


--- trunk/LayoutTests/platform/win/css3/flexbox/flexitem-expected.txt	                        (rev 0)
+++ trunk/LayoutTests/platform/win/css3/flexbox/flexitem-expected.txt	2020-06-01 15:18:31 UTC (rev 262378)
@@ -0,0 +1,66 @@
+
+PASS .flexbox 1 
+PASS .flexbox 2 
+PASS .flexbox 3 
+PASS .flexbox 4 
+PASS .flexbox 5 
+PASS .flexbox 6 
+PASS .flexbox 7 
+FAIL .flexbox 8 assert_equals: 
+<div class="flexbox column" style="height:210px">
+  <button data-expected-display="block" data-expected-width="600" data-expected-height="30">button</button>
+  <canvas data-expected-display="block" data-expected-width="600" data-expected-height="30" style="height:30px">canvas</canvas>
+  <iframe data-expected-display="block" data-expected-width="600" data-expected-height="30" style="height:30px" src="" bgcolor=#fff&gt;iframe&lt;/body&gt;"></iframe>
+  <iframe seamless="" data-expected-display="block" data-expected-width="600" data-expected-height="30" style="height:30px" src="" bgcolor=#fff&gt;iframe&lt;/body&gt;"></iframe>
+  <object data-expected-display="block" data-expected-width="600" data-expected-height="30">object</object>
+  <select data-expected-display="block" data-expected-width="600" data-expected-height="30">
+    <option>select</option>
+  </select>
+  <textarea data-expected-display="block" data-expected-width="600" data-expected-height="30">textarea</textarea>
+</div>
+height expected 30 but got 29
+PASS .flexbox 9 
+PASS .flexbox 10 
+PASS .flexbox 11 
+PASS .flexbox 12 
+PASS .flexbox 13 
+PASS .flexbox 14 
+PASS .flexbox 15 
+PASS .flexbox 16 
+PASS .flexbox 17 
+FAIL .flexbox 18 assert_equals: 
+<div class="flexbox" style="height:200px">
+  <button data-expected-display="block" data-expected-width="100" data-expected-height="200">button</button>
+  <canvas data-expected-display="block" data-expected-width="100" data-expected-height="200">canvas</canvas>
+  <iframe data-expected-display="block" data-expected-width="100" data-expected-height="200" src="" bgcolor=#fff&gt;iframe&lt;/body&gt;"></iframe>
+  <object data-expected-display="block" data-expected-width="100" data-expected-height="200">object</object>
+  <select data-expected-display="block" data-expected-width="100" data-expected-height="200">
+    <option>select</option>
+  </select>
+  <textarea data-expected-display="block" data-expected-width="100" data-expected-height="200">textarea</textarea>
+</div>
+width expected 100 but got 96
+button
+
+object
+
+
+
+
+button
+
+
+
+button
+
+object
+
+
+
+
+
+Some text
+Some more text
+
+
+
Property changes on: trunk/LayoutTests/platform/win/css3/flexbox/flexitem-expected.txt
___________________________________________________________________

Added: svn:eol-style

+LF \ No newline at end of property

Modified: trunk/LayoutTests/platform/wincairo/TestExpectations (262377 => 262378)


--- trunk/LayoutTests/platform/wincairo/TestExpectations	2020-06-01 14:17:12 UTC (rev 262377)
+++ trunk/LayoutTests/platform/wincairo/TestExpectations	2020-06-01 15:18:31 UTC (rev 262378)
@@ -1342,7 +1342,6 @@
 css2.1/20110323/abspos-replaced-width-margin-000-ref.htm [ Failure ]
 
 css3/flexbox/button.html [ Failure ]
-css3/flexbox/flexitem.html [ Failure ]
 css3/flexbox/image-percent-max-height.html [ ImageOnlyFailure ]
 
 # TODO HW filters not yet supported on Windows

Modified: trunk/Source/WebCore/ChangeLog (262377 => 262378)


--- trunk/Source/WebCore/ChangeLog	2020-06-01 14:17:12 UTC (rev 262377)
+++ trunk/Source/WebCore/ChangeLog	2020-06-01 15:18:31 UTC (rev 262378)
@@ -1,3 +1,20 @@
+2020-05-25  Sergio Villar Senin  <svil...@igalia.com>
+
+        [css-flexbox] Tables as flex items should obey the flex container sizing
+        https://bugs.webkit.org/show_bug.cgi?id=212355
+
+        Reviewed by Manuel Rego Casasnovas.
+
+        For most of the boxes, "width:auto" means use all the available space from your container in the inline
+        direction. This means that a flex container does not need to do anything in particular to stretch them
+        in the inline axis. However that is not true for tables because their width mostly depend on the sum of
+        the sizes of their columns (whichever algorithm is used). That's why the layout code of tables should
+        check whether or not it has an override for the content logical width which is the way flexbox uses to
+        stretch flex items (and use that override width).
+
+        * rendering/RenderTable.cpp:
+        (WebCore::RenderTable::updateLogicalWidth): Stretch till overrideContentLogicalWidth() if needed.
+
 2020-06-01  Sam Weinig  <wei...@apple.com>
 
         Extended Color: Replace Color constructors taking numeric values with type specific factory functions

Modified: trunk/Source/WebCore/rendering/RenderTable.cpp (262377 => 262378)


--- trunk/Source/WebCore/rendering/RenderTable.cpp	2020-06-01 14:17:12 UTC (rev 262377)
+++ trunk/Source/WebCore/rendering/RenderTable.cpp	2020-06-01 15:18:31 UTC (rev 262378)
@@ -280,6 +280,11 @@
         setLogicalWidth(std::min(availableContentLogicalWidth, maxWidth));
     }
 
+    // Our parent might have set an override content logical width on us, so we must respect it. This
+    // is how flexbox containers flex or stretch us.
+    if (hasOverrideContentLogicalWidth())
+        setLogicalWidth(std::max(logicalWidth(), overrideContentLogicalWidth()));
+
     // Ensure we aren't bigger than our max-width style.
     Length styleMaxLogicalWidth = style().logicalMaxWidth();
     if ((styleMaxLogicalWidth.isSpecified() && !styleMaxLogicalWidth.isNegative()) || styleMaxLogicalWidth.isIntrinsic()) {

_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to