1236563 - Invisible icons in light theme in developer tools on windows

Status: NEW

(DevTools :: Framework, defect, P3)

Description

[u498684]

Attachment: no-icons-in-developer-tools.png

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:46.0) Gecko/20100101 Firefox/46.0
Build ID: 20160103030302

Steps to reproduce:

1. Open developer tools.
2. Check that the light theme is enabled


Actual results:

No icons are visible in the developer tools tabstrip, except for the selected tab.


Expected results:

Icons should be visible.

Comment 1

[u498684]

Forgot to mention that the bug doesn't affect my MacBook Pro Retina. It only shows up on my Win10 computer.

Comment 2

[Chris]

I've verified this is an issue with Hardware Acceleration enabled.

OS:  Windows 10 Pro, 64-bit
Firefox:  44.0.2 (32-bit)
GPU:  AMD Radeon R9 380X (4GB) with v15.12 drivers

This also affects the Reddit Enhancement Suite addon when using "night mode"
(See this thread for more information:  https://www.reddit.com/r/RESissues/comments/46be3r/bug_expando_icons_missing_in_night_mode/)

Comment 3

[Chris]

See also:  https://bugzilla.mozilla.org/show_bug.cgi?id=1229375

Comment 4

[Brian Grinstead [:bgrins]]

Is this only affecting the light theme?  I wonder if it has to do with the CSS filter we are applying on the icons in light theme.

Comment 5

[Chris]

If I switch to dark theme, the icons appear correctly from what I can tell.

Comment 6

[Brian Grinstead [:bgrins]]

(In reply to Chris from comment #5)
> If I switch to dark theme, the icons appear correctly from what I can tell.

Michael, can you confirm that the icons come back if you disable hardware acceleration as in: https://www.reddit.com/r/RESissues/comments/46be3r/bug_expando_icons_missing_in_night_mode/d04dp5z?

I suspect it's due to this line and the CSS filter somehow not applying properly: https://dxr.mozilla.org/mozilla-central/source/devtools/client/themes/toolbars.css#991.

It's looking like we can make this depend on Bug 1229375.

Comment 7

[Chris]

Here's a screenshot comparing the light/dark themes of the developer console:
http://i.imgur.com/bKEjC6A.png

Comment 8

[u498684]

I don't have access to my windows pc before next weekend.
The GPU is, as with the others affected by the problem, a AMD R9 380 (just 380, not 380X).

The icon issue only affects the light theme. Switching to the dark theme worked as a workaround for me.

Comment 9

[u498684]

Disabling hardware accelerating fixes the problem for me.

Comment 10

[Brian Grinstead [:bgrins]]

(In reply to Michael Eischer from comment #9)
> Disabling hardware accelerating fixes the problem for me.

OK, thanks.  Sounds like this will be fixed by Bug 1229375

Comment 11

[Brian Grinstead [:bgrins]]

Leaving this open so we can re-check after Bug 1229375, but no immediate action needed from devtools here

Comment 13

[Chris]

No issues for me anymore with Firefox 52.0.2 (32 bit) on Windows 10, AMD Radeon R9 380 card and the latest 17.4.1 drivers with hardware acceleration enabled.