Some icons are not visible anymore when active

VERIFIED FIXED in Firefox 57

Status

()

Firefox
Developer Tools: Inspector
VERIFIED FIXED
5 months ago
4 months ago

People

(Reporter: pbro, Assigned: jdescottes)

Tracking

unspecified
Firefox 57
Points:
---

Firefox Tracking Flags

(firefox57 verified)

Details

MozReview Requests

()

Submitter Diff Changes Open Issues Last Updated
Loading...
Error loading review requests:

Attachments

(3 attachments)

Created attachment 8908091 [details]
Capture.PNG

STR:
- switch to the new dark theme
- open a page that has a grid in it: http://labs.jensimmons.com/examples/grid-content-1.html
- select the <main> node in the inspector
- in the rule-view, click on the grid icon (waffle icon) in the display:grid declaration

--> expected: the icon should appear as selected/active
--> actual: the icon becomes invisible
Oh, same in light theme actually. The icon just disappears there too.
I don't understand what doesn't work anymore here. The icon is converted to a different color by using the following SVG color transformation matrix:
http://searchfox.org/mozilla-central/source/devtools/client/themes/images/filters.svg#6-12
This is a more general problem, the selector icon in the rule-view also exposes the symptom. Also the inspector icon inside the console.
Summary: the grid "waffle" icon is not visible anymore with the new dark theme when it is active → Some icons are not visible anymore when active
(Assignee)

Updated

5 months ago
Assignee: nobody → jdescottes
Status: NEW → ASSIGNED
Comment hidden (mozreview-request)
Comment hidden (mozreview-request)
(Reporter)

Comment 6

5 months ago
mozreview-review
Comment on attachment 8908148 [details]
Bug 1399841 - use themed SVG filter for all DevTools active icons;

https://reviewboard.mozilla.org/r/179828/#review185040
Attachment #8908148 - Flags: review?(pbrosset) → review+
(Reporter)

Comment 7

5 months ago
mozreview-review
Comment on attachment 8908149 [details]
Bug 1399841 - add dedicated CSS variable to support filters in Firebug theme;

https://reviewboard.mozilla.org/r/179830/#review185042
Attachment #8908149 - Flags: review?(pbrosset) → review+
I had to use a dirty workaround to avoid applying filters on Firebug theme's checked icons (which are real images, and not SVGs).

I logged Bug 1399886 in order to start using fill-context, which should help us to clean both our filters+remove this Firebug theme specific hack.
See Also: → bug 1399886

Comment 9

5 months ago
Pushed by jdescottes@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/a413fc1e540f
use themed SVG filter for all DevTools active icons;r=pbro
https://hg.mozilla.org/integration/autoland/rev/0d5051ae4f94
add dedicated CSS variable to support filters in Firebug theme;r=pbro
https://hg.mozilla.org/mozilla-central/rev/a413fc1e540f
https://hg.mozilla.org/mozilla-central/rev/0d5051ae4f94
Status: ASSIGNED → RESOLVED
Last Resolved: 5 months ago
status-firefox57: --- → fixed
Resolution: --- → FIXED
Target Milestone: --- → Firefox 57
Flags: qe-verify+
QA Contact: iulia.cristescu
Managed to reproduce the initial issue on 57.0a1 (2017-09-14). I can confirm that 57.0b7 build1 (20171009192146) is verified fixed using Windows 10 x64, Ubuntu 16.04 x64 and Mac OS X 10.11.6.
Status: RESOLVED → VERIFIED
status-firefox57: fixed → verified
Flags: qe-verify+
You need to log in before you can comment on or make changes to this bug.