New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.
Starred by 14 users

Issue metadata

Status: Fixed
Owner:
Closed: Dec 2013
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: All
Pri: 1
Type: Bug



Sign in to add a comment

Cannot inspect styles if an element is in shadow DOM

Project Member Reported by ykyyip@chromium.org, Aug 26 2013

Issue description

Version: 31.0.1611.0 (Official Build 219463) canary
OS: Mac OS X

What steps will reproduce the problem?

1. Create a element with a shadow root.
2. Append a child element to the shadow root and style it.
3. Inspect the child element

Example: http://jsbin.com/UKOG/2/edit


What is the expected output? What do you see instead?

Expect to see style information for the shadow DOM child element in the inspector. (color: red in the example) I don't see anything useful.


Please use labels and text to provide additional information.
 

Comment 1 by ykyyip@chromium.org, Aug 26 2013

Labels: Hotlist-Toolkit

Comment 2 by ykyyip@chromium.org, Aug 26 2013

The bug only shows when the styles are in a <style> tag within the shadow root. Another example: http://jsbin.com/UKOG/3/edit

<div>
  SR
    <style>
      .red {
        color: red;
      }
    </style>
    <div class="red" style="font-weight:bold">hi!</div>
</div>

In that example font-weight: bold shows up in the inspector, but not color: red.

Comment 3 by loislo@chromium.org, Aug 29 2013

Status: Assigned
Owner: pfeldman@chromium.org
Labels: -Pri-2 Pri-1
Upping priority per toolkit bug scrub
Owner: lushnikov@chromium.org
Status: Started
Labels: Cr-Platform-DevTools
Cc: sorvell@chromium.org dominicc@chromium.org
 Issue 303959  has been merged into this issue.
Status: Fixed

Sign in to add a comment