Title: [215320] trunk
Revision
215320
Author
hy...@apple.com
Date
2017-04-13 09:37:00 -0700 (Thu, 13 Apr 2017)

Log Message

Rendering flexbox children across columns
https://bugs.webkit.org/show_bug.cgi?id=164166
<rdar://problem/29055587>

Reviewed by Zalan Bujtas.

Source/WebCore:

Added fast/multicol/flexbox-rows.html

* rendering/RenderBlockFlow.cpp:
(WebCore::RenderBlockFlow::adjustForUnsplittableChild):

LayoutTests:

* fast/multicol/flexbox-rows-expected.html: Added.
* fast/multicol/flexbox-rows.html: Added.

Modified Paths

Added Paths

Diff

Modified: trunk/LayoutTests/ChangeLog (215319 => 215320)


--- trunk/LayoutTests/ChangeLog	2017-04-13 15:28:15 UTC (rev 215319)
+++ trunk/LayoutTests/ChangeLog	2017-04-13 16:37:00 UTC (rev 215320)
@@ -1,3 +1,14 @@
+2017-04-13  Dave Hyatt  <hy...@apple.com>
+
+        Rendering flexbox children across columns
+        https://bugs.webkit.org/show_bug.cgi?id=164166
+        <rdar://problem/29055587>
+
+        Reviewed by Zalan Bujtas.
+
+        * fast/multicol/flexbox-rows-expected.html: Added.
+        * fast/multicol/flexbox-rows.html: Added.
+
 2017-04-13  Antti Koivisto  <an...@apple.com>
 
         Try to unflake a test.

Added: trunk/LayoutTests/fast/multicol/flexbox-rows-expected.html (0 => 215320)


--- trunk/LayoutTests/fast/multicol/flexbox-rows-expected.html	                        (rev 0)
+++ trunk/LayoutTests/fast/multicol/flexbox-rows-expected.html	2017-04-13 16:37:00 UTC (rev 215320)
@@ -0,0 +1,56 @@
+<!DOCTYPE html><html class=''>
+    <head><style>
+        .wrapper {
+            -webkit-column-count: 2;
+            -moz-column-count: 2;
+            column-count: 2;
+        }
+        
+              .pad-rows .row {
+            padding-top: 12px;
+        }
+        
+        /**
+         * Other styles
+         */
+        .description {
+            margin: 0 1em;
+            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+            font-size: 14px;
+            line-height: 1.5;
+        }
+        .description > ul > li + li {
+            margin-top: 1em;
+        }
+        .description em {
+            font-size: 0.875em;
+            color: darkgray;
+        }
+        
+        input {
+            margin-left: 1em;
+        }
+        
+        hr {
+            margin: 1em 0;
+        }
+        </style></head><body>
+            <div class="description">
+               
+            <div class="wrapper">
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            </div>
+            <hr>
+            <div class="wrapper pad-rows">
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            </div>
+            
+            </body></html>

Added: trunk/LayoutTests/fast/multicol/flexbox-rows.html (0 => 215320)


--- trunk/LayoutTests/fast/multicol/flexbox-rows.html	                        (rev 0)
+++ trunk/LayoutTests/fast/multicol/flexbox-rows.html	2017-04-13 16:37:00 UTC (rev 215320)
@@ -0,0 +1,62 @@
+<!DOCTYPE html><html class=''>
+    <head><style>
+        .wrapper {
+            -webkit-column-count: 2;
+            -moz-column-count: 2;
+            column-count: 2;
+        }
+        
+        .row {
+            display: -webkit-box;
+            display: -ms-flexbox;
+            display: flex;
+        }
+        
+        .pad-rows .row {
+            padding-top: 12px;
+        }
+        
+        /**
+         * Other styles
+         */
+        .description {
+            margin: 0 1em;
+            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+            font-size: 14px;
+            line-height: 1.5;
+        }
+        .description > ul > li + li {
+            margin-top: 1em;
+        }
+        .description em {
+            font-size: 0.875em;
+            color: darkgray;
+        }
+        
+        input {
+            margin-left: 1em;
+        }
+        
+        hr {
+            margin: 1em 0;
+        }
+        </style></head><body>
+            <div class="description">
+               
+            <div class="wrapper">
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            </div>
+            <hr>
+            <div class="wrapper pad-rows">
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            <div class="row"><label>Label</label><input type="text"></div>
+            </div>
+            
+            </body></html>

