104877 2012-12-12 21:20:09 -0800 Web Inspector: need to visually distinguish UA shadow roots 2014-12-12 13:43:08 -0800 1 1 1 Unclassified WebKit Web Inspector (Deprecated) 528+ (Nightly build) All All RESOLVED INVALID P2 Enhancement --- 105311 62220 0 sgrekhov webcomponents-bugzilla apavlov dglazkov keishi loislo morrita pfeldman pmuellr shinyak vsevik webcomponents-bugzilla web-inspector-bugs webkit.review.bot yurys oldest_to_newest 790265 0 sgrekhov 2012-12-12 21:20:09 -0800 If Show Shadow DOM option is enabled in the inspector settings it shows ShadowRoots created by UA. For example tags like <video controls>, <datails>, <summary>, <input type="text"> contains build in ShadowRoot objects. Inspector shows them as #shadow-root. Problem is that when user creates Shadow roots they looks in the inspector exactly in the same way (as #shadow-root). It surprise users because they can see in the inspector additional ShadowRoots and treat them like a bug. Request is to show UA-created ShadowRoots in the different way, for example like #webkit-shadow-root 793252 1 179854 shinyak 2012-12-17 18:43:23 -0800 Created attachment 179854 Patch 793310 2 179854 webkit.review.bot 2012-12-17 20:34:46 -0800 Comment on attachment 179854 Patch Clearing flags on attachment: 179854 Committed r137979: <http://trac.webkit.org/changeset/137979> 793311 3 webkit.review.bot 2012-12-17 20:34:49 -0800 All reviewed patches have been landed. Closing bug. 793357 4 179854 pfeldman 2012-12-17 22:06:49 -0800 Comment on attachment 179854 Patch I am not a fan of this change since $0.nodeName will not match the value in the elements panel now. We could do #shadow-root (internal) or #shadow-root (user agent) #shadow-root (webkit) instead. 793361 5 yurys 2012-12-17 22:13:57 -0800 (In reply to comment #4) > (From update of attachment 179854 [details]) > I am not a fan of this change since $0.nodeName will not match the value in the elements panel now. We could do #shadow-root (internal) or #shadow-root (user agent) #shadow-root (webkit) instead. Good point, we should pass shadow root origin as a separate property. This way nodeName will match the value in the console and can still show the origin in the Elements panel. Sergey, can you take care of this? 793376 6 shinyak 2012-12-17 22:45:18 -0800 Thanks for taking care of this. Actually ShadowRoot.nodeName should return '#document-fragment' instead of '#shadow-root' (See Bug 104995). So if we would like to match nodeName and displayed name, we should show #document-fragment (shadow root) or something, I think. But showing '#shadow-root' might be user friendly... Can someone choose a good name for displaying #shadow-root and #webkit-shadow-root? 793377 7 pfeldman 2012-12-17 22:48:12 -0800 > Can someone choose a good name for displaying #shadow-root and #webkit-shadow-root? The point is that we should always display what is in $0.nodeName. So I'd rather have this patch rolled out and fixed on the DOM level. 793380 8 shinyak 2012-12-17 22:51:45 -0800 (In reply to comment #7) > > Can someone choose a good name for displaying #shadow-root and #webkit-shadow-root? > > The point is that we should always display what is in $0.nodeName. So I'd rather have this patch rolled out and fixed on the DOM level. Hmm... OK. I would like to hear Dimitri's thought about how we show ShadowRoot in the elements tab. 793388 9 pfeldman 2012-12-17 23:01:55 -0800 (In reply to comment #8) > (In reply to comment #7) > > > Can someone choose a good name for displaying #shadow-root and #webkit-shadow-root? > > > > The point is that we should always display what is in $0.nodeName. So I'd rather have this patch rolled out and fixed on the DOM level. > > Hmm... OK. > > I would like to hear Dimitri's thought about how we show ShadowRoot in the elements tab. Context for Dimitri: I think inspector should render shadow root titles as: node.nodeName + " " + (shadowRootType == UserAgentShadowRoot ? "(user agent)" : "") Today that would be: #shadow-root (user agent) or #shadow-root If you change the nodeName for roots in the future, inspector will update its display name accordingly. 793389 10 pfeldman 2012-12-17 23:03:15 -0800 > Hmm... OK. Sorry? If you think it is confusing / have an opinion on this one, please speak up. 793428 11 shinyak 2012-12-18 00:35:07 -0800 (In reply to comment #10) > > Hmm... OK. > > Sorry? If you think it is confusing / have an opinion on this one, please speak up. As a web developer, I would like to see string 'shadow-root' somewhere. just showing 'document fragment' seems confusing. So, I would like to see something like this: node.nodeName + " " + (shadowRootType == UserAgentShadowRoot ? "(useragent shadow root)" : "(shadow root)") # Note that ShadowRoot.nodeName should be '#document-fragment'. 793632 12 dglazkov 2012-12-18 07:47:48 -0800 (In reply to comment #11) > (In reply to comment #10) > > > Hmm... OK. > > > > Sorry? If you think it is confusing / have an opinion on this one, please speak up. > > As a web developer, I would like to see string 'shadow-root' somewhere. just showing 'document fragment' seems confusing. > > So, I would like to see something like this: > node.nodeName + " " + (shadowRootType == UserAgentShadowRoot ? "(useragent shadow root)" : "(shadow root)") > > # Note that ShadowRoot.nodeName should be '#document-fragment'. I defer to Inspector folks to find the right way to do visualize this. We do have a bug 104995, where we're showing "#shadow-root" as nodeName today, and that should be fixed soon, switching over to "#document-fragment". This will make displaying shadow root a bit more challenging, but perhaps it just need to be addressed with proper visualization. For instance, instead of showing nodeName, put some sort of a clickable badge/menu/etc. This particular change seems ill-fitting either way -- neither showing the current nodeName nor clearly explaining the distinction between UA/author shadow roots very well. 793683 13 webkit.review.bot 2012-12-18 08:34:22 -0800 Re-opened since this is blocked by bug 105311 1054993 14 burg 2014-12-12 13:40:58 -0800 Closing as invalid, as this bug pertains to the old inspector UI and/or its tests. Please file a new bug (https://www.webkit.org/new-inspector-bug) if the bug/feature/issue is still relevant to WebKit trunk. 179854 2012-12-17 18:43:23 -0800 2012-12-17 22:06:49 -0800 Patch bug-104877-20121218114040.patch text/plain 5172 shinyak U3VidmVyc2lvbiBSZXZpc2lvbjogMTM3OTYyCmRpZmYgLS1naXQgYS9Tb3VyY2UvV2ViQ29yZS9D aGFuZ2VMb2cgYi9Tb3VyY2UvV2ViQ29yZS9DaGFuZ2VMb2cKaW5kZXggMDI0YWI4YmE4MDRkODI3 MTZlY2E3YThjZWY4MTQ5OTk1ZWJjN2ViNi4uYjY2NmE0ZTgwNzUxMjFkMTAyNzgyMDZhOTFhZmI5 N2NkMzI2YmZlZCAxMDA2NDQKLS0tIGEvU291cmNlL1dlYkNvcmUvQ2hhbmdlTG9nCisrKyBiL1Nv dXJjZS9XZWJDb3JlL0NoYW5nZUxvZwpAQCAtMSwzICsxLDIyIEBACisyMDEyLTEyLTE3ICBTaGlu eWEgS2F3YW5ha2EgIDxzaGlueWFrQGNocm9taXVtLm9yZz4KKworICAgICAgICBXZWIgSW5zcGVj dG9yOiBuZWVkIHRvIHZpc3VhbGx5IGRpc3Rpbmd1aXNoIFVBIHNoYWRvdyByb290cworICAgICAg ICBodHRwczovL2J1Z3Mud2Via2l0Lm9yZy9zaG93X2J1Zy5jZ2k/aWQ9MTA0ODc3CisKKyAgICAg ICAgUmV2aWV3ZWQgYnkgTk9CT0RZIChPT1BTISkuCisKKyAgICAgICAgTm93IHdlIGhhdmUgYW4g b3B0aW9uIHRvIHNob3cgU2hhZG93Um9vdCBpbiB0aGUgSW5zcGVjdG9yLiBTaW5jZSB0aGUgSW5z cGVjdG9yIGhhcyBkaXNwbGF5ZWQgVXNlckFnZW50IFNoYWRvd1Jvb3QgYW5kCisgICAgICAgIEF1 dGhvciBTaGFkb3dSb290IGFzIHRoZSBzYW1lICNzaGFkb3ctcm9vdCwgYSB1c2VyIGNvdWxkIG5v dCBkaXN0aW5ndWlzaCB0aGVtLgorCisgICAgICAgIFdlIHdvdWxkIGxpa2UgdG8gc2hvdyBVc2Vy QWdlbnQgU2hhZG93Um9vdCBhcyAjd2Via2l0LXNoYWRvdy1yb290LgorCisgICAgICAgIFRlc3Q6 IGluc3BlY3Rvci9zaGFkb3ctcm9vdC5odG1sCisKKyAgICAgICAgKiBpbnNwZWN0b3IvSW5zcGVj dG9yRE9NQWdlbnQuY3BwOgorICAgICAgICAoV2ViQ29yZTo6SW5zcGVjdG9yRE9NQWdlbnQ6OmJ1 aWxkT2JqZWN0Rm9yTm9kZSk6IE1ha2Ugbm9kZU5hbWUgb2YgVXNlckFnZW50IFNoYWRvd1Jvb3Qg I3dlYmtpdC1zaGFkb3ctcm9vdC4KKyAgICAgICAgU2luY2UgdGhlIGNvcnJlY3Qgbm9kZU5hbWUg b2YgU2hhZG93Um9vdCBpcyAjZG9jdW1lbnQtZnJhZ21lbnQsIHdlIGhhdmUgdG8gc3BlY2lmeSB0 aGUgbm9kZU5hbWUgb2YgQXV0aG9yIFNoYWRvd1Jvb3QKKyAgICAgICAgYXMgI3NoYWRvdy1yb290 IGhlcmUuCisKIDIwMTItMTItMTcgIENocmlzIEZsZWl6YWNoICA8Y2ZsZWl6YWNoQGFwcGxlLmNv bT4KIAogICAgICAgICBTZWFtbGVzcyBpZnJhbWUgc2hvdWxkIG5vdCBhbm5vdW5jZSBhIG5ldyBi cm93c2luZyBjb250ZXh0CmRpZmYgLS1naXQgYS9Tb3VyY2UvV2ViQ29yZS9pbnNwZWN0b3IvSW5z cGVjdG9yRE9NQWdlbnQuY3BwIGIvU291cmNlL1dlYkNvcmUvaW5zcGVjdG9yL0luc3BlY3RvckRP TUFnZW50LmNwcAppbmRleCAxNjFiNzJiNmY5MGRiNzI3Y2YxNDA3YjY4MTdlNTdkYmI2NmE5ZWRj Li43ODBlZDNhNzNhNWU2OTEzN2RhMTU0NWI0N2U5MDlhMDE4YWY5ZDQ0IDEwMDY0NAotLS0gYS9T b3VyY2UvV2ViQ29yZS9pbnNwZWN0b3IvSW5zcGVjdG9yRE9NQWdlbnQuY3BwCisrKyBiL1NvdXJj ZS9XZWJDb3JlL2luc3BlY3Rvci9JbnNwZWN0b3JET01BZ2VudC5jcHAKQEAgLTEyNTEsNiArMTI1 MSwxNSBAQCBQYXNzUmVmUHRyPFR5cGVCdWlsZGVyOjpET006Ok5vZGU+IEluc3BlY3RvckRPTUFn ZW50OjpidWlsZE9iamVjdEZvck5vZGUoTm9kZSogbgogICAgICAgICBsb2NhbE5hbWUgPSBub2Rl LT5sb2NhbE5hbWUoKTsKICAgICAgICAgYnJlYWs7CiAgICAgY2FzZSBOb2RlOjpET0NVTUVOVF9G UkFHTUVOVF9OT0RFOgorICAgICAgICBpZiAobm9kZS0+aXNTaGFkb3dSb290KCkpIHsKKyAgICAg ICAgICAgIGlmICh0b1NoYWRvd1Jvb3Qobm9kZSktPnR5cGUoKSA9PSBTaGFkb3dSb290OjpVc2Vy QWdlbnRTaGFkb3dSb290KQorICAgICAgICAgICAgICAgIG5vZGVOYW1lID0gIiN3ZWJraXQtc2hh ZG93LXJvb3QiOworICAgICAgICAgICAgZWxzZQorICAgICAgICAgICAgICAgIG5vZGVOYW1lID0g IiNzaGFkb3ctcm9vdCI7CisgICAgICAgIH0gZWxzZQorICAgICAgICAgICAgbm9kZU5hbWUgPSBu b2RlLT5ub2RlTmFtZSgpOworICAgICAgICBsb2NhbE5hbWUgPSBub2RlLT5sb2NhbE5hbWUoKTsK KyAgICAgICAgYnJlYWs7CiAgICAgY2FzZSBOb2RlOjpET0NVTUVOVF9OT0RFOgogICAgIGNhc2Ug Tm9kZTo6RUxFTUVOVF9OT0RFOgogICAgIGRlZmF1bHQ6CmRpZmYgLS1naXQgYS9MYXlvdXRUZXN0 cy9DaGFuZ2VMb2cgYi9MYXlvdXRUZXN0cy9DaGFuZ2VMb2cKaW5kZXggMjI5ZTI4MGNlNzRmNzU5 NDhlNWZlOTAyMDY0ZmJhNTc1NDQ4YTMzMC4uNDA1NTNhMzNjMzYxMjJjZmIwZDM3MTAzZWFkYWQ0 ZjcxZThhODFmYSAxMDA2NDQKLS0tIGEvTGF5b3V0VGVzdHMvQ2hhbmdlTG9nCisrKyBiL0xheW91 dFRlc3RzL0NoYW5nZUxvZwpAQCAtMSwzICsxLDE0IEBACisyMDEyLTEyLTE3ICBTaGlueWEgS2F3 YW5ha2EgIDxzaGlueWFrQGNocm9taXVtLm9yZz4KKworICAgICAgICBXZWIgSW5zcGVjdG9yOiBu ZWVkIHRvIHZpc3VhbGx5IGRpc3Rpbmd1aXNoIFVBIHNoYWRvdyByb290cworICAgICAgICBodHRw czovL2J1Z3Mud2Via2l0Lm9yZy9zaG93X2J1Zy5jZ2k/aWQ9MTA0ODc3CisKKyAgICAgICAgUmV2 aWV3ZWQgYnkgTk9CT0RZIChPT1BTISkuCisKKyAgICAgICAgKiBpbnNwZWN0b3IvZWxlbWVudHMv c2hhZG93LWRvbS1tb2RpZnktY2hhcmRhdGEtZXhwZWN0ZWQudHh0OgorICAgICAgICAqIGluc3Bl Y3Rvci9lbGVtZW50cy9zaGFkb3ctcm9vdC1leHBlY3RlZC50eHQ6CisgICAgICAgICogaW5zcGVj dG9yL2VsZW1lbnRzL3NoYWRvdy1yb290Lmh0bWw6IEFkZHMgPGlucHV0PiB0ZXN0LgorCiAyMDEy LTEyLTE3ICBDaHJpcyBGbGVpemFjaCAgPGNmbGVpemFjaEBhcHBsZS5jb20+CiAKICAgICAgICAg U2VhbWxlc3MgaWZyYW1lIHNob3VsZCBub3QgYW5ub3VuY2UgYSBuZXcgYnJvd3NpbmcgY29udGV4 dApkaWZmIC0tZ2l0IGEvTGF5b3V0VGVzdHMvaW5zcGVjdG9yL2VsZW1lbnRzL3NoYWRvdy1kb20t bW9kaWZ5LWNoYXJkYXRhLWV4cGVjdGVkLnR4dCBiL0xheW91dFRlc3RzL2luc3BlY3Rvci9lbGVt ZW50cy9zaGFkb3ctZG9tLW1vZGlmeS1jaGFyZGF0YS1leHBlY3RlZC50eHQKaW5kZXggMDgwZmRk MzcyZGRjMGQ2OWEyMjI5ZGUxYjA4MTdhYmM1YzllODU5OS4uMDg4ZmI3NGIxZTE2MDFmMDc2N2Y5 ZTAxYWVhODI5YjU1ZTJiZjdkZCAxMDA2NDQKLS0tIGEvTGF5b3V0VGVzdHMvaW5zcGVjdG9yL2Vs ZW1lbnRzL3NoYWRvdy1kb20tbW9kaWZ5LWNoYXJkYXRhLWV4cGVjdGVkLnR4dAorKysgYi9MYXlv dXRUZXN0cy9pbnNwZWN0b3IvZWxlbWVudHMvc2hhZG93LWRvbS1tb2RpZnktY2hhcmRhdGEtZXhw ZWN0ZWQudHh0CkBAIC02LDcgKzYsNyBAQCBSdW5uaW5nOiB0ZXN0RHVtcEluaXRpYWwKID09PT09 PT09PSBPcmlnaW5hbCA9PT09PT09PQogLSA8ZGl2IGlkPSJjb250YWluZXIiPgogICAgIC0gPGlu cHV0IHR5cGU9InRleHQiIGlkPSJpbnB1dDEiPgotICAgICAgICAtICNzaGFkb3ctcm9vdAorICAg ICAgICAtICN3ZWJraXQtc2hhZG93LXJvb3QKICAgICAgICAgICA8ZGl2PjwvZGl2PgogICAgICAg PC9pbnB1dD4KICAgPC9kaXY+CkBAIC0xNSw3ICsxNSw3IEBAIFJ1bm5pbmc6IHRlc3RBcHBlbmQK ID09PT09PT09IFR5cGUgdGV4dCA9PT09PT09PT0KIC0gPGRpdiBpZD0iY29udGFpbmVyIj4KICAg ICAtIDxpbnB1dCB0eXBlPSJ0ZXh0IiBpZD0iaW5wdXQxIj4KLSAgICAgICAgLSAjc2hhZG93LXJv b3QKKyAgICAgICAgLSAjd2Via2l0LXNoYWRvdy1yb290CiAgICAgICAgICsgPGRpdj5CYXI8L2Rp dj4KICAgICAgIDwvaW5wdXQ+CiAgIDwvZGl2PgpkaWZmIC0tZ2l0IGEvTGF5b3V0VGVzdHMvaW5z cGVjdG9yL2VsZW1lbnRzL3NoYWRvdy1yb290LWV4cGVjdGVkLnR4dCBiL0xheW91dFRlc3RzL2lu c3BlY3Rvci9lbGVtZW50cy9zaGFkb3ctcm9vdC1leHBlY3RlZC50eHQKaW5kZXggZGY5MjYwZTli MzhhZjJlNDU3MjEyZDIyN2QwN2Y0YWM3YzBhOGYzNC4uYTI4YzE2YjM1NzllZDNiM2U4MGRjMWZk YzU4YWRmMWVhYzQyZDI1ZSAxMDA2NDQKLS0tIGEvTGF5b3V0VGVzdHMvaW5zcGVjdG9yL2VsZW1l bnRzL3NoYWRvdy1yb290LWV4cGVjdGVkLnR4dAorKysgYi9MYXlvdXRUZXN0cy9pbnNwZWN0b3Iv ZWxlbWVudHMvc2hhZG93LXJvb3QtZXhwZWN0ZWQudHh0CkBAIC0xLDUgKzEsNiBAQAogVGhpcyB0 ZXN0IHZlcmlmaWVkICNzaGFkb3ctcm9vdCBpcyBkaXNwbGF5ZWQgd2hlbiBzaG93U2hhZG93Um9v dCBpcyBlbmFibGVkLgogCisKIC0gPGRpdiBpZD0iY29udGFpbmVyIj4KICAgICAtIDxkaXYgaWQ9 InRlc3QxIj4KICAgICAgICAgICAjc2hhZG93LXJvb3QKQEAgLTEzLDUgKzE0LDkgQEAgVGhpcyB0 ZXN0IHZlcmlmaWVkICNzaGFkb3ctcm9vdCBpcyBkaXNwbGF5ZWQgd2hlbiBzaG93U2hhZG93Um9v dCBpcyBlbmFibGVkLgogICAgICAgICAgICJ3aXRoICIKICAgICAgICAgICA8c3Bhbj5lbGVtZW50 czwvc3Bhbj4KICAgICAgIDwvZGl2PgorICAgIC0gPGlucHV0IGlkPSJpbnB1dCIgdHlwZT0idGV4 dCI+CisgICAgICAgIC0gI3dlYmtpdC1zaGFkb3ctcm9vdAorICAgICAgICAgIDxkaXY+PC9kaXY+ CisgICAgICA8L2lucHV0PgogICA8L2Rpdj4KIApkaWZmIC0tZ2l0IGEvTGF5b3V0VGVzdHMvaW5z cGVjdG9yL2VsZW1lbnRzL3NoYWRvdy1yb290Lmh0bWwgYi9MYXlvdXRUZXN0cy9pbnNwZWN0b3Iv ZWxlbWVudHMvc2hhZG93LXJvb3QuaHRtbAppbmRleCA1YTEyOTQ1YTliYWFkMzNjMzEzZGUzZDI2 MTBjMmQ1ZDk5N2RhNjBmLi5lYWIxMWZiOTg4M2I3MmNhMTZkYmQ2NWFiNzIxNzU4MmI3OGI0YTA4 IDEwMDY0NAotLS0gYS9MYXlvdXRUZXN0cy9pbnNwZWN0b3IvZWxlbWVudHMvc2hhZG93LXJvb3Qu aHRtbAorKysgYi9MYXlvdXRUZXN0cy9pbnNwZWN0b3IvZWxlbWVudHMvc2hhZG93LXJvb3QuaHRt bApAQCAtMjksNiArMjksNyBAQCBmdW5jdGlvbiB0ZXN0KCkKICAgICA8ZGl2IGlkPSJ0ZXN0MSI+ PC9kaXY+CiAgICAgPGRpdiBpZD0idGVzdDIiPm9ubHkgdGVzdDwvZGl2PgogICAgIDxkaXYgaWQ9 InRlc3QzIj53aXRoIDxzcGFuPmVsZW1lbnRzPC9zcGFuPjwvZGl2PgorICAgIDxpbnB1dCBpZD0i aW5wdXQiIHR5cGU9InRleHQiIC8+CiA8L2Rpdj4KIAogPHNjcmlwdD4K