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

Status: RESOLVED DUPLICATE of bug 1077750

(DevTools :: Inspector, defect)

Description

[Stephanie Hobson [:shobson]]

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

Comment 1

[Patrick Brosset <:pbro>]

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.