Bug 1207157 - patch 2 - Stop caring about a replaced element's margin-inline-end when determining whether it fits next to floats. r=jfkthame, a=lizzard
authorL. David Baron <dbaron@dbaron.org>
Sun, 27 Sep 2015 02:19:14 -0700
changeset 296474 92261c34551829207ef9c058eb6fdc66f30a9e6f
parent 296473 743dd7362602126e385f0576e79ff15ad50488a9
child 296475 c72a8bcab579f366a3092648752fcb9fbd20a50a
push id5245
push userraliiev@mozilla.com
push dateThu, 29 Oct 2015 11:30:51 +0000
treeherdermozilla-beta@dac831dc1bd0 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjfkthame, lizzard
bugs1207157, 427129, 1062963
milestone43.0a2
Bug 1207157 - patch 2 - Stop caring about a replaced element's margin-inline-end when determining whether it fits next to floats. r=jfkthame, a=lizzard The change to the 427129-table-caption test was just to make the reference match the test. The change to the other 427129 tests was duplicating the test that failed, adjusting the reference for one version of it (no longer pushed down), and testing an alternative pushed-down case for the other version. It's not clear to me how to test that that 1062963-floatmanager-reflow.html still tests what it originally tested, given the code change that's happened since.
layout/generic/nsBlockReflowState.cpp
layout/reftests/bugs/1062963-floatmanager-reflow.html
layout/reftests/bugs/427129-image.html
layout/reftests/bugs/427129-ref.html
layout/reftests/bugs/427129-scrollframe.html
layout/reftests/bugs/427129-table-caption-ref.html
layout/reftests/bugs/427129-table.html
layout/reftests/floats/reftest.list
--- a/layout/generic/nsBlockReflowState.cpp
+++ b/layout/generic/nsBlockReflowState.cpp
@@ -311,23 +311,26 @@ nsBlockReflowState::ReplacedBlockFitsInA
     // We check this before calling ISizeToClearPastFloats, which is
     // somewhat expensive.
     return true;
   }
   WritingMode wm = mReflowState.GetWritingMode();
   nsBlockFrame::ReplacedElementISizeToClear replacedISize =
     nsBlockFrame::ISizeToClearPastFloats(*this, aFloatAvailableSpace.mRect,
                                          aReplacedBlock);
+  // The inline-start side of the replaced element should be offset by
+  // the larger of the float intrusion or the replaced element's own
+  // start margin.  The inline-end side is similar, except for Web
+  // compatibility we ignore the margin.
   return std::max(aFloatAvailableSpace.mRect.IStart(wm) -
                     mContentArea.IStart(wm),
                   replacedISize.marginIStart) +
            replacedISize.borderBoxISize +
