CSS generated content cannot be inspected on element with display: none

RESOLVED DUPLICATE of bug 1077750

Status

DevTools
Inspector
RESOLVED DUPLICATE of bug 1077750
3 years ago
a month ago

People

(Reporter: shobson, Unassigned)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

(Reporter)

Description

3 years ago
When an element with CSS generated content (ie before/after) is display:none the before and after items do not appear in the inspector. This is unexpected behaviour but Chrome does this too so I think this is probably hard ;)

The problem is that switching the element back to display: (something not none) does not add the before and after items to the inspector.

Test:

HTML:
<div class="test1"></div>
<div class="test2"></div>

CSS:

div:before {
  content: 'foo';
}

.test2 {
  display: none;
}

Can see :before in the inspector for .test1 but not .test2

Here it is in a code pen:
http://codepen.io/stephaniehobson/pen/vORawE?editors=110
Yes we unfortunately do not yet have a way to track style changes that cause pseudo-elements to be appended or removed. This was filed in bug 1077750 already.
Status: NEW → RESOLVED
Last Resolved: 3 years ago
Resolution: --- → DUPLICATE
Duplicate of bug: 1077750

Updated

a month ago
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.