Closed Bug 1449333 Opened 6 years ago Closed 6 years ago

Support closed shadow roots in the inspector

Categories

(DevTools :: Inspector, enhancement, P2)

enhancement

Tracking

(firefox63 verified)

VERIFIED FIXED
Firefox 63
Tracking Status
firefox63 --- verified

People

(Reporter: jdescottes, Assigned: jdescottes)

References

Details

Attachments

(1 file)

Follow up to Bug 1053898, the inspector will be able to display shadow roots in open mode, we should also support shadow roots in closed mode (.shadowRoot will return null in this case)
Bug 1421568 added a ChromeOnly method to access closed shadow roots.
Depends on: 1421568, 1053898
Product: Firefox → DevTools
Assignee: nobody → jdescottes
Status: NEW → ASSIGNED
try push: https://treeherder.mozilla.org/#/jobs?repo=try&revision=8d97d79474fad18048ca389cfdd9212baa5d3fd1 

There is one eslint failure on try which has been fixed on the patch attached here.
In the end we only had to use the chrome-only getter openOrClosedShadowRoot instead of shadowRoot everywhere.
Comment on attachment 8986426 [details]
Bug 1449333 - Display closed shadow roots in the inspector;

https://reviewboard.mozilla.org/r/251658/#review258556

::: devtools/client/inspector/markup/test/browser_markup_shadowdom.js:209
(Diff revision 2)
> -  await checkTreeFromRootSelector(EXPECTED_TREE, "test-component", inspector);
> +  // Test each configuration in both open and closed modes
> +  add_task(async function() {
> +    info(`Testing: [${title}] in OPEN mode`);
> +    await enableWebComponents();
> +    const {inspector} = await openInspectorForURL(url.replace("#MODE#", "open"));
> +    await checkTreeFromRootSelector(tree, "test-component", inspector);

When running the test locally I see info logs like `Checking [undefined test-component]` (from the `checkNode` function called by `checkTreeFromRootSelector`). Is that expected?
Attachment #8986426 - Flags: review?(bgrinstead) → review+
(In reply to Brian Grinstead [:bgrins] from comment #5)
> Comment on attachment 8986426 [details]
> Bug 1449333 - Display closed shadow roots in the inspector;
> 
> https://reviewboard.mozilla.org/r/251658/#review258556
> 
> ::: devtools/client/inspector/markup/test/browser_markup_shadowdom.js:209
> (Diff revision 2)
> > -  await checkTreeFromRootSelector(EXPECTED_TREE, "test-component", inspector);
> > +  // Test each configuration in both open and closed modes
> > +  add_task(async function() {
> > +    info(`Testing: [${title}] in OPEN mode`);
> > +    await enableWebComponents();
> > +    const {inspector} = await openInspectorForURL(url.replace("#MODE#", "open"));
> > +    await checkTreeFromRootSelector(tree, "test-component", inspector);
> 
> When running the test locally I see info logs like `Checking [undefined
> test-component]` (from the `checkNode` function called by
> `checkTreeFromRootSelector`). Is that expected?

This was logging the "path" in the tree being tested, but the generated string was buggy for the root item. Just fixed it, thanks!

Will land after 63 cycle starts.
Priority: P3 → P2
Pushed by jdescottes@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/e56db5c40eb7
Display closed shadow roots in the inspector;r=bgrins
https://hg.mozilla.org/mozilla-central/rev/e56db5c40eb7
Status: ASSIGNED → RESOLVED
Closed: 6 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 63
Flags: qe-verify+
Flags: needinfo?(timea.zsoldos)
I have reproduced this issue using Firefox 61.0a1 (2018.03.27) on Ubuntu 18.04. 
I can confirm this issue is fixed, I verified using Firefox 63.0b6 on Ubuntu 18.04 x64, Windows 7 x64 and Mac OS X 10.13.
Status: RESOLVED → VERIFIED
Flags: needinfo?(timea.zsoldos)
Flags: qe-verify+
You need to log in before you can comment on or make changes to this bug.