Bug 402629: Fix percent-height updates in nested tables by checking if containing block depends on an ancestor cell's height, rather than just checking if it's a cell. r+sr=dbaron, a=blocking1.9+

This commit is contained in:
dholbert@cs.stanford.edu 2008-02-21 13:02:07 -08:00
parent 108d7cea9b
commit 66d57e1b12
12 changed files with 154 additions and 3 deletions

View File

@ -104,6 +104,7 @@ nsHTMLReflowState::nsHTMLReflowState(nsPresContext* aPresContext,
mFlags.mNextInFlowUntouched = PR_FALSE;
mFlags.mAssumingHScrollbar = mFlags.mAssumingVScrollbar = PR_FALSE;
mFlags.mHasClearance = PR_FALSE;
mFlags.mHeightDependsOnAncestorCell = PR_FALSE;
mDiscoveredClearance = nsnull;
mPercentHeightObserver = nsnull;
mPercentHeightReflowInitiator = nsnull;
@ -410,14 +411,17 @@ nsHTMLReflowState::InitResizeFlags(nsPresContext* aPresContext)
frame->IsBoxFrame() ||
frame->GetIntrinsicSize().height.GetUnit() == eStyleUnit_Percent;
// If we're the child of a table cell that performs special height
// If we're the descendant of a table cell that performs special height
// reflows and we could be the child that requires them, always set
// the vertical resize in case this is the first pass before the
// special height reflow.
if (!mFlags.mVResize && mCBReflowState &&
IS_TABLE_CELL(mCBReflowState->frame->GetType()) &&
dependsOnCBHeight)
(IS_TABLE_CELL(mCBReflowState->frame->GetType()) ||
mCBReflowState->mFlags.mHeightDependsOnAncestorCell) &&
dependsOnCBHeight) {
mFlags.mVResize = PR_TRUE;
mFlags.mHeightDependsOnAncestorCell = PR_TRUE;
}
// Set NS_FRAME_CONTAINS_RELATIVE_HEIGHT if it's needed.

View File

@ -369,6 +369,9 @@ public:
// basis?
PRUint16 mTableIsSplittable:1; // tables are splittable, this should happen only inside a page
// and never insider a column frame
PRUint16 mHeightDependsOnAncestorCell:1; // Does frame height depend on
// an ancestor table-cell?
} mFlags;
// Note: The copy constructor is written by the compiler automatically. You

View File

@ -0,0 +1,26 @@
<!DOCTYPE HTML>
<html>
<head>
<style>
html { height: 50%; }
body { height:100%; }
table { height:100%; }
div { height:100%; }
td.green { background:lightgreen }
/* Apply this to outermost <td> or <tr> to trigger bug. */
.fill { height: 100% }
</style>
</head>
<body>
<table cellpadding="0" cellspacing="0">
<tr><td class="fill">
<div><div><div><div>
<table cellpadding="0" cellspacing="0">
<tr><td class="green">foo</td></tr>
</table>
</div></div></div></div>
</td></tr>
</table>
</body>
</html>

View File

@ -0,0 +1,7 @@
<html>
<body>
<iframe id="myFrame"
style="height: 200px"
src="402629-1-iframe.html"/>
</body>
</html>

View File

@ -0,0 +1,17 @@
<html class="reftest-wait">
<body onload="HandleLoad()">
<script>
function HandleLoad() {
setTimeout(function() {
var myFrame = document.getElementById("myFrame");
myFrame.style.height = "200px";
document.documentElement.className = "";
}, 0);
}
</script>
<iframe id="myFrame"
style="height: 300px"
src="402629-1-iframe.html"/>
</body>
</html>

View File

@ -0,0 +1,21 @@
<!DOCTYPE HTML>
<html style="height:10%">
<body style="height:100%; margin:0px;padding:0px;">
<table style="height:100%" cellpadding="0px" cellspacing="0px">
<tr>
<td style="height: 100%; background: lightblue;">
Outside the div
<div style="height:100%">
<table style="height:100%" cellpadding="0px" cellspacing="0px">
<tr>
<td style="height: 100%; background:lightgreen;">
Inside div
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</body>
</html>

View File

@ -0,0 +1,7 @@
<html>
<body>
<iframe id="myFrame"
style="height: 200px"
src="402629-2-iframe.html"/>
</body>
</html>

View File

@ -0,0 +1,17 @@
<html class="reftest-wait">
<body onload="HandleLoad()">
<script>
function HandleLoad() {
setTimeout(function() {
var myFrame = document.getElementById("myFrame");
myFrame.style.height = "200px";
document.documentElement.className = "";
}, 0);
}
</script>
<iframe id="myFrame"
style="height: 300px"
src="402629-2-iframe.html"/>
</body>
</html>

View File

@ -0,0 +1,22 @@
<!DOCTYPE HTML>
<style>
html { height: 50%; }
body { height:100%; }
table { height:100%; }
div { height:100%; }
td.green { background:lightgreen }
td.fill { height: 100% }
</style>
<html>
<body>
<table cellpadding="0" cellspacing="0">
<tr>
<td class="fill"><div>
<table cellpadding="0" cellspacing="0">
<tr><td class="green">foo</td></tr>
</table>
</div></td>
</tr>
</table>
</body>
</html>

View File

@ -0,0 +1,7 @@
<html>
<body>
<iframe id="myFrame"
style="height: 200px"
src="402629-3-iframe.html"/>
</body>
</html>

View File

@ -0,0 +1,17 @@
<html class="reftest-wait">
<body onload="HandleLoad()">
<script>
function HandleLoad() {
setTimeout(function() {
var myFrame = document.getElementById("myFrame");
myFrame.style.height = "200px";
document.documentElement.className = "";
}, 0);
}
</script>
<iframe id="myFrame"
style="height: 300px"
src="402629-3-iframe.html"/>
</body>
</html>

View File

@ -634,6 +634,9 @@ skip-if(MOZ_WIDGET_TOOLKIT!="windows") == 391045.html 391045-ref.html # windows-
== 402567-2.html 402567-2-ref.html
== 402567-3.html 402567-3-ref.html
== 402567-4.html 402567-4-ref.html
== 402629-1.html 402629-1-ref.html
== 402629-2.html 402629-2-ref.html
== 402629-3.html 402629-3-ref.html
#== 402807-1.html 402807-1-ref.html # Fails on Mac (qm-xserve01)
== 402950-1.html 402950-1-ref.html
== 403129-1.html 403129-1-ref.html