Bug 249391 – Fix inline-block abspos bug

• Status: RESOLVED
• Resolution: FIXED
• Component: Layout and Rendering

[Ahmad Saleem]

Hi Team,

While going through Blink commit and came across another failing test case:

Test Case - https://jsfiddle.net/zbusvq2g/ (Broken in Safari 16.2 & STP160)

^ Working fine in Chrome Canary 110 and Firefox Nightly 110.

Blink Commit - https://chromium.googlesource.com/chromium/blink/+/b1dbd0d86f09b9dccd410d1d106c76f029fa5b48

Webkit GitHub Source - https://github.com/WebKit/WebKit/blob/d80ae68ecc7a4a5756a38de4a2eb3d2360375012/Source/WebCore/rendering/RenderLayerModelObject.cpp#L130

Just wanted to raise this bug for future merge or tracking.

Thanks!

[Radar WebKit Bug Importer]

<rdar://problem/103637239>

[Ahmad Saleem]

This seems to be repaint issue because resizing window make it looks similar to Chrome Canary 112 and Firefox Nightly 112.

I tried in local testing and this compiles:

    if ((oldStyle && isOutOfFlowPositioned() && parent() && (parent() != containingBlock()))
        && (style().position() == oldStyle->position())
        && (style().display() != oldStyle->display())
        && ((style().display() == DisplayType::Block) || (style().display() == DisplayType::InlineBlock))
        && ((oldStyle->display() == DisplayType::Block ) || (oldStyle->display() == DisplayType::InlineBlock)))
            parent()->setChildNeedsLayout(MarkOnlyThis);

_______

I tried to change "last line" with:

setNeedsLayout() and other child variants to force repainting to get this fixed but it seems it does not work in case of Safari.

Would appreciate any input or suggestion. Just wanted to share my input and progress in the background on fixing this bug. Thanks!

[zalan]

(In reply to Ahmad Saleem from comment #2)
> This seems to be repaint issue because resizing window make it looks similar
> to Chrome Canary 112 and Firefox Nightly 112.
> 
> I tried in local testing and this compiles:
> 
>     if ((oldStyle && isOutOfFlowPositioned() && parent() && (parent() !=
> containingBlock()))
>         && (style().position() == oldStyle->position())
>         && (style().display() != oldStyle->display())
>         && ((style().display() == DisplayType::Block) || (style().display()
> == DisplayType::InlineBlock))
>         && ((oldStyle->display() == DisplayType::Block ) ||
> (oldStyle->display() == DisplayType::InlineBlock)))
>             parent()->setChildNeedsLayout(MarkOnlyThis);
> 
> _______
> 
> I tried to change "last line" with:
> 
> setNeedsLayout() and other child variants to force repainting to get this
> fixed but it seems it does not work in case of Safari.
> 
> Would appreciate any input or suggestion. Just wanted to share my input and
> progress in the background on fixing this bug. Thanks!
I think parent()->setNeedsLayout(LayoutInvalidationReason::ChildChanged, MarkContainerChain); maps to parent()->setChildNeedsLayout();

[Ahmad Saleem]

(In reply to zalan from comment #3)
> (In reply to Ahmad Saleem from comment #2)
> > This seems to be repaint issue because resizing window make it looks similar
> > to Chrome Canary 112 and Firefox Nightly 112.
> > 
> > I tried in local testing and this compiles:
> > 
> >     if ((oldStyle && isOutOfFlowPositioned() && parent() && (parent() !=
> > containingBlock()))
> >         && (style().position() == oldStyle->position())
> >         && (style().display() != oldStyle->display())
> >         && ((style().display() == DisplayType::Block) || (style().display()
> > == DisplayType::InlineBlock))
> >         && ((oldStyle->display() == DisplayType::Block ) ||
> > (oldStyle->display() == DisplayType::InlineBlock)))
> >             parent()->setChildNeedsLayout(MarkOnlyThis);
> > 
> > _______
> > 
> > I tried to change "last line" with:
> > 
> > setNeedsLayout() and other child variants to force repainting to get this
> > fixed but it seems it does not work in case of Safari.
> > 
> > Would appreciate any input or suggestion. Just wanted to share my input and
> > progress in the background on fixing this bug. Thanks!
> I think parent()->setNeedsLayout(LayoutInvalidationReason::ChildChanged,
> MarkContainerChain); maps to parent()->setChildNeedsLayout();

Just tried on local build. Still it does have repaint bug where resizing make it aligned with Chrome Canary 112 and Firefox Nightly 112.

[Ahmad Saleem]

(In reply to Ahmad Saleem from comment #4)
> (In reply to zalan from comment #3)
> > (In reply to Ahmad Saleem from comment #2)
> > > This seems to be repaint issue because resizing window make it looks similar
> > > to Chrome Canary 112 and Firefox Nightly 112.
> > > 
> > > I tried in local testing and this compiles:
> > > 
> > >     if ((oldStyle && isOutOfFlowPositioned() && parent() && (parent() !=
> > > containingBlock()))
> > >         && (style().position() == oldStyle->position())
> > >         && (style().display() != oldStyle->display())
> > >         && ((style().display() == DisplayType::Block) || (style().display()
> > > == DisplayType::InlineBlock))
> > >         && ((oldStyle->display() == DisplayType::Block ) ||
> > > (oldStyle->display() == DisplayType::InlineBlock)))
> > >             parent()->setChildNeedsLayout(MarkOnlyThis);
> > > 
> > > _______
> > > 
> > > I tried to change "last line" with:
> > > 
> > > setNeedsLayout() and other child variants to force repainting to get this
> > > fixed but it seems it does not work in case of Safari.
> > > 
> > > Would appreciate any input or suggestion. Just wanted to share my input and
> > > progress in the background on fixing this bug. Thanks!
> > I think parent()->setNeedsLayout(LayoutInvalidationReason::ChildChanged,
> > MarkContainerChain); maps to parent()->setChildNeedsLayout();
> 
> Just tried on local build. Still it does have repaint bug where resizing
> make it aligned with Chrome Canary 112 and Firefox Nightly 112.

FIXED it:

if ((oldStyle && isOutOfFlowPositioned() && parent() && (parent() != containingBlock()))
        && (style().position() == oldStyle->position())
        && (style().isOriginalDisplayInlineType() != oldStyle->isOriginalDisplayInlineType())
        && ((style().isOriginalDisplayBlockType()) || (style().isOriginalDisplayInlineType()))
        && ((oldStyle->isOriginalDisplayBlockType()) || (oldStyle->isOriginalDisplayInlineType())))
            parent()->setChildNeedsLayout();

[Ahmad Saleem]

PR - https://github.com/WebKit/WebKit/pull/11781/files

In local testing, it passes this feeling test from JSFiddle of Comment 0. Running through EWS and will rebase any failing test tomorrow morning.

[EWS]

Committed 262042@main (47b7f1121f2e): <https://commits.webkit.org/262042@main>

Reviewed commits have been landed. Closing PR #11781 and removing active labels.