Title: [230324] trunk/Tools
- Revision
- 230324
- Author
- [email protected]
- Date
- 2018-04-05 21:57:10 -0700 (Thu, 05 Apr 2018)
Log Message
[LayoutReloaded] Fix static position for floating boxes when they don't fit the current line
https://bugs.webkit.org/show_bug.cgi?id=184354
Reviewed by Antti Koivisto.
Do not shrink the current line with the floating box unless it is on the current line.
* LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js:
(InlineFormattingContext.prototype._handleFloatingBox):
(InlineFormattingContext.prototype._mapFloatingVerticalPosition):
* LayoutReloaded/FormattingContext/InlineFormatting/Line.js:
(Line.prototype.addFloatingBox):
(Line):
* LayoutReloaded/test/index.html:
* LayoutReloaded/test/inline-with-right-floats3.html: Added.
Modified Paths
Added Paths
Diff
Modified: trunk/Tools/ChangeLog (230323 => 230324)
--- trunk/Tools/ChangeLog 2018-04-06 04:44:32 UTC (rev 230323)
+++ trunk/Tools/ChangeLog 2018-04-06 04:57:10 UTC (rev 230324)
@@ -1,5 +1,23 @@
2018-04-05 Zalan Bujtas <[email protected]>
+ [LayoutReloaded] Fix static position for floating boxes when they don't fit the current line
+ https://bugs.webkit.org/show_bug.cgi?id=184354
+
+ Reviewed by Antti Koivisto.
+
+ Do not shrink the current line with the floating box unless it is on the current line.
+
+ * LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js:
+ (InlineFormattingContext.prototype._handleFloatingBox):
+ (InlineFormattingContext.prototype._mapFloatingVerticalPosition):
+ * LayoutReloaded/FormattingContext/InlineFormatting/Line.js:
+ (Line.prototype.addFloatingBox):
+ (Line):
+ * LayoutReloaded/test/index.html:
+ * LayoutReloaded/test/inline-with-right-floats3.html: Added.
+
+2018-04-05 Zalan Bujtas <[email protected]>
+
[LayoutReloaded] Add support for right floating boxes in inline formatting context
https://bugs.webkit.org/show_bug.cgi?id=184351
Modified: trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js (230323 => 230324)
--- trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js 2018-04-06 04:44:32 UTC (rev 230323)
+++ trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js 2018-04-06 04:57:10 UTC (rev 230324)
@@ -103,11 +103,15 @@
this._computeFloatingWidth(floatingBox);
this._computeFloatingHeight(floatingBox);
let displayBox = this.displayBox(floatingBox);
+ // Position this float statically first, the floating context will figure it out the final position.
+ let floatingStaticPosition = this._line().rect().topLeft();
if (displayBox.width() > this._line().availableWidth())
- this._commitLine();
- // Position this float statically first, the floating context will figure it out the final position.
- displayBox.setTopLeft(this._line().rect().topLeft());
+ floatingStaticPosition = new LayoutPoint(this._line().rect().bottom(), this.displayBox(this.formattingRoot()).contentBox().left());
+ displayBox.setTopLeft(floatingStaticPosition);
this.floatingContext().computePosition(floatingBox);
+ // Check if the floating box is actually on the current line or got pushed further down.
+ if (displayBox.top() >= this._line().rect().bottom())
+ return;
this._line().addFloatingBox(displayBox, Utils.isFloatingLeft(floatingBox));
}
@@ -151,7 +155,7 @@
if (root == floatFormattingRoot)
return verticalPosition;
let rootTop = Utils.mapPosition(root.topLeft(), root, floatFormattingRoot).top();
- return (rootTop + root.contentBox().top() + verticalPosition);
+ return rootTop + root.contentBox().top() + verticalPosition;
}
_mapFloatingHorizontalPosition(horizontalPosition) {
Modified: trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/Line.js (230323 => 230324)
--- trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/Line.js 2018-04-06 04:44:32 UTC (rev 230323)
+++ trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/Line.js 2018-04-06 04:57:10 UTC (rev 230324)
@@ -58,10 +58,10 @@
addFloatingBox(floatingDisplayBox, isFloatingLeft) {
let width = floatingDisplayBox.width();
ASSERT(width <= this.m_availableWidth);
- // Push non-floating boxes to the right.
this.m_availableWidth -= width;
if (!isFloatingLeft)
return;
+ // Push non-floating boxes to the right.
for (let lineBox of this.m_lineBoxes)
lineBox.lineBoxRect.moveHorizontally(width);
this.m_lineRect.moveHorizontally(width);
Modified: trunk/Tools/LayoutReloaded/test/index.html (230323 => 230324)
--- trunk/Tools/LayoutReloaded/test/index.html 2018-04-06 04:44:32 UTC (rev 230323)
+++ trunk/Tools/LayoutReloaded/test/index.html 2018-04-06 04:57:10 UTC (rev 230324)
@@ -72,7 +72,8 @@
"multiple-left-floats-on-line-from-parent-formatting-context.html",
"inline-with-floats-when-they-dont-fit.html",
"inline-with-right-float-simple.html",
- "inline-with-right-floats2.html"
+ "inline-with-right-floats2.html",
+ "inline-with-right-floats3.html"
];
let debugThis = [];
Added: trunk/Tools/LayoutReloaded/test/inline-with-right-floats3.html (0 => 230324)
--- trunk/Tools/LayoutReloaded/test/inline-with-right-floats3.html (rev 0)
+++ trunk/Tools/LayoutReloaded/test/inline-with-right-floats3.html 2018-04-06 04:57:10 UTC (rev 230324)
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<style>
+div { border: 1px solid green;}
+</style>
+<body>
+<div style="width: 600px; height: 600px;">
+<div style="float: right; width: 120px; height: 30px;"></div>
+<div style="float: right; width: 320px; height: 50px;"></div>
+<div style="width: 300px; height: 100px;">foobar foobar foobar foobar foobar foobar foobar<div style="float: right; width: 200px; height: 20px;"></div></div>
+</div>
+</body>
+</html>
_______________________________________________
webkit-changes mailing list
[email protected]
https://lists.webkit.org/mailman/listinfo/webkit-changes
