Closed Bug 1725908 Opened 3 years ago Closed 2 years ago

CSS transitions on background of root HTML element not redrawing properly

Categories

(Core :: DOM: Animation, defect)

Product:
Core
Component:
DOM: Animation
Version:
Firefox 91
Type:
defect

Tracking

()

Status:
RESOLVED FIXED
Milestone:
98 Branch
Tracking Flags:
Tracking Status
firefox-esr78 --- unaffected
firefox-esr91 --- wontfix
firefox93 --- wontfix
firefox94 --- wontfix
firefox95 --- wontfix
firefox96 --- wontfix
firefox97 --- wontfix
firefox98 --- fixed

People

(Reporter: erin20913, Assigned: hiro)

References

(Regression)

Details

(Keywords: regression)

Attachments

(2 files)

Repro demo FF 91.0
1.14 MB, image/gif
Details
Bug 1725908 - Disallow background color animations on <html> element running on the compositor. r?boris
48 bytes, text/x-phabricator-request
Details | Review
Attached image Repro demo FF 91.0 —

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:91.0) Gecko/20100101 Firefox/91.0

Steps to reproduce:

  • Constrain the size of the root <html> element of a webpage so it is smaller than the viewport, e.g. with width: 100px; height: 100px;
  • Add a transition for the <html> element's background property, e.g. transition: background 5s to the style of a webpage's root <html> element
  • Change the background of the <html> element, e.g. through Javascript

I've produced a CodePen demo that demonstrates the issue: https://codepen.io/eritbh/pen/QWvPzJj

Actual results:

The transition does not appear to redraw the canvas area outside the bounding box of the <html> element. Moving the cursor in this area can cause the area to be redrawn periodically during the transition period. The behavior is slightly different depending on the opacities involved in the transition. I test two scenarios in the attached screen capture: the first transitions between blue and black, and the second between transparent (the default) and black. Note that when a transparent color is involved, even when constantly moving the mouse around to trigger redraws, the color outside the root element appears to update at a different pace than the color inside.

Expected results:

The background of the canvas area should transition smoothly, in time with the background of the root <html> element itself, without requiring cursor movement to trigger paints. This works as intended in current Chromium-based browsers (tested against Chrome canary 95.0.4608.0, Edge stable 92.0.902.73).

The Bugbug bot thinks this bug should belong to the 'Core::DOM: Core & HTML' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.

Component: Untriaged → DOM: Core & HTML
Product: Firefox → Core

Regression window:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=4c53c4da7ece47da52974e38be6300c1212dc3e7&tochange=6128a351b7e7dc8b75f789a884948764a0f8e1e9

Status: UNCONFIRMED → NEW
Has Regression Range: --- → yes
Has STR: --- → yes
Component: DOM: Core & HTML → DOM: Animation
Ever confirmed: true
Keywords: regression
Regressed by: 1699890
Flags: needinfo?(hikezoe.birchill)

Set release status flags based on info from the regressing bug 1699890

status-firefox93: --- → affected
status-firefox94: --- → affected
status-firefox-esr78: --- → unaffected
status-firefox-esr91: --- → affected

We don't support background color animations running on the compositor for
nsDisplayCanvasBackgroundColor and nsDisplaySolidColor display items,
<html> element is one of elements using the items.

The reftest in this commit fails on opt builds, asserts an assertion [1]
in the ctor of nsDisplayBackgroundColor.

[1] https://searchfox.org/mozilla-central/rev/080e18fa4748456003164f58b0d925b8c3826a67/layout/painting/nsDisplayList.h#4317

Assignee: nobody → hikezoe.birchill
Status: NEW → ASSIGNED
Flags: needinfo?(hikezoe.birchill)
Pushed by hikezoe.birchill@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/80f9187ab150
Disallow background color animations on <html> element running on the compositor. r=boris

https://hg.mozilla.org/mozilla-central/rev/80f9187ab150

Status: ASSIGNED → RESOLVED
Closed: 2 years ago
status-firefox98: --- → fixed
Resolution: --- → FIXED
Target Milestone: --- → 98 Branch

The patch landed in nightly and beta is affected.
:hiro, is this bug important enough to require an uplift?
If not please set status_beta to wontfix.

For more information, please visit auto_nag documentation.

Flags: needinfo?(hikezoe.birchill)
status-firefox97: affected → wontfix
Flags: needinfo?(hikezoe.birchill)
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: