Skip to content
Permalink
Browse files
Recalculate intrinsic widths in the old containing block chain when g…
…oing out of flow

Recalculate intrinsic widths in the old containing block chain when going out of flow
https://bugs.webkit.org/show_bug.cgi?id=249259

Reviewed by Alan Baradlay.

This patch is to align Webkit with Blink / Chromium and Gecko / Firefox.

Merge - https://src.chromium.org/viewvc/blink?revision=200836&view=revision

When an object goes out of flow, it no longer contributes to the intrinisic
widths of its parents. We need to mark them for recalculation while we can
still walk that ancestry chain, i.e. before applying the style change.

* Source/WebCore/rendering/RenderBox.cpp:
(RenderBox::styleWillChange): Add logic for recalculation
* LayoutTests/fast/block/positioning/static-to-abpos-parent-is-stf.html: Add Test Case
* LayoutTests/fast/block/positioning/static-to-abpos-parent-is-stf-expected.html: Add Test Case Expectation

Canonical link: https://commits.webkit.org/257980@main
  • Loading branch information
Ahmad-S792 authored and Ahmad Saleem committed Dec 16, 2022
1 parent 2a8263e commit ca04468e9d7160d8fbc0d50879d984d2052abd02
Show file tree
Hide file tree
Showing 3 changed files with 27 additions and 1 deletion.
@@ -0,0 +1,5 @@
Change from position:static to position:absolute when the parent is a shrink-to-fit container. The parent needs to recalculate its intrinsic size when this happens.

There should be a black square below.

PASS
@@ -0,0 +1,15 @@
<!DOCTYPE html>
<script src="../../../resources/check-layout.js"></script>
<p>Change from position:static to position:absolute when the parent is a shrink-to-fit container.
The parent needs to recalculate its intrinsic size when this happens.</p>
<p>There should be a black <em>square</em> below.</p>
<div id="container" style="float:left; border:20px solid black;" data-expected-width="40" data-expected-height="40">
<div id="test" style="width:100px; height:100px;"></div>
</div>
<p id="result" style="clear:both;"></p>
<script>
var test = document.getElementById("test");
test.offsetTop;
test.style.position = "absolute";
checkLayout("#container", document.getElementById("result"));
</script>
@@ -284,7 +284,13 @@ void RenderBox::styleWillChange(StyleDifference diff, const RenderStyle& newStyl
// When a layout hint happens and an object's position style changes, we have to do a layout
// to dirty the render tree using the old position value now.
if (diff == StyleDifference::Layout && parent() && oldStyle->position() != newStyle.position()) {
markContainingBlocksForLayout();
if (!oldStyle->hasOutOfFlowPosition() && newStyle.hasOutOfFlowPosition()) {
// We are about to go out of flow. Before that takes place, we need to mark the
// current containing block chain for preferred widths recalculation.
setNeedsLayoutAndPrefWidthsRecalc();
} else
markContainingBlocksForLayout();

if (oldStyle->position() != PositionType::Static && newStyle.hasOutOfFlowPosition())
parent()->setChildNeedsLayout();
if (isFloating() && !isOutOfFlowPositioned() && newStyle.hasOutOfFlowPosition())

0 comments on commit ca04468

Please sign in to comment.