1519073 - Sticky positioning with transform between it and reference box is not scrolled properly

Status: RESOLVED FIXED

(Core :: Panning and Zooming, defect, P3)

Description

[Oriol Brufau [:Oriol]]

Attachment: testcase.htm

Open the attached testcase, it contains a sticky positioned elements inside a scroll container. The quirk is that there is a transformed element between them.

Scroll the container.

The sticky element moves discretely and buggy in Firefox.

It should probably move smoothly from right to left, like in Chromium.

Also see https://github.com/w3c/csswg-drafts/issues/3186

Comment 1

[Oriol Brufau [:Oriol]]

Attachment: screencast-firefox.gif

This is what I see in Firefox

Comment 2

[Oriol Brufau [:Oriol]]

Attachment: screencast-chrome.gif

This is what I see in Chromium

Comment 3

[Emilio Cobos Álvarez (:emilio)]

This seems to work fine in WebRender (you can check toggling gfx.webrender.all to true on Firefox Nightly).

So this is most likely an async-scrolling / APZ bug.

Comment 4

[Emilio Cobos Álvarez (:emilio)]

We should probably add a test to avoid regressing this in WR.

Comment 5

[jonjohnjohnson]

Ya I mentioned WebRender fixing this in the initial csswg filing. At least when I run it on mac.

Comment 6

[jonjohnjohnson]

(In reply to Emilio Cobos Álvarez (:emilio) from comment #4)

We should probably add a test to avoid regressing this in WR.

Aside form adding the test, there is a tangential way to cause the bug even with WebRender enabled, where the perspective property set to a non-auto value for the transformation will have it's painting bugged mid scroll.

http://jsfiddle.net/gmwnLqkj/

Should I file that separately or is it encapsulated here? Possibly just how transforms/perspectives behave with stacking contexts in gecko?

Comment 7

[Emilio Cobos Álvarez (:emilio)]

Attachment: Bug 1519073 - Add a reftest to avoid regressing this in webrender.

Well, or an attempt at it. Running it with webrender enabled still fails because
we clip the bottom of the scroller on the test screenshot.

I cannot reproduce it when I scroll replacing overflow-y: hidden by overflow-y:
scroll, so there's something fishy there, but it might be that I'm doing
something wrong with the reftest harness (I don't know what the
displayport-{w,h} values are supposed to be really).

Kats / Botond, any chance you could take a look to see where I messed up?

Comment 8

[Emilio Cobos Álvarez (:emilio)]

(In reply to jonjohnjohnson from comment #6)

Aside form adding the test, there is a tangential way to cause the bug even with WebRender enabled, where the perspective property set to a non-auto value for the transformation will have it's painting bugged mid scroll.

http://jsfiddle.net/gmwnLqkj/

Should I file that separately or is it encapsulated here? Possibly just how transforms/perspectives behave with stacking contexts in gecko?

I suspect that's bug 1498639.

Comment 9

[Emilio Cobos Álvarez (:emilio)]

Attachment: Bug 1519073 - Pass the current clip chain id instead of clipping to the filter bounds. r?mattwoodrow

We could also instead, maybe, force isolation when we have a stacking context
with blurs or such, and remove this clip altogether... That might be cleaner
actually.

In any case this works.

Comment 10

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/22fefdbe40ee
Add a reftest to avoid regressing this in webrender. r=kats,botond

Comment 11

[Bogdan Tara[:bogdan_tara | bogdant]]

https://hg.mozilla.org/mozilla-central/rev/22fefdbe40ee

Comment 12

[BugBot [:suhaib / :marco/ :calixte]]

The leave-open keyword is there and there is no activity for 6 months.
:botond, maybe it's time to close this bug?

Comment 13

[Botond Ballo [:botond]]

We don't want to close it, as the patch that has landed is just a test, not a fix.

But we can remove the leave-open keyword.