<!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>[201677] 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/201677">201677</a></dd>
<dt>Author</dt> <dd>mmaxfield@apple.com</dd>
<dt>Date</dt> <dd>2016-06-03 19:04:58 -0700 (Fri, 03 Jun 2016)</dd>
</dl>
<h3>Log Message</h3>
<pre>Bopomofo ruby in Dictionary.app is written horizontally (when it should be written vertically)
https://bugs.webkit.org/show_bug.cgi?id=158245
<rdar://problem/25675318>
Reviewed by Darin Adler.
Source/WebCore:
With orthogonal flows, the inner element gets a logical width that is computed from two values:
- The containing block's available logical height
- The FrameView's visibleHeight
In Dictionary.app, the FrameView's height changes, but this element doesn't get relaid out.
This is because of our optimization where normal-flow elements don't get relaid out if their
parent's width doesn't change (which is the case here).
Therefore, this orthogonal writing mode element should be relaid out when the FrameView changes
size. Luckily, we already have machinery for doing this: percentage heights. In quirks mode, a
div with a percentage height may walk arbitrarily far up the DOM tree in order to determine which
element the percentage should be resolved against. Therefore, we have a map of percentage-sizing-
ancestors to percentage-sizing-descendants which speeds up this search. If a percentage-sizing-
ancestor gets relaid out, all the relevant percentage-sizing-descendants get relaid out too.
Therefore, we can simply mark the FrameView as a percentage-sizing-ancestor and the orthogonal
flow element as a percentage-sizing-descendant. The lifetime of this relationship is already
managed correctly - it gets reset when style changes and when the renderer is destroyed, and
is created during layout.
Unfortunately, this same treatment should also be done to the element which dictates the
containing block's logical height (which caused https://bugs.webkit.org/show_bug.cgi?id=158286).
Implementing this would require giving RenderBox::availableLogicalHeight() a second result
of the necessary element which dictates the return. In an effort to keep this patch small and
focused, I'll do this secondary (much larger) work in a patch on that bug. This patch,
therefore, is kept small and focused.
Test: fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout.html
* rendering/RenderBox.cpp:
(WebCore::RenderBox::perpendicularContainingBlockLogicalHeight):
LayoutTests:
Rebaselined fast/table/border-collapsing/004-vertical.html to show a progression.
* fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout-expected.html: Added.
* fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout.html: Added.
* platform/mac/fast/table/border-collapsing/004-vertical-expected.png: Rebased
* platform/mac/fast/table/border-collapsing/004-vertical-expected.txt: Rebased</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsChangeLog">trunk/LayoutTests/ChangeLog</a></li>
<li><a href="#trunkLayoutTestsplatformmacfasttablebordercollapsing004verticalexpectedpng">trunk/LayoutTests/platform/mac/fast/table/border-collapsing/004-vertical-expected.png</a></li>
<li><a href="#trunkLayoutTestsplatformmacfasttablebordercollapsing004verticalexpectedtxt">trunk/LayoutTests/platform/mac/fast/table/border-collapsing/004-vertical-expected.txt</a></li>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCorerenderingRenderBoxcpp">trunk/Source/WebCore/rendering/RenderBox.cpp</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsfasttextorthogonalwritingmodecontainingblockframeViewresizerelayoutexpectedhtml">trunk/LayoutTests/fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout-expected.html</a></li>
<li><a href="#trunkLayoutTestsfasttextorthogonalwritingmodecontainingblockframeViewresizerelayouthtml">trunk/LayoutTests/fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout.html</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (201676 => 201677)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog 2016-06-04 02:00:50 UTC (rev 201676)
+++ trunk/LayoutTests/ChangeLog 2016-06-04 02:04:58 UTC (rev 201677)
</span><span class="lines">@@ -1,5 +1,20 @@
</span><span class="cx"> 2016-06-03 Myles C. Maxfield <mmaxfield@apple.com>
</span><span class="cx">
</span><ins>+ Bopomofo ruby in Dictionary.app is written horizontally (when it should be written vertically)
+ https://bugs.webkit.org/show_bug.cgi?id=158245
+ <rdar://problem/25675318>
+
+ Reviewed by Darin Adler.
+
+ Rebaselined fast/table/border-collapsing/004-vertical.html to show a progression.
+
+ * fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout-expected.html: Added.
+ * fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout.html: Added.
+ * platform/mac/fast/table/border-collapsing/004-vertical-expected.png: Rebased
+ * platform/mac/fast/table/border-collapsing/004-vertical-expected.txt: Rebased
+
+2016-06-03 Myles C. Maxfield <mmaxfield@apple.com>
+
</ins><span class="cx"> Text not visible while external font downloading
</span><span class="cx"> https://bugs.webkit.org/show_bug.cgi?id=25207
</span><span class="cx"> <rdar://problem/15167413>
</span></span></pre></div>
<a id="trunkLayoutTestsfasttextorthogonalwritingmodecontainingblockframeViewresizerelayoutexpectedhtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout-expected.html (0 => 201677)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout-expected.html (rev 0)
+++ trunk/LayoutTests/fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout-expected.html 2016-06-04 02:04:58 UTC (rev 201677)
</span><span class="lines">@@ -0,0 +1,23 @@
</span><ins>+<!DOCTYPE html>
+<html>
+<head>
+<meta charset='utf-8'>
+</head>
+<body>
+This test makes sure that resizing the FrameView causes content with an orthogonal containing block to relayout. The test passes if the Chinese characters below are written vertically.
+<div>
+<iframe id="iframe" style="width: 700px; height: 500px; border: 0px;" srcdoc="<!DOCTYPE html>
+<html>
+<head>
+<meta charset='utf-8'>
+</head>
+<body>
+<div id='probe' style='-webkit-writing-mode: vertical-rl'>
+中华人民共和国
+</div>
+<div style='width: 1px; height: 2000px; position: absolute; left: 0px; top: 0px;'></div>
+</body>
+</html>"></iframe>
+</div>
+</body>
+</html>
</ins><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkLayoutTestsfasttextorthogonalwritingmodecontainingblockframeViewresizerelayouthtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout.html (0 => 201677)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout.html (rev 0)
+++ trunk/LayoutTests/fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout.html 2016-06-04 02:04:58 UTC (rev 201677)
</span><span class="lines">@@ -0,0 +1,36 @@
</span><ins>+<!DOCTYPE html>
+<html>
+<head>
+<meta charset='utf-8'>
+</head>
+<body>
+This test makes sure that resizing the FrameView causes content with an orthogonal containing block to relayout. The test passes if the Chinese characters below are written vertically.
+<div>
+<iframe id="iframe" style="width: 700px; height: 0px; border: 0px;" srcdoc="<!DOCTYPE html>
+<html>
+<head>
+<meta charset='utf-8'>
+</head>
+<body>
+<div id='probe' style='-webkit-writing-mode: vertical-rl'>
+中华人民共和国
+</div>
+<div style='width: 1px; height: 2000px; position: absolute; left: 0px; top: 0px;'></div>
+</body>
+</html>"></iframe>
+</div>
+<script>
+if (window.testRunner)
+ testRunner.waitUntilDone();
+
+var iframe = document.getElementById("iframe");
+iframe.addEventListener("load", function() {
+ window.setTimeout(function() {
+ document.getElementById("iframe").style.height = "500px";
+ if (window.testRunner)
+ testRunner.notifyDone();
+ }, 0);
+});
+</script>
+</body>
+</html>
</ins><span class="cx">\ No newline at end of file
</span></span></pre></div>
<a id="trunkLayoutTestsplatformmacfasttablebordercollapsing004verticalexpectedpng"></a>
<div class="binary"><h4>Modified: trunk/LayoutTests/platform/mac/fast/table/border-collapsing/004-vertical-expected.png</h4>
<pre class="diff"><span>
<span class="cx">(Binary files differ)
</span></span></pre></div>
<a id="trunkLayoutTestsplatformmacfasttablebordercollapsing004verticalexpectedtxt"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/platform/mac/fast/table/border-collapsing/004-vertical-expected.txt (201676 => 201677)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/platform/mac/fast/table/border-collapsing/004-vertical-expected.txt 2016-06-04 02:00:50 UTC (rev 201676)
+++ trunk/LayoutTests/platform/mac/fast/table/border-collapsing/004-vertical-expected.txt 2016-06-04 02:04:58 UTC (rev 201677)
</span><span class="lines">@@ -1,8 +1,8 @@
</span><del>-layer at (0,0) size 1532x899
</del><ins>+layer at (0,0) size 1550x884
</ins><span class="cx"> RenderView at (0,0) size 785x585
</span><del>-layer at (0,0) size 785x899
- RenderBlock {HTML} at (0,0) size 785x899
- RenderBody {BODY} at (8,21) size 769x870
</del><ins>+layer at (0,0) size 785x884
+ RenderBlock {HTML} at (0,0) size 785x884
+ RenderBody {BODY} at (8,21) size 769x855
</ins><span class="cx"> RenderBlock {H1} at (0,0) size 769x37
</span><span class="cx"> RenderText {#text} at (0,0) size 289x37
</span><span class="cx"> text run at (0,0) width 289: "Table Border Models"
</span><span class="lines">@@ -29,30 +29,30 @@
</span><span class="cx"> text run at (0,135) width 453: "TABLE.five, TABLE.five TD, TABLE.five TH { border: none; }"
</span><span class="cx"> text run at (0,150) width 671: "TABLE.five TR, TABLE.five COL, TABLE.five COLGROUP, TABLE.five TBODY, TABLE.five THEAD"
</span><span class="cx"> text run at (0,165) width 258: " { border: medium solid red; }"
</span><del>- RenderBlock {DIV} at (0,285) size 1524x585
- RenderTable {TABLE} at (16,16) size 238x552 [border: (1px solid #0000FF)]
- RenderTableSection {TBODY} at (1,1) size 235x549
- RenderTableRow {TR} at (0,0) size 31x549
- RenderTableCell {TH} at (0,0) size 31x184 [border: (2px solid #800080)] [r=0 c=0 rs=1 cs=1]
- RenderText {#text} at (6,51) size 18x83
- text run at (6,51) width 83: "Header One"
- RenderTableCell {TH} at (0,183) size 31x175 [border: (2px solid #800080)] [r=0 c=1 rs=1 cs=1]
- RenderText {#text} at (6,45) size 18x85
- text run at (6,45) width 84: "Header Two"
- RenderTableCell {TH} at (0,357) size 31x193 [border: (2px solid #800080)] [r=0 c=2 rs=1 cs=1]
- RenderText {#text} at (6,48) size 18x96
- text run at (6,48) width 95: "Header Three"
- RenderTableRow {TR} at (0,31) size 102x549
- RenderTableCell {TD} at (31,27) size 102x130 [border: (2px solid #008000)] [r=1 c=0 rs=1 cs=1]
</del><ins>+ RenderBlock {DIV} at (0,285) size 1542x570
+ RenderTable {TABLE} at (16,16) size 238x537 [border: (1px solid #0000FF)]
+ RenderTableSection {TBODY} at (1,1) size 235x534
+ RenderTableRow {TR} at (0,0) size 31x534
+ RenderTableCell {TH} at (0,0) size 31x179 [border: (2px solid #800080)] [r=0 c=0 rs=1 cs=1]
+ RenderText {#text} at (6,48) size 18x84
+ text run at (6,48) width 83: "Header One"
+ RenderTableCell {TH} at (0,178) size 31x170 [border: (2px solid #800080)] [r=0 c=1 rs=1 cs=1]
+ RenderText {#text} at (6,43) size 18x84
+ text run at (6,43) width 84: "Header Two"
+ RenderTableCell {TH} at (0,347) size 31x188 [border: (2px solid #800080)] [r=0 c=2 rs=1 cs=1]
+ RenderText {#text} at (6,46) size 18x96
+ text run at (6,46) width 95: "Header Three"
+ RenderTableRow {TR} at (0,31) size 102x534
+ RenderTableCell {TD} at (31,27) size 102x125 [border: (2px solid #008000)] [r=1 c=0 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (33,-20) size 36x161
</span><span class="cx"> text run at (33,-20) width 119: "This table uses the"
</span><span class="cx"> text run at (51,-20) width 161: "collapsed borders model."
</span><del>- RenderTableCell {TD} at (31,201) size 102x139 [border: (1px solid #008000)] [r=1 c=1 rs=1 cs=1]
- RenderText {#text} at (24,-12) size 54x163
- text run at (24,-12) width 163: "This means that elements"
- text run at (42,-12) width 146: "within the cell have no"
- text run at (60,-12) width 100: "border-spacing."
- RenderTableCell {TD} at (31,357) size 102x193 [border: (1px solid #008000)] [r=1 c=2 rs=1 cs=1]
</del><ins>+ RenderTableCell {TD} at (31,196) size 102x134 [border: (1px solid #008000)] [r=1 c=1 rs=1 cs=1]
+ RenderText {#text} at (24,-12) size 54x154
+ text run at (24,-12) width 102: "This means that"
+ text run at (42,-12) width 153: "elements within the cell"
+ text run at (60,-12) width 154: "have no border-spacing."
+ RenderTableCell {TD} at (31,347) size 102x188 [border: (1px solid #008000)] [r=1 c=2 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (6,6) size 90x172
</span><span class="cx"> text run at (6,6) width 139: "Since it has collapsed"
</span><span class="cx"> text run at (24,6) width 172: "borders, the borders on the"
</span><span class="lines">@@ -60,8 +60,8 @@
</span><span class="cx"> text run at (42,89) width 76: "on all sides,"
</span><span class="cx"> text run at (60,6) width 154: "should be medium solid"
</span><span class="cx"> text run at (78,6) width 45: "purple."
</span><del>- RenderTableRow {TR} at (0,133) size 102x549
- RenderTableCell {TD} at (133,0) size 102x184 [border: (2px solid #008000)] [r=2 c=0 rs=1 cs=1]
</del><ins>+ RenderTableRow {TR} at (0,133) size 102x534
+ RenderTableCell {TD} at (133,0) size 102x179 [border: (2px solid #008000)] [r=2 c=0 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (5,7) size 90x157
</span><span class="cx"> text run at (5,7) width 147: "The border of the table"
</span><span class="cx"> text run at (23,7) width 155: "itself should be medium"
</span><span class="lines">@@ -69,7 +69,7 @@
</span><span class="cx"> text run at (41,123) width 40: "where"
</span><span class="cx"> text run at (59,7) width 157: "header cells override the"
</span><span class="cx"> text run at (77,7) width 45: "border."
</span><del>- RenderTableCell {TD} at (133,183) size 102x175 [border: (1px solid #008000)] [r=2 c=1 rs=1 cs=1]
</del><ins>+ RenderTableCell {TD} at (133,178) size 102x170 [border: (1px solid #008000)] [r=2 c=1 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (5,6) size 90x154
</span><span class="cx"> text run at (5,6) width 115: "The borders that I"
</span><span class="cx"> text run at (23,6) width 97: "haven't already"
</span><span class="lines">@@ -77,7 +77,7 @@
</span><span class="cx"> text run at (59,6) width 53: "internal "
</span><span class="cx"> text run at (59,58) width 101: "ones) should be"
</span><span class="cx"> text run at (77,6) width 104: "thin solid green."
</span><del>- RenderTableCell {TD} at (133,357) size 102x193 [border: (1px solid #008000)] [r=2 c=2 rs=1 cs=1]
</del><ins>+ RenderTableCell {TD} at (133,347) size 102x188 [border: (1px solid #008000)] [r=2 c=2 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (5,6) size 72x156
</span><span class="cx"> text run at (5,6) width 156: "This table should have a"
</span><span class="cx"> text run at (23,6) width 146: "1em margin around all"
</span><span class="lines">@@ -90,49 +90,50 @@
</span><span class="cx"> text run at (59,129) width 44: "middle"
</span><span class="cx"> RenderText {#text} at (77,6) size 18x82
</span><span class="cx"> text run at (77,6) width 82: "of its border."
</span><del>- RenderTable {TABLE} at (270,16) size 290x552 [border: (3px solid #0000FF)]
- RenderTableSection {TBODY} at (3,3) size 284x546
- RenderTableRow {TR} at (0,16) size 34x546
- RenderTableCell {TH} at (16,16) size 34x119 [border: (3px solid #800080)] [r=0 c=0 rs=1 cs=1]
- RenderText {#text} at (8,17) size 18x84
- text run at (8,17) width 83: "Header One"
- RenderTableCell {TH} at (16,150) size 34x140 [border: (3px solid #800080)] [r=0 c=1 rs=1 cs=1]
- RenderText {#text} at (8,27) size 18x85
- text run at (8,27) width 84: "Header Two"
- RenderTableCell {TH} at (16,305) size 34x226 [border: (3px solid #800080)] [r=0 c=2 rs=1 cs=1]
- RenderText {#text} at (8,64) size 18x96
- text run at (8,64) width 95: "Header Three"
- RenderTableRow {TR} at (0,66) size 84x546
- RenderTableCell {TD} at (66,25) size 84x101 [border: (1px solid #008000)] [r=1 c=0 rs=1 cs=1]
- RenderText {#text} at (15,-3) size 54x96
- text run at (15,-3) width 96: "This table uses"
- text run at (33,-3) width 84: "the separated"
- text run at (51,-3) width 96: "borders model."
- RenderTableCell {TD} at (66,150) size 84x140 [border: (1px solid #008000)] [r=1 c=1 rs=1 cs=1]
- RenderText {#text} at (6,6) size 72x126
</del><ins>+ RenderTable {TABLE} at (270,16) size 308x537 [border: (3px solid #0000FF)]
+ RenderTableSection {TBODY} at (3,3) size 302x531
+ RenderTableRow {TR} at (0,16) size 34x531
+ RenderTableCell {TH} at (16,16) size 34x115 [border: (3px solid #800080)] [r=0 c=0 rs=1 cs=1]
+ RenderText {#text} at (8,15) size 18x84
+ text run at (8,15) width 83: "Header One"
+ RenderTableCell {TH} at (16,146) size 34x136 [border: (3px solid #800080)] [r=0 c=1 rs=1 cs=1]
+ RenderText {#text} at (8,25) size 18x85
+ text run at (8,25) width 84: "Header Two"
+ RenderTableCell {TH} at (16,297) size 34x219 [border: (3px solid #800080)] [r=0 c=2 rs=1 cs=1]
+ RenderText {#text} at (8,61) size 18x96
+ text run at (8,61) width 95: "Header Three"
+ RenderTableRow {TR} at (0,66) size 102x531
+ RenderTableCell {TD} at (66,34) size 102x79 [border: (1px solid #008000)] [r=1 c=0 rs=1 cs=1]
+ RenderText {#text} at (24,-12) size 54x96
+ text run at (24,-12) width 96: "This table uses"
+ text run at (42,-12) width 84: "the separated"
+ text run at (60,-12) width 96: "borders model."
+ RenderTableCell {TD} at (66,146) size 102x136 [border: (1px solid #008000)] [r=1 c=1 rs=1 cs=1]
+ RenderText {#text} at (6,6) size 90x113
</ins><span class="cx"> text run at (6,6) width 102: "This means that"
</span><del>- text run at (24,6) width 126: "elements within the"
- text run at (42,6) width 109: "cell have border-"
- text run at (60,6) width 102: "spacing of 1em."
- RenderTableCell {TD} at (66,314) size 84x208 [border: (1px solid #008000)] [r=1 c=2 rs=1 cs=1]
- RenderText {#text} at (15,-3) size 54x205
- text run at (15,-3) width 205: "The borders on the header cells,"
- text run at (33,-3) width 199: "on all sides, should be medium"
- text run at (51,-3) width 80: "solid purple."
- RenderTableRow {TR} at (0,166) size 102x546
- RenderTableCell {TD} at (166,16) size 102x119 [border: (1px solid #008000)] [r=2 c=0 rs=1 cs=1]
</del><ins>+ text run at (24,6) width 102: "elements within"
+ text run at (42,6) width 81: "the cell have"
+ text run at (60,6) width 113: "border-spacing of"
+ text run at (78,6) width 32: "1em."
+ RenderTableCell {TD} at (66,315) size 102x183 [border: (1px solid #008000)] [r=1 c=2 rs=1 cs=1]
+ RenderText {#text} at (24,-12) size 54x205
+ text run at (24,-12) width 205: "The borders on the header cells,"
+ text run at (42,-12) width 199: "on all sides, should be medium"
+ text run at (60,-12) width 80: "solid purple."
+ RenderTableRow {TR} at (0,184) size 102x531
+ RenderTableCell {TD} at (184,16) size 102x115 [border: (1px solid #008000)] [r=2 c=0 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (6,6) size 90x91
</span><span class="cx"> text run at (6,6) width 88: "The border of"
</span><span class="cx"> text run at (24,6) width 91: "the table itself"
</span><span class="cx"> text run at (42,6) width 62: "should be"
</span><span class="cx"> text run at (60,6) width 88: "medium solid"
</span><span class="cx"> text run at (78,6) width 32: "blue."
</span><del>- RenderTableCell {TD} at (166,168) size 102x104 [border: (1px solid #008000)] [r=2 c=1 rs=1 cs=1]
</del><ins>+ RenderTableCell {TD} at (184,164) size 102x100 [border: (1px solid #008000)] [r=2 c=1 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (24,-12) size 54x123
</span><span class="cx"> text run at (24,-12) width 95: "The borders of"
</span><span class="cx"> text run at (42,-12) width 113: "other cells should"
</span><span class="cx"> text run at (60,-12) width 123: "be thin solid green."
</span><del>- RenderTableCell {TD} at (166,314) size 102x208 [border: (1px solid #008000)] [r=2 c=2 rs=1 cs=1]
</del><ins>+ RenderTableCell {TD} at (184,306) size 102x201 [border: (1px solid #008000)] [r=2 c=2 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (15,-3) size 54x191
</span><span class="cx"> text run at (15,-3) width 188: "This table should have a 1em"
</span><span class="cx"> text run at (33,-3) width 162: "margin around all edges. "
</span><span class="lines">@@ -144,116 +145,119 @@
</span><span class="cx"> text run at (69,-3) width 68: "outer edge"
</span><span class="cx"> RenderText {#text} at (69,64) size 18x87
</span><span class="cx"> text run at (69,64) width 86: " of its border."
</span><del>- RenderTable {TABLE} at (576,16) size 348x552 [border: (3px solid #0000FF)]
- RenderTableSection {TBODY} at (3,3) size 342x546
- RenderTableRow {TR} at (0,8) size 34x546
- RenderTableCell {TH} at (8,0) size 34x142 [border: (3px solid #800080)] [r=0 c=0 rs=1 cs=1]
- RenderText {#text} at (8,29) size 18x84
- text run at (8,29) width 83: "Header One"
- RenderTableCell {TH} at (8,141) size 34x200 [border: (3px solid #800080)] [r=0 c=1 rs=1 cs=1]
- RenderText {#text} at (8,57) size 18x85
- text run at (8,57) width 84: "Header Two"
- RenderTableCell {TH} at (8,340) size 34x207 [border: (3px solid #800080)] [r=0 c=2 rs=1 cs=1]
- RenderText {#text} at (8,55) size 18x96
- text run at (8,55) width 95: "Header Three"
- RenderTableRow {TR} at (0,50) size 138x546
- RenderTableCell {TD} at (50,36) size 138x70 [border: (1px solid #008000)] [r=1 c=0 rs=1 cs=1]
</del><ins>+ RenderTable {TABLE} at (594,16) size 348x537 [border: (3px solid #0000FF)]
+ RenderTableSection {TBODY} at (3,3) size 342x531
+ RenderTableRow {TR} at (0,8) size 34x531
+ RenderTableCell {TH} at (8,0) size 34x138 [border: (3px solid #800080)] [r=0 c=0 rs=1 cs=1]
+ RenderText {#text} at (8,27) size 18x84
+ text run at (8,27) width 83: "Header One"
+ RenderTableCell {TH} at (8,137) size 34x195 [border: (3px solid #800080)] [r=0 c=1 rs=1 cs=1]
+ RenderText {#text} at (8,55) size 18x84
+ text run at (8,55) width 84: "Header Two"
+ RenderTableCell {TH} at (8,331) size 34x201 [border: (3px solid #800080)] [r=0 c=2 rs=1 cs=1]
+ RenderText {#text} at (8,52) size 18x96
+ text run at (8,52) width 95: "Header Three"
+ RenderTableRow {TR} at (0,50) size 138x531
+ RenderTableCell {TD} at (50,36) size 138x66 [border: (1px solid #008000)] [r=1 c=0 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (42,-30) size 54x119
</span><span class="cx"> text run at (42,-30) width 119: "This table uses the"
</span><span class="cx"> text run at (60,-30) width 113: "separated borders"
</span><span class="cx"> text run at (78,-30) width 44: "model."
</span><del>- RenderTableCell {TD} at (50,141) size 138x200 [border: (1px solid #008000)] [r=1 c=1 rs=1 cs=1]
- RenderText {#text} at (6,6) size 126x184
</del><ins>+ RenderTableCell {TD} at (50,137) size 138x195 [border: (1px solid #008000)] [r=1 c=1 rs=1 cs=1]
+ RenderText {#text} at (6,6) size 126x181
</ins><span class="cx"> text run at (6,6) width 156: "Elements within the cell"
</span><span class="cx"> text run at (24,6) width 150: "have horizontal border-"
</span><span class="cx"> text run at (42,6) width 140: "spacing (i.e., width of"
</span><span class="cx"> text run at (60,6) width 144: "vertical lines) of 0 and"
</span><span class="cx"> text run at (78,6) width 52: "vertical "
</span><span class="cx"> text run at (78,57) width 129: "border-spacing (i.e.,"
</span><del>- text run at (96,6) width 184: "height of horizontal lines) of"
- text run at (114,6) width 44: "0.5em."
- RenderTableCell {TD} at (50,376) size 138x135 [border: (1px solid #008000)] [r=1 c=2 rs=1 cs=1]
</del><ins>+ text run at (96,6) width 166: "height of horizontal lines)"
+ text run at (114,6) width 61: "of 0.5em."
+ RenderTableCell {TD} at (50,367) size 138x129 [border: (1px solid #008000)] [r=1 c=2 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (42,-30) size 54x180
</span><span class="cx"> text run at (42,-30) width 168: "The borders on the header"
</span><span class="cx"> text run at (60,-30) width 38: "cells, "
</span><span class="cx"> text run at (60,7) width 142: "on all sides, should be"
</span><span class="cx"> text run at (78,-30) width 137: "medium solid purple."
</span><del>- RenderTableRow {TR} at (0,196) size 138x546
- RenderTableCell {TD} at (196,0) size 138x142 [border: (1px solid #008000)] [r=2 c=0 rs=1 cs=1]
- RenderText {#text} at (6,6) size 126x126
</del><ins>+ RenderTableRow {TR} at (0,196) size 138x531
+ RenderTableCell {TD} at (196,0) size 138x138 [border: (1px solid #008000)] [r=2 c=0 rs=1 cs=1]
+ RenderText {#text} at (6,6) size 126x114
</ins><span class="cx"> text run at (6,6) width 112: "The border of the"
</span><span class="cx"> text run at (24,6) width 114: "table itself should"
</span><span class="cx"> text run at (42,6) width 107: "be medium solid"
</span><span class="cx"> text run at (60,6) width 36: "blue. "
</span><span class="cx"> text run at (60,41) width 77: "The borders"
</span><span class="cx"> text run at (78,6) width 84: "of other cells"
</span><del>- text run at (96,6) width 126: "should be thin solid"
- text run at (114,6) width 40: "green."
- RenderTableCell {TD} at (196,159) size 138x164 [border: (1px solid #008000)] [r=2 c=1 rs=1 cs=1]
- RenderText {#text} at (24,-12) size 72x188
- text run at (24,-12) width 188: "This table should have a 1em"
- text run at (42,-12) width 158: "margin around all edges."
- text run at (60,-12) width 82: "This margin "
- text run at (60,69) width 76: "is measured"
- text run at (78,-12) width 59: "from the "
- RenderInline {EM} at (0,0) size 18x69
- RenderText {#text} at (78,46) size 18x69
- text run at (78,46) width 68: "outer edge"
- RenderText {#text} at (78,114) size 36x164
- text run at (78,114) width 37: " of its"
- text run at (96,-12) width 45: "border."
- RenderTableCell {TD} at (196,349) size 138x189 [border: (1px solid #008000)] [r=2 c=2 rs=1 cs=1]
- RenderText {#text} at (15,-3) size 108x192
- text run at (15,-3) width 191: "The table should not be wider"
- text run at (33,-3) width 187: "than the room available for it"
- text run at (51,-3) width 44: "unless "
- text run at (51,41) width 111: "that space is very"
- text run at (69,-3) width 43: "small. "
- text run at (69,39) width 150: "Because of its margins,"
- text run at (87,-3) width 105: "the width of the "
- text run at (87,101) width 78: "table should"
- text run at (105,-3) width 120: "be less than 100%."
- RenderTable {TABLE} at (940,16) size 280x552 [border: (3px solid #0000FF)]
- RenderTableSection {TBODY} at (3,3) size 274x546
- RenderTableRow {TR} at (0,0) size 34x546
- RenderTableCell {TH} at (0,8) size 34x149 [border: (3px solid #800080)] [r=0 c=0 rs=1 cs=1]
- RenderText {#text} at (8,32) size 18x84
- text run at (8,32) width 83: "Header One"
- RenderTableCell {TH} at (0,164) size 34x151 [border: (3px solid #800080)] [r=0 c=1 rs=1 cs=1]
- RenderText {#text} at (8,33) size 18x84
- text run at (8,33) width 84: "Header Two"
- RenderTableCell {TH} at (0,322) size 34x217 [border: (3px solid #800080)] [r=0 c=2 rs=1 cs=1]
- RenderText {#text} at (8,60) size 18x96
- text run at (8,60) width 95: "Header Three"
- RenderTableRow {TR} at (0,34) size 102x546
- RenderTableCell {TD} at (34,26) size 102x113 [border: (1px solid #008000)] [r=1 c=0 rs=1 cs=1]
</del><ins>+ text run at (96,6) width 91: "should be thin"
+ text run at (114,6) width 75: "solid green."
+ RenderTableCell {TD} at (196,155) size 138x159 [border: (1px solid #008000)] [r=2 c=1 rs=1 cs=1]
+ RenderText {#text} at (24,-12) size 72x156
+ text run at (24,-12) width 156: "This table should have a"
+ text run at (42,-12) width 146: "1em margin around all"
+ text run at (60,-12) width 45: "edges. "
+ text run at (60,32) width 82: "This margin "
+ text run at (60,113) width 11: "is"
+ text run at (78,-12) width 124: "measured from the "
+ RenderInline {EM} at (0,0) size 36x158
+ RenderText {#text} at (78,111) size 36x158
+ text run at (78,111) width 34: "outer"
+ text run at (96,-12) width 31: "edge"
+ RenderText {#text} at (96,18) size 18x86
+ text run at (96,18) width 86: " of its border."
+ RenderTableCell {TD} at (196,331) size 138x201 [border: (1px solid #008000)] [r=2 c=2 rs=1 cs=1]
+ RenderText {#text} at (6,6) size 126x183
+ text run at (6,6) width 151: "The table should not be"
+ text run at (24,6) width 130: "wider than the room"
+ text run at (42,6) width 142: "available for it unless "
+ text run at (42,147) width 24: "that"
+ text run at (60,6) width 130: "space is very small. "
+ text run at (60,135) width 54: "Because"
+ text run at (78,6) width 174: "of its margins, the width of"
+ text run at (96,6) width 24: "the "
+ text run at (96,29) width 157: "table should be less than"
+ text run at (114,6) width 42: "100%."
+ RenderTable {TABLE} at (958,16) size 280x537 [border: (3px solid #0000FF)]
+ RenderTableSection {TBODY} at (3,3) size 274x531
+ RenderTableRow {TR} at (0,0) size 34x531
+ RenderTableCell {TH} at (0,8) size 34x145 [border: (3px solid #800080)] [r=0 c=0 rs=1 cs=1]
+ RenderText {#text} at (8,30) size 18x84
+ text run at (8,30) width 83: "Header One"
+ RenderTableCell {TH} at (0,160) size 34x147 [border: (3px solid #800080)] [r=0 c=1 rs=1 cs=1]
+ RenderText {#text} at (8,31) size 18x84
+ text run at (8,31) width 84: "Header Two"
+ RenderTableCell {TH} at (0,314) size 34x210 [border: (3px solid #800080)] [r=0 c=2 rs=1 cs=1]
+ RenderText {#text} at (8,57) size 18x95
+ text run at (8,57) width 95: "Header Three"
+ RenderTableRow {TR} at (0,34) size 102x531
+ RenderTableCell {TD} at (34,26) size 102x109 [border: (1px solid #008000)] [r=1 c=0 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (24,-12) size 54x119
</span><span class="cx"> text run at (24,-12) width 119: "This table uses the"
</span><span class="cx"> text run at (42,-12) width 113: "separated borders"
</span><span class="cx"> text run at (60,-12) width 44: "model."
</span><del>- RenderTableCell {TD} at (34,164) size 102x151 [border: (1px solid #008000)] [r=1 c=1 rs=1 cs=1]
</del><ins>+ RenderTableCell {TD} at (34,160) size 102x147 [border: (1px solid #008000)] [r=1 c=1 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (6,6) size 90x129
</span><span class="cx"> text run at (6,6) width 128: "Elements within the"
</span><span class="cx"> text run at (24,6) width 127: "cell have horizontal"
</span><span class="cx"> text run at (42,6) width 113: "border-spacing of"
</span><span class="cx"> text run at (60,6) width 119: "0.5em and vertical"
</span><span class="cx"> text run at (78,6) width 129: "border-spacing of 0."
</span><del>- RenderTableCell {TD} at (34,340) size 102x181 [border: (1px solid #008000)] [r=1 c=2 rs=1 cs=1]
</del><ins>+ RenderTableCell {TD} at (34,332) size 102x174 [border: (1px solid #008000)] [r=1 c=2 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (24,-12) size 54x180
</span><span class="cx"> text run at (24,-12) width 168: "The borders on the header"
</span><span class="cx"> text run at (42,-12) width 38: "cells, "
</span><span class="cx"> text run at (42,25) width 142: "on all sides, should be"
</span><span class="cx"> text run at (60,-12) width 137: "medium solid purple."
</span><del>- RenderTableRow {TR} at (0,136) size 138x546
- RenderTableCell {TD} at (136,17) size 138x131 [border: (1px solid #008000)] [r=2 c=0 rs=1 cs=1]
- RenderText {#text} at (15,-3) size 108x133
</del><ins>+ RenderTableRow {TR} at (0,136) size 138x531
+ RenderTableCell {TD} at (136,17) size 138x127 [border: (1px solid #008000)] [r=2 c=0 rs=1 cs=1]
+ RenderText {#text} at (15,-3) size 108x132
</ins><span class="cx"> text run at (15,-3) width 112: "The border of the"
</span><del>- text run at (33,-3) width 133: "table itself should be"
- text run at (51,-3) width 124: "medium solid blue."
- text run at (69,-3) width 132: "The borders of other"
- text run at (87,-3) width 124: "cells should be thin"
- text run at (105,-3) width 75: "solid green."
- RenderTableCell {TD} at (136,164) size 138x151 [border: (1px solid #008000)] [r=2 c=1 rs=1 cs=1]
</del><ins>+ text run at (33,-3) width 114: "table itself should"
+ text run at (51,-3) width 107: "be medium solid"
+ text run at (69,-3) width 36: "blue. "
+ text run at (69,32) width 95: "The borders of"
+ text run at (87,-3) width 132: "other cells should be"
+ text run at (105,-3) width 104: "thin solid green."
+ RenderTableCell {TD} at (136,160) size 138x147 [border: (1px solid #008000)] [r=2 c=1 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (6,6) size 90x122
</span><span class="cx"> text run at (6,6) width 111: "This table should"
</span><span class="cx"> text run at (24,6) width 122: "have a 1em margin"
</span><span class="lines">@@ -267,74 +271,75 @@
</span><span class="cx"> RenderText {#text} at (96,73) size 36x105
</span><span class="cx"> text run at (96,73) width 37: " of its"
</span><span class="cx"> text run at (114,6) width 45: "border."
</span><del>- RenderTableCell {TD} at (136,331) size 138x199 [border: (1px solid #008000)] [r=2 c=2 rs=1 cs=1]
- RenderText {#text} at (15,-3) size 108x198
</del><ins>+ RenderTableCell {TD} at (136,323) size 138x192 [border: (1px solid #008000)] [r=2 c=2 rs=1 cs=1]
+ RenderText {#text} at (15,-3) size 108x192
</ins><span class="cx"> text run at (15,-3) width 191: "The table should not be wider"
</span><span class="cx"> text run at (33,-3) width 187: "than the room available for it"
</span><span class="cx"> text run at (51,-3) width 44: "unless "
</span><del>- text run at (51,41) width 154: "that space is very small."
- text run at (69,-3) width 173: "Because of its margins, the"
- text run at (87,-3) width 82: "width of the "
- text run at (87,78) width 97: "table should be"
- text run at (105,-3) width 101: "less than 100%."
- RenderTable {TABLE} at (1236,16) size 272x552
- RenderBlock {CAPTION} at (0,0) size 18x552
- RenderText {#text} at (0,215) size 18x122
- text run at (0,215) width 122: "This is the caption."
</del><ins>+ text run at (51,41) width 111: "that space is very"
+ text run at (69,-3) width 43: "small. "
+ text run at (69,39) width 150: "Because of its margins,"
+ text run at (87,-3) width 105: "the width of the "
+ text run at (87,101) width 78: "table should"
+ text run at (105,-3) width 120: "be less than 100%."
+ RenderTable {TABLE} at (1254,16) size 272x537
+ RenderBlock {CAPTION} at (0,0) size 18x537
+ RenderText {#text} at (0,207) size 18x123
+ text run at (0,207) width 122: "This is the caption."
</ins><span class="cx"> RenderTableCol {COLGROUP} at (0,0) size 0x0 [border: (3px solid #FF0000)]
</span><span class="cx"> RenderTableCol {COL} at (0,0) size 0x0 [border: (3px solid #FF0000)]
</span><span class="cx"> RenderTableCol {COLGROUP} at (0,0) size 0x0 [border: (3px solid #FF0000)]
</span><span class="cx"> RenderTableCol {COL} at (0,0) size 0x0 [border: (3px solid #FF0000)]
</span><span class="cx"> RenderTableCol {COL} at (0,0) size 0x0 [border: (3px solid #FF0000)]
</span><del>- RenderTableSection {THEAD} at (18,0) size 50x552 [border: (3px solid #FF0000)]
- RenderTableRow {TR} at (0,2) size 46x552 [border: (3px solid #FF0000)]
- RenderTableCell {TH} at (2,2) size 46x90 [r=0 c=0 rs=1 cs=1]
- RenderText {#text} at (5,19) size 36x52
- text run at (5,19) width 51: "Header"
- text run at (23,30) width 29: "One"
- RenderTableCell {TH} at (2,102) size 46x223 [r=0 c=1 rs=1 cs=1]
- RenderText {#text} at (14,68) size 18x85
- text run at (14,68) width 84: "Header Two"
- RenderTableCell {TH} at (2,344) size 46x198 [r=0 c=2 rs=1 cs=1]
- RenderText {#text} at (14,50) size 18x96
- text run at (14,50) width 95: "Header Three"
- RenderTableSection {TBODY} at (68,0) size 204x552 [border: (3px solid #FF0000)]
- RenderTableRow {TR} at (0,0) size 100x552 [border: (3px solid #FF0000)]
- RenderTableCell {TD} at (0,2) size 100x90 [r=0 c=0 rs=1 cs=1]
</del><ins>+ RenderTableSection {THEAD} at (18,0) size 50x537 [border: (3px solid #FF0000)]
+ RenderTableRow {TR} at (0,2) size 46x537 [border: (3px solid #FF0000)]
+ RenderTableCell {TH} at (2,2) size 46x88 [r=0 c=0 rs=1 cs=1]
+ RenderText {#text} at (5,18) size 36x52
+ text run at (5,18) width 51: "Header"
+ text run at (23,29) width 29: "One"
+ RenderTableCell {TH} at (2,100) size 46x216 [r=0 c=1 rs=1 cs=1]
+ RenderText {#text} at (14,65) size 18x85
+ text run at (14,65) width 84: "Header Two"
+ RenderTableCell {TH} at (2,335) size 46x192 [r=0 c=2 rs=1 cs=1]
+ RenderText {#text} at (14,47) size 18x96
+ text run at (14,47) width 95: "Header Three"
+ RenderTableSection {TBODY} at (68,0) size 204x537 [border: (3px solid #FF0000)]
+ RenderTableRow {TR} at (0,0) size 100x537 [border: (3px solid #FF0000)]
+ RenderTableCell {TD} at (0,2) size 100x88 [r=0 c=0 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (5,5) size 90x64
</span><span class="cx"> text run at (5,5) width 64: "This table"
</span><span class="cx"> text run at (23,5) width 52: "uses the"
</span><span class="cx"> text run at (41,5) width 61: "separated"
</span><span class="cx"> text run at (59,5) width 48: "borders"
</span><span class="cx"> text run at (77,5) width 44: "model."
</span><del>- RenderTableCell {TD} at (0,111) size 100x205 [r=0 c=1 rs=1 cs=1]
</del><ins>+ RenderTableCell {TD} at (0,109) size 100x198 [r=0 c=1 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (23,-13) size 54x217
</span><span class="cx"> text run at (23,-13) width 177: "This means that borders are"
</span><span class="cx"> text run at (41,-13) width 217: "allowed only on table elements or"
</span><span class="cx"> text run at (59,-13) width 36: "table "
</span><span class="cx"> text run at (59,22) width 88: "cell elements."
</span><del>- RenderTableCell {TD} at (0,344) size 100x198 [r=0 c=2 rs=1 cs=1]
</del><ins>+ RenderTableCell {TD} at (0,335) size 100x192 [r=0 c=2 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (14,-4) size 72x187
</span><span class="cx"> text run at (14,-4) width 156: "They are not allowed on"
</span><span class="cx"> text run at (32,-4) width 187: "elements that represent rows,"
</span><span class="cx"> text run at (50,-4) width 158: "row-groups, columns, or"
</span><span class="cx"> text run at (68,-4) width 101: "column-groups."
</span><del>- RenderTableRow {TR} at (0,102) size 100x552 [border: (3px solid #FF0000)]
- RenderTableCell {TD} at (102,2) size 100x90 [r=1 c=0 rs=1 cs=1]
- RenderText {#text} at (5,5) size 90x79
</del><ins>+ RenderTableRow {TR} at (0,102) size 100x537 [border: (3px solid #FF0000)]
+ RenderTableCell {TD} at (102,2) size 100x88 [r=1 c=0 rs=1 cs=1]
+ RenderText {#text} at (5,5) size 90x68
</ins><span class="cx"> text run at (5,5) width 38: "There"
</span><span class="cx"> text run at (23,5) width 62: "should be"
</span><span class="cx"> text run at (41,5) width 68: "no borders"
</span><del>- text run at (59,5) width 79: "at all on this"
- text run at (77,5) width 37: "table!"
- RenderTableCell {TD} at (102,102) size 100x223 [r=1 c=1 rs=1 cs=1]
- RenderText {#text} at (14,-4) size 72x224
- text run at (14,-4) width 224: "If there are any borders shown that"
- text run at (32,-4) width 200: "are not medium solid red, then "
- text run at (32,195) width 20: "the"
- text run at (50,-4) width 208: "problem is something other than"
- text run at (68,-4) width 150: "what this test is testing."
- RenderTableCell {TD} at (102,344) size 100x198 [r=1 c=2 rs=1 cs=1]
</del><ins>+ text run at (59,5) width 52: "at all on"
+ text run at (77,5) width 64: "this table!"
+ RenderTableCell {TD} at (102,100) size 100x216 [r=1 c=1 rs=1 cs=1]
+ RenderText {#text} at (14,-4) size 72x219
+ text run at (14,-4) width 196: "If there are any borders shown"
+ text run at (32,-4) width 192: "that are not medium solid red,"
+ text run at (50,-4) width 32: "then "
+ text run at (50,27) width 163: "the problem is something"
+ text run at (68,-4) width 219: "other than what this test is testing."
+ RenderTableCell {TD} at (102,335) size 100x192 [r=1 c=2 rs=1 cs=1]
</ins><span class="cx"> RenderText {#text} at (14,-4) size 54x191
</span><span class="cx"> text run at (14,-4) width 188: "This table should have a 1em"
</span><span class="cx"> text run at (32,-4) width 162: "margin around all edges. "
</span></span></pre></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (201676 => 201677)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog 2016-06-04 02:00:50 UTC (rev 201676)
+++ trunk/Source/WebCore/ChangeLog 2016-06-04 02:04:58 UTC (rev 201677)
</span><span class="lines">@@ -1,5 +1,45 @@
</span><span class="cx"> 2016-06-03 Myles C. Maxfield <mmaxfield@apple.com>
</span><span class="cx">
</span><ins>+ Bopomofo ruby in Dictionary.app is written horizontally (when it should be written vertically)
+ https://bugs.webkit.org/show_bug.cgi?id=158245
+ <rdar://problem/25675318>
+
+ Reviewed by Darin Adler.
+
+ With orthogonal flows, the inner element gets a logical width that is computed from two values:
+ - The containing block's available logical height
+ - The FrameView's visibleHeight
+
+ In Dictionary.app, the FrameView's height changes, but this element doesn't get relaid out.
+ This is because of our optimization where normal-flow elements don't get relaid out if their
+ parent's width doesn't change (which is the case here).
+
+ Therefore, this orthogonal writing mode element should be relaid out when the FrameView changes
+ size. Luckily, we already have machinery for doing this: percentage heights. In quirks mode, a
+ div with a percentage height may walk arbitrarily far up the DOM tree in order to determine which
+ element the percentage should be resolved against. Therefore, we have a map of percentage-sizing-
+ ancestors to percentage-sizing-descendants which speeds up this search. If a percentage-sizing-
+ ancestor gets relaid out, all the relevant percentage-sizing-descendants get relaid out too.
+
+ Therefore, we can simply mark the FrameView as a percentage-sizing-ancestor and the orthogonal
+ flow element as a percentage-sizing-descendant. The lifetime of this relationship is already
+ managed correctly - it gets reset when style changes and when the renderer is destroyed, and
+ is created during layout.
+
+ Unfortunately, this same treatment should also be done to the element which dictates the
+ containing block's logical height (which caused https://bugs.webkit.org/show_bug.cgi?id=158286).
+ Implementing this would require giving RenderBox::availableLogicalHeight() a second result
+ of the necessary element which dictates the return. In an effort to keep this patch small and
+ focused, I'll do this secondary (much larger) work in a patch on that bug. This patch,
+ therefore, is kept small and focused.
+
+ Test: fast/text/orthogonal-writing-mode-containing-block-frameView-resize-relayout.html
+
+ * rendering/RenderBox.cpp:
+ (WebCore::RenderBox::perpendicularContainingBlockLogicalHeight):
+
+2016-06-03 Myles C. Maxfield <mmaxfield@apple.com>
+
</ins><span class="cx"> Text not visible while external font downloading
</span><span class="cx"> https://bugs.webkit.org/show_bug.cgi?id=25207
</span><span class="cx"> <rdar://problem/15167413>
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingRenderBoxcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/RenderBox.cpp (201676 => 201677)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/RenderBox.cpp 2016-06-04 02:00:50 UTC (rev 201676)
+++ trunk/Source/WebCore/rendering/RenderBox.cpp 2016-06-04 02:04:58 UTC (rev 201677)
</span><span class="lines">@@ -1987,6 +1987,8 @@
</span><span class="cx"> if (!logicalHeightLength.isFixed()) {
</span><span class="cx"> LayoutUnit fillFallbackExtent = containingBlockStyle.isHorizontalWritingMode() ? view().frameView().visibleHeight() : view().frameView().visibleWidth();
</span><span class="cx"> LayoutUnit fillAvailableExtent = containingBlock()->availableLogicalHeight(ExcludeMarginBorderPadding);
</span><ins>+ view().addPercentHeightDescendant(const_cast<RenderBox&>(*this));
+ // FIXME: https://bugs.webkit.org/show_bug.cgi?id=158286 We also need to perform the same percentHeightDescendant treatment to the element which dictates the return value for containingBlock()->availableLogicalHeight() above.
</ins><span class="cx"> return std::min(fillAvailableExtent, fillFallbackExtent);
</span><span class="cx"> }
</span><span class="cx">
</span></span></pre>
</div>
</div>
</body>
</html>