1305966 - Repaint issue when using CSS variables (custom properties) with background-image

Status: RESOLVED WORKSFORME

(Core :: Layout, defect)

Description

[Jerome Louis]

Attachment: repaint_issue_ff.png

User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36

Steps to reproduce:

(Hard to reproduce)

Happens randomly when a user interaction replaces a DOM subtree in which an element has a background-image value that uses a CSS variable, by another subtree in which another element has a background-image value that uses the same CSS variable

div {
  background-image: var(--my-background);
}


Actual results:

The background using the CSS variable is not repainted, which result in viewing the previous subtree content in place of the background, until a user interaction triggers a new repaint (such as a resize of the window).

Sometimes there is also an issue when loading the page, as the background just ends up being completely absent and replaced by a black background.

See attachment for more info.


Expected results:

There should not be a repaint issue.

Comment 1

[Loic]

Could you provide a simple testcase to reproduce the issue, please.

Comment 2

[Jerome Louis]

Attachment: bug_repaint_ff.zip

Added zip file with small test page to reproduce the issue.

See Readme (inside zip) for more info on how to use.

I could not reproduce exactly the same issue as specified in the bug report, probably because my application is way bigger. But a very similar repaint issue can be observed in this simple web page.

Comment 3

[Loic]

Attachment: background.jpg

Comment 4

[Loic]

Attachment: index2.html (reporter's testcase)

Comment 5

[Alice0775 White]

Reporter,

1. Could you test with Firefox beta[1], Dev[2] and Nightly[3]?

[1] https://www.mozilla.org/en-US/firefox/channel/#beta
[2] https://www.mozilla.org/en-US/firefox/channel/#developer
[3] https://nightly.mozilla.org/

2. And Clould you attach the results of about:support (Help > Troubleshooting Information)?

Comment 6

[Jerome Louis]

1.

[1] Not reproduced on 50.0b4
[2] Not reproduced on 51.0a2
[3] Not reproduced on 52.0a1

2. See attachments

Comment 7

[Jerome Louis]

Attachment: about:support (text version)

Comment 8

[Jerome Louis]

Attachment: about:support (json version)

Comment 9

[Astley Chen (inactive)]

Just did spot checks on FF56+ versions, it didn't happen now.
Besides, I also tested the versions at the time of issue reporting, sometimes contents were overlapped during switching but didn't cause any afterimage. Overlap issue does not exist now, I'll assume that the issue is no longer there too. Please correct me if it's still reproducible.