Modified: trunk/LayoutTests/platform/ios-simulator/TestExpectations (215319 => 215320)


--- trunk/LayoutTests/platform/ios-simulator/TestExpectations	2017-04-13 15:28:15 UTC (rev 215319)
+++ trunk/LayoutTests/platform/ios-simulator/TestExpectations	2017-04-13 16:37:00 UTC (rev 215320)
@@ -3,3 +3,5 @@
 # See http://trac.webkit.org/wiki/TestExpectations for more information on this file.
 #
 
+fast/multicol/flexbox-rows.html [ Skip ]
+

Modified: trunk/Source/WebCore/ChangeLog (215319 => 215320)


--- trunk/Source/WebCore/ChangeLog	2017-04-13 15:28:15 UTC (rev 215319)
+++ trunk/Source/WebCore/ChangeLog	2017-04-13 16:37:00 UTC (rev 215320)
@@ -1,3 +1,16 @@
+2017-04-13  Dave Hyatt  <hy...@apple.com>
+
+        Rendering flexbox children across columns
+        https://bugs.webkit.org/show_bug.cgi?id=164166
+        <rdar://problem/29055587>
+
+        Reviewed by Zalan Bujtas.
+
+        Added fast/multicol/flexbox-rows.html
+
+        * rendering/RenderBlockFlow.cpp:
+        (WebCore::RenderBlockFlow::adjustForUnsplittableChild):
+
 2017-04-12  Alex Christensen  <achristen...@webkit.org>
 
         Clean up SharedBuffer public functions

Modified: trunk/Source/WebCore/rendering/RenderBlockFlow.cpp (215319 => 215320)


--- trunk/Source/WebCore/rendering/RenderBlockFlow.cpp	2017-04-13 15:28:15 UTC (rev 215319)
+++ trunk/Source/WebCore/rendering/RenderBlockFlow.cpp	2017-04-13 16:37:00 UTC (rev 215320)
@@ -36,6 +36,7 @@
 #include "LayoutRepainter.h"
 #include "Logging.h"
 #include "RenderCombineText.h"
+#include "RenderFlexibleBox.h"
 #include "RenderInline.h"
 #include "RenderIterator.h"
 #include "RenderLayer.h"
@@ -1865,14 +1866,19 @@
 
 LayoutUnit RenderBlockFlow::adjustForUnsplittableChild(RenderBox& child, LayoutUnit logicalOffset, LayoutUnit childBeforeMargin, LayoutUnit childAfterMargin)
 {
-    if (!childBoxIsUnsplittableForFragmentation(child))
+    // When flexboxes are embedded inside a block flow, they don't perform any adjustments for unsplittable
+    // children. We'll treat flexboxes themselves as unsplittable just to get them to paginate properly inside
+    // a block flow.
+    bool isUnsplittable = childBoxIsUnsplittableForFragmentation(child);
+    if (!isUnsplittable && !(child.isFlexibleBox() && !downcast<RenderFlexibleBox>(child).isFlexibleBoxImpl()))
         return logicalOffset;
-
+    
     RenderFlowThread* flowThread = flowThreadContainingBlock();
     LayoutUnit childLogicalHeight = logicalHeightForChild(child) + childBeforeMargin + childAfterMargin;
     LayoutUnit pageLogicalHeight = pageLogicalHeightForOffset(logicalOffset);
     bool hasUniformPageLogicalHeight = !flowThread || flowThread->regionsHaveUniformLogicalHeight();
-    updateMinimumPageHeight(logicalOffset, childLogicalHeight);
+    if (isUnsplittable)
+        updateMinimumPageHeight(logicalOffset, childLogicalHeight);
     if (!pageLogicalHeight || (hasUniformPageLogicalHeight && childLogicalHeight > pageLogicalHeight)
         || !hasNextPage(logicalOffset))
         return logicalOffset;
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to