Closed Bug 1501195 Opened 3 years ago Closed 2 years ago

Snapping problem (and a jiggling image) on


(Core :: Graphics: WebRender, defect, P3)




Tracking Status
firefox-esr60 --- unaffected
firefox63 --- unaffected
firefox64 --- disabled
firefox65 --- disabled
firefox66 --- fixed


(Reporter: jan, Assigned: aosmond)


(Blocks 2 open bugs, )


(Keywords: correctness, nightly-community, regression)


(2 files)

Attached video 2018-10-23_09-57-59.mp4
Screencast: Left=last good, right=first bad.

bad = There is a flickering line on the left side of a growing image. (The image was already jiggling before.)

mozregression --good 2018-06-01 --bad 2018-10-22 --pref gfx.webrender.all:true -a
> 12:34.36 INFO: Last good revision: 10b2b242b9bdf9daa261c66f269f622d51cb6a12
> 12:34.36 INFO: First bad revision: f5063652dacb667a451348c37c983cf962eaf324
> 12:34.36 INFO: Pushlog:

> f5063652dacb	Jeff Muizelaar — Bug 1490640. Mark intermittent tests as random.
> 969f3b484bbb	Jeff Muizelaar — Bug 1490640. Update webrender to 70edb5f8a75ea1e1440ba7984cc42df9eb05ae69

Regression range:
Assignee: nobody → aosmond
This doesn't just happen when it loads. After it finishes, I can find zoom levels where it contains a bad line on either the left and/or the right side.
This is a reduced test case distilled from the original page where the
problem was first observed.
The transform: translate3d(0px, 0px, 0px) seems to make us create an extra stacking context. This splits off the translate (since the content starts a few pixels down from the top edge and over from the left edge) and the scaling for the background image. However the clips are slightly different and we end up rendering an extra row/column of green pixels as a result. I was thinking this was because of the image snapping issue in bug 1453747 but I think the clip in question was not generated/related to the image itself (since it lives between the translate and scaling stacking contexts, and is applied to the latter in its clip/scroll info), so something else may have gone wrong.
From comment 4, I confirmed the patch for bug 1453747 has no impact on this.

The latest clipping changes fixed my new reftest, but I can still reproduce the issue on the original link while it is animating/scaling the image, if I adjust the initial zooming.

The updated reftest doesn't look the same yet (closer, but now the red rect is too small), but the original problem and the green rect spilling past the red rect in the upper left corner in the reftest can be solved by rounding the bounds rect of the transform:

For a container frame, if there is no transform or the transform is only a translation, we appear to round the offset we get from the reference frame:

If we make the same decision in nsDisplayTransform::CreateWebRenderCommands, this seems to fix this bug, as well as bug 1498962. Reftests seem unaffected if we do this:

Attachment #9030754 - Attachment description: Bug 1501195 - Part 1. Add a reftest demostrating the image snapping problem. → Bug 1501195 - Fix snapping issues caused by translation only transforms.
Pushed by
Fix snapping issues caused by translation only transforms. r=jrmuizel
Closed: 2 years ago
Resolution: --- → FIXED
Target Milestone: --- → mozilla66
Duplicate of this bug: 1498962
Duplicate of this bug: 1508203
Duplicate of this bug: 1494934
You need to log in before you can comment on or make changes to this bug.