<!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>[165964] 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/165964">165964</a></dd>
<dt>Author</dt> <dd>stavila@adobe.com</dd>
<dt>Date</dt> <dd>2014-03-20 08:01:12 -0700 (Thu, 20 Mar 2014)</dd>
</dl>
<h3>Log Message</h3>
<pre>[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly
https://bugs.webkit.org/show_bug.cgi?id=129487
Reviewed by Andrei Bucur.
Source/WebCore:
When propagating the layout overflow from the flowed element up to the flow thread itself,
the region's logical bottom padding and the element's logical bottom margin must be taken into consideration.
However, if the flowed element has overflow, the overflow will be painted over the region's padding
and the element's margin, in order to be compatible with the non-regions case.
More info can be found here: http://lists.w3.org/Archives/Public/www-style/2014Jan/0089.html
Tests: fast/regions/scrollable-region-content-size-horiz-bt.html
fast/regions/scrollable-region-content-size-no-overflow-horiz-bt.html
fast/regions/scrollable-region-content-size-no-overflow-vert-rl.html
fast/regions/scrollable-region-content-size-no-overflow.html
fast/regions/scrollable-region-content-size-relative.html
fast/regions/scrollable-region-content-size-vert-rl.html
fast/regions/scrollable-region-content-size-vertical-lr.html
fast/regions/scrollable-region-content-size.html
fast/regions/scrollable-region-scrollable-content.html
* rendering/RenderFlowThread.cpp:
(WebCore::RenderFlowThread::addRegionsOverflowFromChild):
* rendering/RenderRegion.cpp:
(WebCore::RenderRegion::rectFlowPortionForBox):
LayoutTests:
Added tests for different situations using scrollable regions and fixed a couple existing tests.
* fast/regions/clip-to-padding-box-margins.html: overflow-x and overflow-y cannot be hidden & visible.
* fast/regions/scrollable-last-region-expected.html: "hack" no longer needed now that the scroll content size is properly computed.
* fast/regions/scrollable-region-content-size-expected.html: Added.
* fast/regions/scrollable-region-content-size-horiz-bt-expected.html: Added.
* fast/regions/scrollable-region-content-size-horiz-bt.html: Added.
* fast/regions/scrollable-region-content-size-no-overflow-expected.html: Added.
* fast/regions/scrollable-region-content-size-no-overflow-horiz-bt-expected.html: Added.
* fast/regions/scrollable-region-content-size-no-overflow-horiz-bt.html: Added.
* fast/regions/scrollable-region-content-size-no-overflow-vert-rl-expected.html: Added.
* fast/regions/scrollable-region-content-size-no-overflow-vert-rl.html: Added.
* fast/regions/scrollable-region-content-size-no-overflow.html: Added.
* fast/regions/scrollable-region-content-size-relative-expected.html: Added.
* fast/regions/scrollable-region-content-size-relative.html: Added.
* fast/regions/scrollable-region-content-size-vert-rl-expected.html: Added.
* fast/regions/scrollable-region-content-size-vert-rl.html: Added.
* fast/regions/scrollable-region-content-size-vertical-lr-expected.html: Added.
* fast/regions/scrollable-region-content-size-vertical-lr.html: Added.
* fast/regions/scrollable-region-content-size.html: Added.
* fast/regions/scrollable-region-scrollable-content-expected.html: Added.
* fast/regions/scrollable-region-scrollable-content.html: Added.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsChangeLog">trunk/LayoutTests/ChangeLog</a></li>
<li><a href="#trunkLayoutTestsfastregionscliptopaddingboxmarginshtml">trunk/LayoutTests/fast/regions/clip-to-padding-box-margins.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollablelastregionexpectedhtml">trunk/LayoutTests/fast/regions/scrollable-last-region-expected.html</a></li>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCorerenderingRenderFlowThreadcpp">trunk/Source/WebCore/rendering/RenderFlowThread.cpp</a></li>
<li><a href="#trunkSourceWebCorerenderingRenderRegioncpp">trunk/Source/WebCore/rendering/RenderRegion.cpp</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizeexpectedhtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizehorizbtexpectedhtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-horiz-bt-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizehorizbthtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-horiz-bt.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizenooverflowexpectedhtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizenooverflowhorizbtexpectedhtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-horiz-bt-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizenooverflowhorizbthtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-horiz-bt.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizenooverflowvertrlexpectedhtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-vert-rl-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizenooverflowvertrlhtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-vert-rl.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizenooverflowhtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizerelativeexpectedhtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-relative-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizerelativehtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-relative.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizevertrlexpectedhtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-vert-rl-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizevertrlhtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-vert-rl.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizeverticallrexpectedhtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-vertical-lr-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizeverticallrhtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size-vertical-lr.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregioncontentsizehtml">trunk/LayoutTests/fast/regions/scrollable-region-content-size.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregionscrollablecontentexpectedhtml">trunk/LayoutTests/fast/regions/scrollable-region-scrollable-content-expected.html</a></li>
<li><a href="#trunkLayoutTestsfastregionsscrollableregionscrollablecontenthtml">trunk/LayoutTests/fast/regions/scrollable-region-scrollable-content.html</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (165963 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog 2014-03-20 14:20:22 UTC (rev 165963)
+++ trunk/LayoutTests/ChangeLog 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -1,3 +1,33 @@
</span><ins>+2014-03-20 Radu Stavila <stavila@adobe.com>
+
+ [CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly
+ https://bugs.webkit.org/show_bug.cgi?id=129487
+
+ Reviewed by Andrei Bucur.
+
+ Added tests for different situations using scrollable regions and fixed a couple existing tests.
+
+ * fast/regions/clip-to-padding-box-margins.html: overflow-x and overflow-y cannot be hidden & visible.
+ * fast/regions/scrollable-last-region-expected.html: "hack" no longer needed now that the scroll content size is properly computed.
+ * fast/regions/scrollable-region-content-size-expected.html: Added.
+ * fast/regions/scrollable-region-content-size-horiz-bt-expected.html: Added.
+ * fast/regions/scrollable-region-content-size-horiz-bt.html: Added.
+ * fast/regions/scrollable-region-content-size-no-overflow-expected.html: Added.
+ * fast/regions/scrollable-region-content-size-no-overflow-horiz-bt-expected.html: Added.
+ * fast/regions/scrollable-region-content-size-no-overflow-horiz-bt.html: Added.
+ * fast/regions/scrollable-region-content-size-no-overflow-vert-rl-expected.html: Added.
+ * fast/regions/scrollable-region-content-size-no-overflow-vert-rl.html: Added.
+ * fast/regions/scrollable-region-content-size-no-overflow.html: Added.
+ * fast/regions/scrollable-region-content-size-relative-expected.html: Added.
+ * fast/regions/scrollable-region-content-size-relative.html: Added.
+ * fast/regions/scrollable-region-content-size-vert-rl-expected.html: Added.
+ * fast/regions/scrollable-region-content-size-vert-rl.html: Added.
+ * fast/regions/scrollable-region-content-size-vertical-lr-expected.html: Added.
+ * fast/regions/scrollable-region-content-size-vertical-lr.html: Added.
+ * fast/regions/scrollable-region-content-size.html: Added.
+ * fast/regions/scrollable-region-scrollable-content-expected.html: Added.
+ * fast/regions/scrollable-region-scrollable-content.html: Added.
+
</ins><span class="cx"> 2014-03-20 Zalan Bujtas <zalan@apple.com>
</span><span class="cx">
</span><span class="cx"> Subpixel rendering: Nested layers with subpixel accumulation paint to wrong position.
</span></span></pre></div>
<a id="trunkLayoutTestsfastregionscliptopaddingboxmarginshtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/regions/clip-to-padding-box-margins.html (165963 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/clip-to-padding-box-margins.html 2014-03-20 14:20:22 UTC (rev 165963)
+++ trunk/LayoutTests/fast/regions/clip-to-padding-box-margins.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -16,8 +16,7 @@
</span><span class="cx"> width: 60px;
</span><span class="cx"> padding: 10px 20px 30px 40px;
</span><span class="cx"> border: double 10px Gray;
</span><del>- overflow-x: hidden;
- overflow-y: visible;
</del><ins>+ overflow: hidden;
</ins><span class="cx"> background-color: #eee;
</span><span class="cx"> }
</span><span class="cx"> </style>
</span></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollablelastregionexpectedhtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/regions/scrollable-last-region-expected.html (165963 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-last-region-expected.html 2014-03-20 14:20:22 UTC (rev 165963)
+++ trunk/LayoutTests/fast/regions/scrollable-last-region-expected.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -77,7 +77,7 @@
</span><span class="cx"> <div class="region" id="region3">
</span><span class="cx"> <div id="container3" class="container">
</span><span class="cx"> <div>lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
</span><del>- <div style="color:red; height:491px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
</del><ins>+ <div style="color:red">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
</ins><span class="cx"> </div>
</span><span class="cx"> </div>
</span><span class="cx"> </body>
</span></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizeexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-expected.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-expected.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-expected.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,41 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace;">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollTop = 10000;
+ }
+ </script>
+
+ <style>
+ #container {
+ border: 2px solid green;
+ height: 300px;
+ overflow: visible;
+ margin: 60px;
+ }
+
+ #region {
+ width: 600px;
+ height: 200px;
+ border: thick solid blue;
+ padding: 50px;
+ padding-bottom: 40px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">END</span> word is visible and there is no more white space after that last line.</p>
+
+ <div id="region">
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span>.</div>
+ </div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizehorizbtexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-horiz-bt-expected.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-horiz-bt-expected.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-horiz-bt-expected.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,43 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace;">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollTop = -10000;
+ }
+ </script>
+
+ <style>
+ html {
+ -webkit-writing-mode: horizontal-bt;
+ }
+
+ #container {
+ height: 300px;
+ overflow: visible;
+ }
+
+ #region {
+ width: 400px;
+ height: 300px;
+ border: thick solid blue;
+ padding: 50px;
+ padding-bottom: 40px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">green</span> word at the end of the text is visible and there is no more white space after that last line.</p>
+
+ <div id="region">
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span></div>
+ </div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizehorizbthtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-horiz-bt.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-horiz-bt.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-horiz-bt.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,45 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace;">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollTop = -10000;
+ }
+ </script>
+
+ <style>
+ html {
+ -webkit-writing-mode: horizontal-bt;
+ }
+
+ #container {
+ height: 300px;
+ overflow: visible;
+ -webkit-flow-into: flow;
+ }
+
+ #region {
+ width: 400px;
+ height: 300px;
+ -webkit-flow-from: flow;
+ border: thick solid blue;
+ padding: 50px;
+ padding-bottom: 40px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">green</span> word at the end of the text is visible and there is no more white space after that last line.</p>
+
+ <div id="region"></div>
+
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span></div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizenooverflowexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-expected.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-expected.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-expected.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,40 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace;">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollTop = 10000;
+ }
+ </script>
+
+ <style>
+ #container {
+ border: 2px solid green;
+ height: 500px;
+ overflow: visible;
+ }
+
+ #region {
+ width: 600px;
+ height: 200px;
+ border: thick solid blue;
+ padding: 10px;
+ padding-bottom: 40px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">END</span> word is visible and there is no more white space after that last line.</p>
+
+ <div id="region">
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span>.</div>
+ </div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizenooverflowhorizbtexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-horiz-bt-expected.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-horiz-bt-expected.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-horiz-bt-expected.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,44 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace;">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollTop = -10000;
+ }
+ </script>
+
+ <style>
+ html {
+ -webkit-writing-mode: horizontal-bt;
+ }
+
+ #container {
+ border-top: 10px solid green;
+ height: 450px;
+ overflow: visible;
+ }
+
+ #region {
+ width: 600px;
+ height: 200px;
+ border: thick solid blue;
+ padding: 50px;
+ padding-bottom: 10px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">END</span> word is visible and there is a 50px padding visible above the <span style="color:green">green</span> line.</p>
+
+ <div id="region">
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span></div>
+ </div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizenooverflowhorizbthtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-horiz-bt.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-horiz-bt.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-horiz-bt.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,46 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace;">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollTop = -10000;
+ }
+ </script>
+
+ <style>
+ html {
+ -webkit-writing-mode: horizontal-bt;
+ }
+
+ #container {
+ border-top: 10px solid green;
+ height: 450px;
+ overflow: visible;
+ -webkit-flow-into: flow;
+ }
+
+ #region {
+ width: 600px;
+ height: 200px;
+ -webkit-flow-from: flow;
+ border: thick solid blue;
+ padding: 50px;
+ padding-bottom: 10px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">END</span> word is visible and there is a 50px padding visible above the <span style="color:green">green</span> line.</p>
+
+ <div id="region"></div>
+
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span></div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizenooverflowvertrlexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-vert-rl-expected.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-vert-rl-expected.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-vert-rl-expected.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,46 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace; font-family: Ahem">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollLeft = -10000;
+ }
+ </script>
+
+ <style>
+ html {
+ -webkit-writing-mode: vertical-rl;
+ }
+
+ #container {
+ border-left: 10px solid green;
+ height: 300px;
+ overflow: visible;
+ }
+
+ #region {
+ width: 400px;
+ height: 320px;
+ border: thick solid blue;
+ padding: 10px;
+ padding-left: 50px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <div style="font-family: Arial">
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">END</span> word is visible and there is a 50px padding visible to the left of the <span style="color:green">green</span> line.</p>
+ </div>
+
+ <div id="region">
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span></div>
+ </div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizenooverflowvertrlhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-vert-rl.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-vert-rl.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow-vert-rl.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,48 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace; font-family: Ahem">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollLeft = -10000;
+ }
+ </script>
+
+ <style>
+ html {
+ -webkit-writing-mode: vertical-rl;
+ }
+
+ #container {
+ border-left: 10px solid green;
+ height: 300px;
+ overflow: visible;
+ -webkit-flow-into: flow;
+ }
+
+ #region {
+ width: 400px;
+ height: 320px;
+ -webkit-flow-from: flow;
+ border: thick solid blue;
+ padding: 10px;
+ padding-left: 50px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <div style="font-family: Arial">
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">END</span> word is visible and there is a 50px padding visible to the left of the <span style="color:green">green</span> line.</p>
+ </div>
+
+ <div id="region"></div>
+
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span></div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizenooverflowhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-no-overflow.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,42 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace;">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollTop = 10000;
+ }
+ </script>
+
+ <style>
+ #container {
+ border: 2px solid green;
+ height: 500px;
+ overflow: visible;
+ -webkit-flow-into: flow;
+ }
+
+ #region {
+ width: 600px;
+ height: 200px;
+ -webkit-flow-from: flow;
+ border: thick solid blue;
+ padding: 10px;
+ padding-bottom: 40px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">END</span> word is visible and there is no more white space after that last line.</p>
+
+ <div id="region"></div>
+
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span>.</div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizerelativeexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-relative-expected.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-relative-expected.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-relative-expected.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,42 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace;">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollTop = 10000;
+ }
+ </script>
+
+ <style>
+ #container {
+ border: 2px solid green;
+ height: 300px;
+ overflow: visible;
+ position: relative;
+ top: 100px;
+ }
+
+ #region {
+ width: 600px;
+ height: 200px;
+ border: thick solid blue;
+ padding: 50px;
+ padding-bottom: 40px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">END</span> word is visible and there is no more white space after that last line.</p>
+
+ <div id="region">
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span>.</div>
+ </div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizerelativehtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-relative.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-relative.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-relative.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,44 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace;">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollTop = 10000;
+ }
+ </script>
+
+ <style>
+ #container {
+ border: 2px solid green;
+ height: 300px;
+ overflow: visible;
+ -webkit-flow-into: flow;
+ position: relative;
+ top: 100px;
+ }
+
+ #region {
+ width: 600px;
+ height: 200px;
+ -webkit-flow-from: flow;
+ border: thick solid blue;
+ padding: 50px;
+ padding-bottom: 40px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">END</span> word is visible and there is no more white space after that last line.</p>
+
+ <div id="region"></div>
+
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span>.</div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizevertrlexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-vert-rl-expected.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-vert-rl-expected.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-vert-rl-expected.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,48 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace; font-family: Ahem">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollLeft = 10000;
+ }
+ </script>
+
+ <style>
+ html {
+ -webkit-writing-mode: vertical-lr;
+ }
+
+ #container {
+ border: 2px solid green;
+ width: 300px;
+ overflow: visible;
+ margin-left: 50px;
+ margin-right: 50px;
+ }
+
+ #region {
+ width: 400px;
+ height: 300px;
+ border: thick solid blue;
+ padding: 50px;
+ padding-bottom: 40px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <div style="font-family: Arial">
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">green</span> word at the end of the text is visible and there is no more white space after that last line.</p>
+ </div>
+
+ <div id="region">
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span></div>
+ </div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizevertrlhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-vert-rl.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-vert-rl.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-vert-rl.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,50 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace; font-family: Ahem">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollLeft = 10000;
+ }
+ </script>
+
+ <style>
+ html {
+ -webkit-writing-mode: vertical-lr;
+ }
+
+ #container {
+ border: 2px solid green;
+ width: 300px;
+ overflow: visible;
+ margin-left: 50px;
+ margin-right: 50px;
+ -webkit-flow-into: flow;
+ }
+
+ #region {
+ width: 400px;
+ height: 300px;
+ -webkit-flow-from: flow;
+ border: thick solid blue;
+ padding: 50px;
+ padding-bottom: 40px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <div style="font-family: Arial">
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">green</span> word at the end of the text is visible and there is no more white space after that last line.</p>
+ </div>
+
+ <div id="region"></div>
+
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span></div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizeverticallrexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-vertical-lr-expected.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-vertical-lr-expected.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-vertical-lr-expected.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,45 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace; font-family: Ahem">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollLeft = 10000;
+ }
+ </script>
+
+ <style>
+ html {
+ -webkit-writing-mode: vertical-lr;
+ }
+
+ #container {
+ width: 300px;
+ overflow: visible;
+ }
+
+ #region {
+ width: 400px;
+ height: 300px;
+ border: thick solid blue;
+ padding: 50px;
+ padding-bottom: 40px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <div style="font-family: Arial">
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">green</span> word at the end of the text is visible and there is no more white space after that last line.</p>
+ </div>
+
+ <div id="region">
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span></div>
+ </div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizeverticallrhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size-vertical-lr.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size-vertical-lr.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size-vertical-lr.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,47 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace; font-family: Ahem">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollLeft = 10000;
+ }
+ </script>
+
+ <style>
+ html {
+ -webkit-writing-mode: vertical-lr;
+ }
+
+ #container {
+ width: 300px;
+ overflow: visible;
+ -webkit-flow-into: flow;
+ }
+
+ #region {
+ width: 400px;
+ height: 300px;
+ -webkit-flow-from: flow;
+ border: thick solid blue;
+ padding: 50px;
+ padding-bottom: 40px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <div style="font-family: Arial">
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">green</span> word at the end of the text is visible and there is no more white space after that last line.</p>
+ </div>
+
+ <div id="region"></div>
+
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span></div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregioncontentsizehtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-content-size.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-content-size.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-content-size.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,43 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace;">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("region").scrollTop = 10000;
+ }
+ </script>
+
+ <style>
+ #container {
+ border: 2px solid green;
+ height: 300px;
+ overflow: visible;
+ margin: 60px;
+ -webkit-flow-into: flow;
+ }
+
+ #region {
+ width: 600px;
+ height: 200px;
+ -webkit-flow-from: flow;
+ border: thick solid blue;
+ padding: 50px;
+ padding-bottom: 40px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">END</span> word is visible and there is no more white space after that last line.</p>
+
+ <div id="region"></div>
+
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span>.</div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregionscrollablecontentexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-scrollable-content-expected.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-scrollable-content-expected.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-scrollable-content-expected.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,43 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace;">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("container").scrollTop = 10000;
+ document.getElementById("region").scrollTop = 10000;
+ }
+ </script>
+
+ <style>
+ #container {
+ border: thick solid green;
+ height: 250px;
+ overflow: scroll;
+ margin: 15px;
+ padding: 5px;
+ }
+
+ #region {
+ width: 600px;
+ height: 100px;
+ border: 2px solid blue;
+ margin: 10px;
+ padding: 35px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">END</span> word is visible and the region's 35px bottom padding is visible after the <span style="color:green">green box</span>.</p>
+
+ <div id="region">
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span></div>
+ </div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastregionsscrollableregionscrollablecontenthtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/regions/scrollable-region-scrollable-content.html (0 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/regions/scrollable-region-scrollable-content.html (rev 0)
+++ trunk/LayoutTests/fast/regions/scrollable-region-scrollable-content.html 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -0,0 +1,45 @@
</span><ins>+<!DOCTYPE html>
+<html style="font: 16px/1.25 monospace;">
+ <head>
+ <script type="text/javascript">
+ onload = function()
+ {
+ document.getElementById("container").scrollTop = 10000;
+ document.getElementById("region").scrollTop = 10000;
+ }
+ </script>
+
+ <style>
+ #container {
+ border: thick solid green;
+ height: 250px;
+ overflow: scroll;
+ margin: 15px;
+ padding: 5px;
+ -webkit-flow-into: flow;
+ }
+
+ #region {
+ width: 600px;
+ height: 100px;
+ -webkit-flow-from: flow;
+ border: 2px solid blue;
+ margin: 10px;
+ padding: 35px;
+ overflow: scroll;
+ }
+ </style>
+ </head>
+
+ <body>
+ <a style="font-size: 14px" href="https://bugs.webkit.org/show_bug.cgi?id=129487">[CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly</a>
+ <p>This test passes if the <span style="color:blue">region</span> properly scrolls its content to the bottom, the <span style="color:green">END</span> word is visible and the region's 35px bottom padding is visible after the <span style="color:green">green box</span>.</p>
+
+ <div id="region"></div>
+
+ <div id="container">
+ <div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
+ <div style="color:blue">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent interdum, sapien vitae faucibus suscipit, massa urna sagittis libero, ac imperdiet elit lacus a ligula. Mauris a orci sem. Nullam ullamcorper ornare porttitor. Morbi laoreet pellentesque diam, vitae hendrerit sem fringilla id. Maecenas rutrum lacinia lobortis. Praesent elit lectus, porttitor sed semper vel, fringilla id dolor. Sed lacus nisl, rutrum sit amet euismod a, vulputate quis elit. Fusce commodo dui quis lacus viverra vel egestas velit tempus. Donec ut sapien sit amet purus luctus fermentum. Donec eleifend pretium neque quis bibendum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam congue dapibus mi, id ultricies est sagittis et. Integer posuere, eros vitae laoreet congue, tortor purus euismod nibh, eu porta purus arcu id turpis. Donec vitae ultricies nibh. Nullam in urna dolor, at fringilla lorem. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<span style="color:green">END</span></div>
+ </div>
+ </body>
+</html>
</ins></span></pre></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (165963 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog 2014-03-20 14:20:22 UTC (rev 165963)
+++ trunk/Source/WebCore/ChangeLog 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -1,3 +1,31 @@
</span><ins>+2014-03-20 Radu Stavila <stavila@adobe.com>
+
+ [CSS Regions] The height of a scrollable element flowed inside a scrollable region is not computed correctly
+ https://bugs.webkit.org/show_bug.cgi?id=129487
+
+ Reviewed by Andrei Bucur.
+
+ When propagating the layout overflow from the flowed element up to the flow thread itself,
+ the region's logical bottom padding and the element's logical bottom margin must be taken into consideration.
+ However, if the flowed element has overflow, the overflow will be painted over the region's padding
+ and the element's margin, in order to be compatible with the non-regions case.
+ More info can be found here: http://lists.w3.org/Archives/Public/www-style/2014Jan/0089.html
+
+ Tests: fast/regions/scrollable-region-content-size-horiz-bt.html
+ fast/regions/scrollable-region-content-size-no-overflow-horiz-bt.html
+ fast/regions/scrollable-region-content-size-no-overflow-vert-rl.html
+ fast/regions/scrollable-region-content-size-no-overflow.html
+ fast/regions/scrollable-region-content-size-relative.html
+ fast/regions/scrollable-region-content-size-vert-rl.html
+ fast/regions/scrollable-region-content-size-vertical-lr.html
+ fast/regions/scrollable-region-content-size.html
+ fast/regions/scrollable-region-scrollable-content.html
+
+ * rendering/RenderFlowThread.cpp:
+ (WebCore::RenderFlowThread::addRegionsOverflowFromChild):
+ * rendering/RenderRegion.cpp:
+ (WebCore::RenderRegion::rectFlowPortionForBox):
+
</ins><span class="cx"> 2014-03-20 Zalan Bujtas <zalan@apple.com>
</span><span class="cx">
</span><span class="cx"> Subpixel rendering: Nested layers with subpixel accumulation paint to wrong position.
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingRenderFlowThreadcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/RenderFlowThread.cpp (165963 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/RenderFlowThread.cpp 2014-03-20 14:20:22 UTC (rev 165963)
+++ trunk/Source/WebCore/rendering/RenderFlowThread.cpp 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -1342,6 +1342,33 @@
</span><span class="cx">
</span><span class="cx"> LayoutRect childLayoutOverflowRect = region->layoutOverflowRectForBoxForPropagation(child);
</span><span class="cx"> childLayoutOverflowRect.move(delta);
</span><ins>+
+ // When propagating the layout overflow to the flow thread object, make sure to include
+ // the logical bottom padding of the scrollable region and the bottom margin of the flowed element.
+ // In order to behave in a similar manner to the non-regions case, content overflowing the box
+ // flowed into the region must be painted on top of the region's padding and the box's margin.
+ // See http://lists.w3.org/Archives/Public/www-style/2014Jan/0089.html
+ if (box->isRenderNamedFlowThread()) {
+ ASSERT(box == this);
+ RenderBlockFlow& fragmentContainer = toRenderNamedFlowFragment(region)->fragmentContainer();
+ LayoutUnit spacingAfterLayout = fragmentContainer.paddingAfter() + child->marginAfter();
+ if (isHorizontalWritingMode()) {
+ if (fragmentContainer.scrollsOverflowY()) {
+ LayoutUnit layoutMaxLogicalY = child->frameRect().maxY() + spacingAfterLayout;
+ LayoutUnit maxYDiff = layoutMaxLogicalY - childLayoutOverflowRect.maxY();
+ if (maxYDiff > 0)
+ childLayoutOverflowRect.expand(0, maxYDiff);
+ }
+ } else {
+ if (fragmentContainer.scrollsOverflowX()) {
+ LayoutUnit layoutMaxLogicalY = child->frameRect().maxX() + spacingAfterLayout;
+ LayoutUnit maxYDiff = layoutMaxLogicalY - childLayoutOverflowRect.maxX();
+ if (maxYDiff > 0)
+ childLayoutOverflowRect.expand(maxYDiff, 0);
+ }
+ }
+ }
+
</ins><span class="cx"> region->addLayoutOverflowForBox(box, childLayoutOverflowRect);
</span><span class="cx">
</span><span class="cx"> if (child->hasSelfPaintingLayer() || box->hasOverflowClip()) {
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingRenderRegioncpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/RenderRegion.cpp (165963 => 165964)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/RenderRegion.cpp 2014-03-20 14:20:22 UTC (rev 165963)
+++ trunk/Source/WebCore/rendering/RenderRegion.cpp 2014-03-20 15:01:12 UTC (rev 165964)
</span><span class="lines">@@ -489,16 +489,6 @@
</span><span class="cx"> }
</span><span class="cx"> }
</span><span class="cx">
</span><del>- if (shouldClipFlowThreadContent()) {
- LayoutRect portionRect;
- if (isRenderNamedFlowFragment())
- portionRect = toRenderNamedFlowFragment(this)->flowThreadPortionRectForClipping(this == startRegion, this == endRegion);
- else
- portionRect = flowThreadPortionRect();
-
- mappedRect.intersect(portionRect);
- }
-
</del><span class="cx"> return mappedRect.isEmpty() ? mappedRect : m_flowThread->mapFromFlowThreadToLocal(box, mappedRect);
</span><span class="cx"> }
</span><span class="cx">
</span></span></pre>
</div>
</div>
</body>
</html>