1518864 - Hover transition from opaque to transparent background-color shows a flash of black

Status: RESOLVED DUPLICATE of bug 1513522

(Core :: Graphics, defect)

Description

[Florens Verschelde :fvsch]

We have an issue in DevTools which looks like a platform issue: bug 1516948 (there is a video there showing the issue).

Elements with a background-color transition from an opaque color to transparent show a black flash. The flash is most visible for short transitions, for example 50ms. It seems that when transitioning from #eee to a transparent, we are transitioning first to a darker shade of #eee (maybe black, maybe a medium gray).

I can reproduce it in this minimal testcase:
https://codepen.io/anon/pen/xmabGK
(Strangely enough, when I converted it to a standalone HTML page, I couldn't reproduce.)

There may be other factors playing out. For instance, in the above testcase:

• The black background seems to be painted behind the actual background-color (see the green examples).
• If I hover the edge of the element I can get the black background transition to show up for the full length of the transition.

I first saw this issue on DevTools buttons in Firefox 65. Not sure if it happened before. Seen on macOS and Linux, and we have a duplicate bug on Windows (bug 1517449).

Comment 1

[Emilio Cobos Álvarez (:emilio)]

Could you confirm this is a regression from bug 1504065? If so, please do mark it as such and ni? :hiro :)

I can confirm I don't see this with WebRender enabled at least, which is a hint.

Comment 2

[Florens Verschelde :fvsch]

I can reproduce on https://codepen.io/anon/pen/xmabGK with Firefox Nightly on macOS:

• Buggy (flash) with gfx.webrender.all=false + gfx.omta.background-color=true
• Unaffected with gfx.omta.background-color=false
• Unaffected with gfx.webrender.all=true

I restarted Nightly between each test, since at least WebRender needs a restart.