-           std::max(mContentArea.IEnd(wm) -
-                      aFloatAvailableSpace.mRect.IEnd(wm),
-                    replacedISize.marginIEnd) <=
+           (mContentArea.IEnd(wm) -
+            aFloatAvailableSpace.mRect.IEnd(wm)) <=
          mContentArea.ISize(wm);
 }
 
 nsFlowAreaRect
 nsBlockReflowState::GetFloatAvailableSpaceWithState(
                       nscoord aBCoord,
                       nsFloatManager::SavedState *aState) const
 {
--- a/layout/reftests/bugs/1062963-floatmanager-reflow.html
+++ b/layout/reftests/bugs/1062963-floatmanager-reflow.html
@@ -13,17 +13,17 @@
 
 	.contain {
 		background: aqua; color: black;
 		height: 40px; margin: 1px 50px;
 		padding-top: 0.1px; /* needed for some reason (XXX WHY?) */
 	}
 
 	.fl, .fr { height: 20px; }
-	.fl { float: left; width: 56px; }
+	.fl { float: left; width: 100px; }
 	.fr { float: right; width: 73px; }
 
 	.t { background: blue; height: 10px; width: 100px; border-spacing: 0; }
 	.t caption { background: purple; height: 10px; width: 100px; }
 	.t td { padding: 0; }
 
     #test {
         width: 700px;
--- a/layout/reftests/bugs/427129-image.html
+++ b/layout/reftests/bugs/427129-image.html
@@ -135,16 +135,28 @@
 		<div class="fl"></div>
 		<div class="fr"></div>
 		<img src="solidblue2.png" class="t" style="margin: 0 74px 0 15px; width: 56px">
 	</div>
 
 	<div class="contain">
 		<div class="fl"></div>
 		<div class="fr"></div>
+		<img src="solidblue2.png" class="t" style="margin: 0 0 0 15px; width: 56px">
+	</div>
+
+	<div class="contain">
+		<div class="fl"></div>
+		<div class="fr"></div>
+		<img src="solidblue2.png" class="t" style="margin: 0 0 0 15px; width: 57px">
+	</div>
+
+	<div class="contain">
+		<div class="fl"></div>
+		<div class="fr"></div>
 		<img src="solidblue2.png" class="t" style="width: 28%">
 	</div>
 
 	<div class="contain">
 		<div class="fl"></div>
 		<div class="fr"></div>
 		<img src="solidblue2.png" class="t" style="margin: 0 15px; width: 28%">
 	</div>
@@ -179,12 +191,23 @@
 		<img src="solidblue2.png" class="t" style="margin: 0 73px 0 15px; width: 28%">
 	</div>
 
 	<div class="contain">
 		<div class="fl"></div>
 		<div class="fr"></div>
 		<img src="solidblue2.png" class="t" style="margin: 0 74px 0 15px; width: 28%">
 	</div>
+	<div class="contain">
+		<div class="fl"></div>
+		<div class="fr"></div>
+		<img src="solidblue2.png" class="t" style="margin: 0 0 0 15px; width: 28%">
+	</div>
+
+	<div class="contain">
+		<div class="fl"></div>
+		<div class="fr"></div>
+		<img src="solidblue2.png" class="t" style="margin: 0 0 0 15px; width: 29%">
+	</div>
 </div>
 
 </body>
 </html>
--- a/layout/reftests/bugs/427129-ref.html
+++ b/layout/reftests/bugs/427129-ref.html
@@ -87,19 +87,25 @@
 		<div class="t" style="margin-top: 5px; margin-left: 57px; width: 71px"></div>
 	</div>
 
 	<div class="contain">
 		<div class="t" style="margin-left: 56px; width: 71px"></div>
 	</div>
 
 	<div class="contain">
-        <!-- maybe we should ignore margin-right here?  It's hard to do
-             for tables, though. -->
-		<div class="t" style="margin-top: 5px; margin-left: 15px; width: 71px"></div>
+		<div class="t" style="margin-left: 56px; width: 71px"></div>
+	</div>
+
+	<div class="contain">
+		<div class="t" style="margin-left: 56px; width: 71px"></div>
+	</div>
+
+	<div class="contain">
+		<div class="t" style="margin-top: 5px; margin-left: 15px; width: 72px"></div>
 	</div>
 
 	<div class="contain">
 		<div class="t" style="margin-left: 56px; width: 71px"></div>
 	</div>
 
 	<div class="contain">
 		<div class="t" style="margin-left: 56px; width: 71px"></div>
@@ -121,16 +127,22 @@
 		<div class="t" style="margin-top: 5px; margin-left: 57px; width: 71px"></div>
 	</div>
 
 	<div class="contain">
 		<div class="t" style="margin-left: 56px; width: 71px"></div>
 	</div>
 
 	<div class="contain">
-        <!-- maybe we should ignore margin-right here?  It's hard to do
-             for tables, though. -->
-		<div class="t" style="margin-top: 5px; margin-left: 15px; width: 71px"></div>
+		<div class="t" style="margin-left: 56px; width: 71px"></div>
+	</div>
+
+	<div class="contain">
+		<div class="t" style="margin-left: 56px; width: 71px"></div>
+	</div>
+
+	<div class="contain">
+		<div class="t" style="margin-top: 5px; margin-left: 15px; width: 73px"></div>
 	</div>
 </div>
 
 </body>
 </html>
--- a/layout/reftests/bugs/427129-scrollframe.html
+++ b/layout/reftests/bugs/427129-scrollframe.html
@@ -135,16 +135,28 @@
 		<div class="fl"></div>
 		<div class="fr"></div>
 		<div class="t" style="margin: 0 74px 0 15px; width: 56px"></div>
 	</div>
 
 	<div class="contain">
 		<div class="fl"></div>
 		<div class="fr"></div>
+		<div class="t" style="margin: 0 0 0 15px; width: 56px"></div>
+	</div>
+
+	<div class="contain">
+		<div class="fl"></div>
+		<div class="fr"></div>
+		<div class="t" style="margin: 0 0 0 15px; width: 57px"></div>
+	</div>
+
+	<div class="contain">
+		<div class="fl"></div>
+		<div class="fr"></div>
 		<div class="t" style="width: 28%"></div>
 	</div>
 
 	<div class="contain">
 		<div class="fl"></div>
 		<div class="fr"></div>
 		<div class="t" style="margin: 0 15px; width: 28%"></div>
 	</div>
@@ -179,12 +191,24 @@
 		<div class="t" style="margin: 0 73px 0 15px; width: 28%"></div>
 	</div>
 
 	<div class="contain">
 		<div class="fl"></div>
 		<div class="fr"></div>
 		<div class="t" style="margin: 0 74px 0 15px; width: 28%"></div>
 	</div>
+
+	<div class="contain">
+		<div class="fl"></div>
+		<div class="fr"></div>
+		<div class="t" style="margin: 0 0 0 15px; width: 28%"></div>
+	</div>
+
+	<div class="contain">
+		<div class="fl"></div>
+		<div class="fr"></div>
+		<div class="t" style="margin: 0 0 0 15px; width: 29%"></div>
+	</div>
 </div>
 
 </body>
 </html>
--- a/layout/reftests/bugs/427129-table-caption-ref.html
+++ b/layout/reftests/bugs/427129-table-caption-ref.html
@@ -247,17 +247,16 @@
 	<div class="contain">
 		<div class="side caption" style="margin-left: 155px"></div
 		><div class="side t" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 654px">
 	<div class="contain">
-		<div class="pushed"></div>
 		<div class="side caption" style="margin-left: 155px"></div
 		><div class="side t" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 657px">
 	<div class="contain">
 		<div class="side caption" style="margin-left: 156px"></div
@@ -269,17 +268,16 @@
 	<div class="contain">
 		<div class="side caption" style="margin-left: 156px"></div
 		><div class="side t" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 655px">
 	<div class="contain">
-		<div class="pushed"></div>
 		<div class="side caption" style="margin-left: 156px"></div
 		><div class="side t" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 658px">
 	<div class="contain">
 		<div class="side caption" style="margin-left: 157px"></div
@@ -291,17 +289,16 @@
 	<div class="contain">
 		<div class="side caption" style="margin-left: 157px"></div
 		><div class="side t" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 656px">
 	<div class="contain">
-		<div class="pushed"></div>
 		<div class="side caption" style="margin-left: 157px"></div
 		><div class="side t" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 657px">
 	<div class="contain">
 		<div class="side t" style="margin-left: 56px"></div
@@ -313,18 +310,17 @@
 	<div class="contain">
 		<div class="side t" style="margin-left: 56px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 655px">
 	<div class="contain">
-		<div class="pushed"></div>
-		<div class="side t" style="margin-left: 55px"></div
+		<div class="side t" style="margin-left: 56px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 657px">
 	<div class="contain">
 		<div class="side t" style="margin-left: 56px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
@@ -335,17 +331,16 @@
 	<div class="contain">
 		<div class="side t" style="margin-left: 56px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 655px">
 	<div class="contain">
-		<div class="pushed"></div>
 		<div class="side t" style="margin-left: 56px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 658px">
 	<div class="contain">
 		<div class="side t" style="margin-left: 57px"></div
@@ -357,17 +352,16 @@
 	<div class="contain">
 		<div class="side t" style="margin-left: 57px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 656px">
 	<div class="contain">
-		<div class="pushed"></div>
 		<div class="side t" style="margin-left: 57px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 425px">
 	<div class="contain rtl">
 		<div class="t" style="margin-left: 152px"></div>
@@ -579,17 +573,16 @@
 		<!-- margins showing up in the wrong places? -->
 		<div class="side caption" style="margin-left: 200px"></div
 		><div class="side t" style="margin-left: 72px"></div>
 	</div>
 </div>
 
 <div style="width: 671px">
 	<div class="contain rtl">
-		<div class="pushed"></div>
 		<!-- margins showing up in the wrong places? -->
 		<div class="side caption" style="margin-left: 199px"></div
 		><div class="side t" style="margin-left: 72px"></div>
 	</div>
 </div>
 
 <div style="width: 674px">
 	<div class="contain rtl">
@@ -604,17 +597,16 @@
 		<!-- margins showing up in the wrong places? -->
 		<div class="side caption" style="margin-left: 200px"></div
 		><div class="side t" style="margin-left: 73px"></div>
 	</div>
 </div>
 
 <div style="width: 672px">
 	<div class="contain rtl">
-		<div class="pushed"></div>
 		<!-- margins showing up in the wrong places? -->
 		<div class="side caption" style="margin-left: 199px"></div
 		><div class="side t" style="margin-left: 73px"></div>
 	</div>
 </div>
 
 <div style="width: 675px">
 	<div class="contain rtl">
@@ -629,17 +621,16 @@
 		<!-- margins showing up in the wrong places? -->
 		<div class="side caption" style="margin-left: 200px"></div
 		><div class="side t" style="margin-left: 74px"></div>
 	</div>
 </div>
 
 <div style="width: 673px">
 	<div class="contain rtl">
-		<div class="pushed"></div>
 		<!-- margins showing up in the wrong places? -->
 		<div class="side caption" style="margin-left: 199px"></div
 		><div class="side t" style="margin-left: 74px"></div>
 	</div>
 </div>
 
 <div style="width: 674px">
 	<div class="contain rtl">
@@ -652,18 +643,17 @@
 	<div class="contain rtl">
 		<div class="side t" style="margin-left: 100px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 672px">
 	<div class="contain rtl">
-		<div class="pushed"></div>
-		<div class="side t" style="margin-left: 100px"></div
+		<div class="side t" style="margin-left: 99px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 674px">
 	<div class="contain rtl">
 		<div class="side t" style="margin-left: 101px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
@@ -674,17 +664,16 @@
 	<div class="contain rtl">
 		<div class="side t" style="margin-left: 100px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 672px">
 	<div class="contain rtl">
-		<div class="pushed"></div>
 		<div class="side t" style="margin-left: 99px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 675px">
 	<div class="contain rtl">
 		<div class="side t" style="margin-left: 101px"></div
@@ -696,16 +685,15 @@
 	<div class="contain rtl">
 		<div class="side t" style="margin-left: 100px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 <div style="width: 673px">
 	<div class="contain rtl">
-		<div class="pushed"></div>
 		<div class="side t" style="margin-left: 99px"></div
 		><div class="side caption" style="margin-left: 100px"></div>
 	</div>
 </div>
 
 </body>
 </html>
--- a/layout/reftests/bugs/427129-table.html
+++ b/layout/reftests/bugs/427129-table.html
@@ -137,16 +137,28 @@
 		<div class="fl"></div>
 		<div class="fr"></div>
 		<table class="t" style="margin: 0 74px 0 15px; width: 71px"><tr><td></td></tr></table>
 	</div>
 
 	<div class="contain">
 		<div class="fl"></div>
 		<div class="fr"></div>
+		<table class="t" style="margin: 0 0 0 15px; width: 71px"><tr><td></td></tr></table>
+	</div>
+
+	<div class="contain">
+		<div class="fl"></div>
+		<div class="fr"></div>
+		<table class="t" style="margin: 0 0 0 15px; width: 72px"><tr><td></td></tr></table>
+	</div>
+
+	<div class="contain">
+		<div class="fl"></div>
+		<div class="fr"></div>
 		<table class="t" style="width: 35.5%"><tr><td></td></tr></table>
 	</div>
 
 	<div class="contain">
 		<div class="fl"></div>
 		<div class="fr"></div>
 		<table class="t" style="margin: 0 15px; width: 35.5%"><tr><td></td></tr></table>
 	</div>
@@ -181,12 +193,24 @@
 		<table class="t" style="margin: 0 73px 0 15px; width: 35.5%"><tr><td></td></tr></table>
 	</div>
 
 	<div class="contain">
 		<div class="fl"></div>
 		<div class="fr"></div>
 		<table class="t" style="margin: 0 74px 0 15px; width: 35.5%"><tr><td></td></tr></table>
 	</div>
+
+	<div class="contain">
+		<div class="fl"></div>
+		<div class="fr"></div>
+		<table class="t" style="margin: 0 0 0 15px; width: 35.5%"><tr><td></td></tr></table>
+	</div>
+
+	<div class="contain">
+		<div class="fl"></div>
+		<div class="fr"></div>
+		<table class="t" style="margin: 0 0 0 15px; width: 36.5%"><tr><td></td></tr></table>
+	</div>
 </div>
 
 </body>
 </html>
--- a/layout/reftests/floats/reftest.list
+++ b/layout/reftests/floats/reftest.list
@@ -38,17 +38,17 @@ fails == 345369-2.html 345369-2-ref.html
 == float-in-rtl-4d.html float-in-rtl-4-ref.html
 
 == bfc-displace-1a.html bfc-displace-1a-ref.html
 == bfc-displace-1b.html bfc-displace-1b-ref.html
 == bfc-displace-2a.html bfc-displace-2a-ref.html
 == bfc-displace-2b.html bfc-displace-2b-ref.html
 == bfc-displace-3a.html bfc-displace-3a-ref.html
 == bfc-displace-3b.html bfc-displace-3b-ref.html
-fails == bfc-displace-4.html bfc-displace-4-ref.html # bug 1207157
+== bfc-displace-4.html bfc-displace-4-ref.html
 == bfc-shrink-1.html bfc-shrink-1-ref.html
 
 # Testcases that involve vertical writing mode.
 #
 # XXX The default-preferences setting here can be removed after the
 #     pref has been made true by default for all channels (bug 1138384).
 
 default-preferences pref(layout.css.vertical-text.enabled,true)