Flex highlighter shouldn't scroll for position:fixed elements

VERIFIED FIXED in Firefox 66

Status

defect
P2
normal
VERIFIED FIXED
5 months ago
5 months ago

People

(Reporter: pbro, Assigned: miker)

Tracking

(Depends on 1 bug, Blocks 1 bug)

unspecified
Firefox 66
Dependency tree / graph

Firefox Tracking Flags

(firefox66 verified)

Details

Attachments

(3 attachments)

Posted image fixed-element.gif

Steps:

  • open this page: data:text/html,<div style="width:500px;height:5000px;"></div><div style="position:fixed;bottom:0;width:100%;background:red;height:50px;display:flex">I won't scroll
  • open the inspector
  • find the position:fixed element and click on the [flex] badge next to it
  • scroll the page

Expected:

The flex highlighter should stick to the element.

Actual:

The flex highlighter moves around while you scroll.

Assignee: nobody → mratcliffe
Status: NEW → ASSIGNED
OS: Unspecified → All
Priority: -- → P2
Hardware: Unspecified → All

This fixes the issue but because of our virtual canvas implementation and the
fact that reflow events are batched there is quite a bit of flicker and some
drag (see attached video).

Unfortunately, until bug 1509071 is implemented (full screen canvas using
position:fixed) we can't really do anything about the flicker... I suppose we
could stop batching reflow events but that would make all of our highlighters
unusably slow.

Comment 3

5 months ago
Pushed by mratcliffe@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/dc8bd111db70
Flex highlighter shouldn't scroll for position:fixed elements r=gl

Comment 4

5 months ago
bugherder
Status: ASSIGNED → RESOLVED
Closed: 5 months ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 66
Depends on: 1521825

This bug still exists for the grid highlighter, FWIW. (If you adjust the data URI in comment 0 to use display:grid instead of display:flex, then the bug still reproduces. Here's a modified data URI for that:

data:text/html,<div style="width:500px;height:5000px;"></div><div style="position:fixed;bottom:0;width:100%;background:red;height:50px;display:grid">I won't scroll

I guess bug 1521067 covers that. (Incidentally, that also means bug 1521825 is not [yet] a problem for the grid highlighter. :))

Confirmed the issue with 66.0a1 (2019-01-18) on Windows 10 x64, Ubuntu 18.04 x64, macOS 10.11.6.
Fix verified with 66.0b3 build1 (20190128143734), Windows 10 x64, Ubuntu 18.04 x64, macOS 10.11.6.
Considering that the still existing flicker won’t be fixed per comment 2 and the grid highlighter issue is treated separately per comment 5, I will mark this bug accordingly.

Status: RESOLVED → VERIFIED
Flags: qe-verify+
You need to log in before you can comment on or make changes to this bug.