Closed Bug 1631169 Opened 5 years ago Closed 3 years ago

css transform with z-index jitters

Categories

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

75 Branch
x86_64
All
defect

Tracking

()

RESOLVED WORKSFORME
Tracking Status
firefox75 --- affected
firefox76 --- affected
firefox77 --- affected

People

(Reporter: ryu.decade.555, Unassigned)

References

Details

Attachments

(1 file, 3 obsolete files)

Attached file transform.html (obsolete) (deleted) —

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:75.0) Gecko/20100101 Firefox/75.0

Steps to reproduce:

I can reproduce the steps by following these steps:

  1. Start Firefox
  2. Open the attachment (transform.html) that contains the bug.
  3. Press Ctrl+Shift+M to open Responsive Design Mode, and to clearly see the error
  4. Click the first dropdown (hamburger icon), which unravel other links
  5. Click the "dropdown" link, which contains another dropdown items.
  6. Make sure you look at the bottom of the main navigation then close the "dropdown" link to see the bug.

When the second dropdown is minimizing, called dropdown, it will ignore the z-index for a second then go back to its style when the animation is done.

Here is a video capture of the problem: https://streamable.com/0bbmjy

Actual results:

The dropdown will ignore the z-index for a split second that causes it to jitter.

Expected results:

It shouldn't jitter and should respect z-index of the element.

If you still can't see the problem, here is the link to the codepen: https://codepen.io/Supersudo/pen/PoPweJL

This is much obvious than the first one.

  1. Open the link to the pen.
  2. Rerun the code by pressing "Run"
  3. Repeatedly open and close the dropdown called "dropdown".
Attached file transform.html (obsolete) (deleted) —
Attached file transform.html (deleted) —
Attachment #9141466 - Attachment is obsolete: true
Attachment #9141469 - Attachment is obsolete: true
OS: Unspecified → Linux
Hardware: Unspecified → x86_64
Component: Untriaged → CSS Transitions and Animations
OS: Linux → All
Product: Firefox → Core

I can repro only with WebRender disabled.

Status: UNCONFIRMED → NEW
Component: CSS Transitions and Animations → Graphics: Layers
Ever confirmed: true

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

I can repro only with WebRender disabled.

Oh, I forgot to mention about WebRender. I'm sorry.
WR is disabled by default though. Is that the expected result when WR is disabled?

Probably not, but that just means that this is not a CSS bug, but a graphics bug.

Huh, it might be.

Blocks: not-wr
Priority: -- → P3

Change the status for beta to have the same as nightly and release.
For more information, please visit auto_nag documentation.

I don't actually know how to do the "auto_nag".

Hey Ryu, this isn't very clear indeed. This is just an automation bot that changed some tracking flags, no action to take here.

(In reply to Kris Taeleman (:ktaeleman) from comment #10)

Hey Ryu, this isn't very clear indeed. This is just an automation bot that changed some tracking flags, no action to take here.

Oh okay, thanks!

Because this bug's Severity has not been changed from the default since it was filed, and it's Priority is P3 (Backlog,) indicating it has been triaged, the bug's Severity is being updated to S3 (normal.)

Severity: normal → S3
Attachment #9201193 - Attachment is obsolete: true

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

I can repro only with WebRender disabled.

Status: NEW → RESOLVED
Closed: 3 years ago
Depends on: fixed-by-webrender
Resolution: --- → WORKSFORME
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: