Bug 202217

Summary: Web Inspector: Regression: Shadow DOM elements are not visible
Product: WebKit Reporter: Tim Guan-tin Chien [:timdream] <timdream>
Component: Web InspectorAssignee: Nobody <webkit-unassigned>
Status: RESOLVED INVALID    
Severity: Normal CC: hi, inspector-bugzilla-changes, nvasilyev, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: Safari Technology Preview   
Hardware: Mac   
OS: macOS 10.13   
Attachments:
Description Flags
screenshot none

Tim Guan-tin Chien [:timdream]
Reported 2019-09-25 11:52:43 PDT
Created attachment 379570 [details] screenshot STR: 1. Load this URL which insert an open shadow root under <body> data:text/html,<script>window.onload%20=%20()%20=>%20{%20sr%20=%20document.body.attachShadow({mode:%20"open"});%20sr.innerHTML%20=%20"<div>Hello</div>";%20}</script> 2. Try to inspect the element containing the word "Hello" Expected: 1. It shows up. Actual: 1. It did not. The Shadow Root is not visible is not under <body> Note: Works on Released Safari (Version 13.0.1 (14608.2.11.1.11)), broken on STP 92. It didn't consistently working for me in previous Safari versions but it has now consistently broken.
Attachments
screenshot (759.97 KB, image/png)
2019-09-25 11:52 PDT, Tim Guan-tin Chien [:timdream] 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Radar WebKit Bug Importer
Comment 1 2019-09-25 11:53:12 PDT
<rdar://problem/55712964>
Devin Rousso
Comment 2 2019-09-25 12:00:04 PDT
Do you have the "Show shadow DOM nodes" navigation item enabled in the Elements Tab? It looks very roughly like <<>>.
Tim Guan-tin Chien [:timdream]
Comment 3 2019-09-25 12:04:10 PDT
(In reply to Devin Rousso from comment #2) > Do you have the "Show shadow DOM nodes" navigation item enabled in the > Elements Tab? It looks very roughly like <<>>. Ouch. I didn't. Sorry. Is the toggle on or off by default? Did I accidentally turn it off?
Devin Rousso
Comment 4 2019-09-25 12:05:37 PDT
(In reply to Tim Guan-tin Chien [:timdream] from comment #3) > (In reply to Devin Rousso from comment #2) > > Do you have the "Show shadow DOM nodes" navigation item enabled in the Elements Tab? It looks very roughly like <<>>. > > Ouch. I didn't. Sorry. Is the toggle on or off by default? Did I accidentally turn it off? No worries! Better to have it be a mistake than it be broken :P It should be on by default as of r246821 <https://webkit.org/b/199128>.
Nikita Vasilyev
Comment 5 2019-09-25 13:54:48 PDT
Why do we even have this setting? Can it always be enabled? If I don't want to look inside of the Shadow DOM roots, I simply won't expand them.
Devin Rousso
Comment 6 2019-09-25 14:30:06 PDT
(In reply to Nikita Vasilyev from comment #5) > Why do we even have this setting? Can it always be enabled? If I don't want to look inside of the Shadow DOM roots, I simply won't expand them. It can be useful to turn off if you want to see what JavaScript/CSS would see if it were trying to work with the DOM tree (e.g. `querySelectorAll` or any selector).
Note You need to log in before you can comment on or make changes to this bug.