<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[215041] trunk</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/215041">215041</a></dd>
<dt>Author</dt> <dd>hyatt@apple.com</dd>
<dt>Date</dt> <dd>2017-04-06 09:44:22 -0700 (Thu, 06 Apr 2017)</dd>
</dl>
<h3>Log Message</h3>
<pre>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):
Treat block-level flexboxes that occur inside block flows the same as replaced
and unsplittable elements and push them to the next page if they don't fit. We don't
update the minimum page height though, since the flexbox is not really unsplittable.
LayoutTests:
* fast/multicol/flexbox-rows-expected.html: Added.
* fast/multicol/flexbox-rows.html: Added.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsChangeLog">trunk/LayoutTests/ChangeLog</a></li>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCorerenderingRenderBlockFlowcpp">trunk/Source/WebCore/rendering/RenderBlockFlow.cpp</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsfastmulticolflexboxrowsexpectedhtml">trunk/LayoutTests/fast/multicol/flexbox-rows-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastmulticolflexboxrowshtml">trunk/LayoutTests/fast/multicol/flexbox-rows.html</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (215040 => 215041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog 2017-04-06 16:39:39 UTC (rev 215040)
+++ trunk/LayoutTests/ChangeLog 2017-04-06 16:44:22 UTC (rev 215041)
</span><span class="lines">@@ -1,3 +1,14 @@
</span><ins>+2017-04-06 Dave Hyatt <hyatt@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.
+
</ins><span class="cx"> 2017-04-05 Simon Fraser <simon.fraser@apple.com>
</span><span class="cx">
</span><span class="cx"> Set lastHandledUserGestureTimestamp on all ancestor documents, not just the top document
</span></span></pre></div>
<a id="trunkLayoutTestsfastmulticolflexboxrowsexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/multicol/flexbox-rows-expected.html (0 => 215041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/multicol/flexbox-rows-expected.html (rev 0)
+++ trunk/LayoutTests/fast/multicol/flexbox-rows-expected.html 2017-04-06 16:44:22 UTC (rev 215041)
</span><span class="lines">@@ -0,0 +1,56 @@
</span><ins>+<!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>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastmulticolflexboxrowshtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/multicol/flexbox-rows.html (0 => 215041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/multicol/flexbox-rows.html (rev 0)
+++ trunk/LayoutTests/fast/multicol/flexbox-rows.html 2017-04-06 16:44:22 UTC (rev 215041)
</span><span class="lines">@@ -0,0 +1,62 @@
</span><ins>+<!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>
</ins></span></pre></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (215040 => 215041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog 2017-04-06 16:39:39 UTC (rev 215040)
+++ trunk/Source/WebCore/ChangeLog 2017-04-06 16:44:22 UTC (rev 215041)
</span><span class="lines">@@ -1,3 +1,19 @@
</span><ins>+2017-04-06 Dave Hyatt <hyatt@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):
+ Treat block-level flexboxes that occur inside block flows the same as replaced
+ and unsplittable elements and push them to the next page if they don't fit. We don't
+ update the minimum page height though, since the flexbox is not really unsplittable.
+
</ins><span class="cx"> 2017-04-05 Simon Fraser <simon.fraser@apple.com>
</span><span class="cx">
</span><span class="cx"> Set lastHandledUserGestureTimestamp on all ancestor documents, not just the top document
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingRenderBlockFlowcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/RenderBlockFlow.cpp (215040 => 215041)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/RenderBlockFlow.cpp 2017-04-06 16:39:39 UTC (rev 215040)
+++ trunk/Source/WebCore/rendering/RenderBlockFlow.cpp 2017-04-06 16:44:22 UTC (rev 215041)
</span><span class="lines">@@ -36,6 +36,7 @@
</span><span class="cx"> #include "LayoutRepainter.h"
</span><span class="cx"> #include "Logging.h"
</span><span class="cx"> #include "RenderCombineText.h"
</span><ins>+#include "RenderFlexibleBox.h"
</ins><span class="cx"> #include "RenderInline.h"
</span><span class="cx"> #include "RenderIterator.h"
</span><span class="cx"> #include "RenderLayer.h"
</span><span class="lines">@@ -1865,7 +1866,11 @@
</span><span class="cx">
</span><span class="cx"> LayoutUnit RenderBlockFlow::adjustForUnsplittableChild(RenderBox& child, LayoutUnit logicalOffset, LayoutUnit childBeforeMargin, LayoutUnit childAfterMargin)
</span><span class="cx"> {
</span><del>- if (!childBoxIsUnsplittableForFragmentation(child))
</del><ins>+ // 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()))
</ins><span class="cx"> return logicalOffset;
</span><span class="cx">
</span><span class="cx"> RenderFlowThread* flowThread = flowThreadContainingBlock();
</span><span class="lines">@@ -1872,7 +1877,8 @@
</span><span class="cx"> LayoutUnit childLogicalHeight = logicalHeightForChild(child) + childBeforeMargin + childAfterMargin;
</span><span class="cx"> LayoutUnit pageLogicalHeight = pageLogicalHeightForOffset(logicalOffset);
</span><span class="cx"> bool hasUniformPageLogicalHeight = !flowThread || flowThread->regionsHaveUniformLogicalHeight();
</span><del>- updateMinimumPageHeight(logicalOffset, childLogicalHeight);
</del><ins>+ if (isUnsplittable)
+ updateMinimumPageHeight(logicalOffset, childLogicalHeight);
</ins><span class="cx"> if (!pageLogicalHeight || (hasUniformPageLogicalHeight && childLogicalHeight > pageLogicalHeight)
</span><span class="cx"> || !hasNextPage(logicalOffset))
</span><span class="cx"> return logicalOffset;
</span></span></pre>
</div>
</div>
</body>
</html>