Changeset 202634 in webkit


Ignore:
Timestamp:
Jun 29, 2016 11:36:29 AM (8 years ago)
Author:
commit-queue@webkit.org
Message:

Web Inspector: Show Shadow Root type in DOM Tree
​https://bugs.webkit.org/show_bug.cgi?id=159236
<rdar://problem/27068521>

Patch by Joseph Pecoraro <Joseph Pecoraro> on 2016-06-29
Reviewed by Timothy Hatcher.

Source/JavaScriptCore:

  • inspector/protocol/DOM.json:

Include optional shadowRootType property for DOMNodes.

Source/WebCore:

Test: inspector/dom/shadowRootType.html

  • inspector/InspectorDOMAgent.cpp:

(WebCore::shadowRootType):
(WebCore::InspectorDOMAgent::buildObjectForNode):
Set the shadowRootType property when a node is a ShadowRoot.

Source/WebInspectorUI:

  • Localizations/en.lproj/localizedStrings.js:

"Shadow Content (type)" string.

  • UserInterface/Models/DOMNode.js:

(WebInspector.DOMNode):
(WebInspector.DOMNode.prototype.shadowRoots):
(WebInspector.DOMNode.prototype.shadowRootType):
Initialize state and add accessors.

  • UserInterface/Views/DOMTreeElement.js:

(WebInspector.DOMTreeElement.shadowRootTypeDisplayName):
(WebInspector.DOMTreeElement.prototype._nodeTitleInfo):
Better string when an element is a Shadow Root.

  • UserInterface/Views/DOMTreeElementPathComponent.js:

(WebInspector.DOMTreeElementPathComponent):
Better to check the Shadow Root type.

  • UserInterface/Views/DOMTreeOutline.css:

(.tree-outline.dom .html-fragment.shadow):
Opacity looks poor when there is a selection. Switch to gray.

LayoutTests:

  • inspector/dom/shadowRootType-expected.txt: Added.
  • inspector/dom/shadowRootType.html: Added.
Location:
trunk
Files:
2 added
11 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r202631 r202634  
     12016-06-29  Joseph Pecoraro  <pecoraro@apple.com>
     2
     3        Web Inspector: Show Shadow Root type in DOM Tree
     4        https://bugs.webkit.org/show_bug.cgi?id=159236
     5        <rdar://problem/27068521>
     6
     7        Reviewed by Timothy Hatcher.
     8
     9        * inspector/dom/shadowRootType-expected.txt: Added.
     10        * inspector/dom/shadowRootType.html: Added.
     11
    1122016-06-29  Benjamin Poulain  <bpoulain@apple.com>
    213

  • trunk/Source/JavaScriptCore/ChangeLog

    r202633 r202634  
     12016-06-29  Joseph Pecoraro  <pecoraro@apple.com>
     2
     3        Web Inspector: Show Shadow Root type in DOM Tree
     4        https://bugs.webkit.org/show_bug.cgi?id=159236
     5        <rdar://problem/27068521>
     6
     7        Reviewed by Timothy Hatcher.
     8
     9        * inspector/protocol/DOM.json:
     10        Include optional shadowRootType property for DOMNodes.
     11
    1122016-06-29  Commit Queue  <commit-queue@webkit.org>
    213

  • trunk/Source/JavaScriptCore/inspector/protocol/DOM.json

    r198178 r202634  
    1919            "enum": ["before", "after"],
    2020            "description": "Pseudo element type."
     21        },
     22        {
     23            "id": "ShadowRootType",
     24            "type": "string",
     25            "enum": ["user-agent", "open", "closed"],
     26            "description": "Shadow root type."
    2127        },
    2228        {
    … …  
    4753                { "name": "value", "type": "string", "optional": true, "description": "<code>Attr</code>'s value." },
    4854                { "name": "pseudoType", "$ref": "PseudoType", "optional": true, "description": "Pseudo element type for this node." },
     55                { "name": "shadowRootType", "$ref": "ShadowRootType", "optional": true, "description": "Shadow root type." },
    4956                { "name": "frameId", "$ref": "Network.FrameId", "optional": true, "description": "Frame ID for frame owner elements." },
    5057                { "name": "contentDocument", "$ref": "Node", "optional": true, "description": "Content document for frame owner elements." },

  • trunk/Source/WebCore/ChangeLog

    r202629 r202634  
     12016-06-29  Joseph Pecoraro  <pecoraro@apple.com>
     2
     3        Web Inspector: Show Shadow Root type in DOM Tree
     4        https://bugs.webkit.org/show_bug.cgi?id=159236
     5        <rdar://problem/27068521>
     6
     7        Reviewed by Timothy Hatcher.
     8
     9        Test: inspector/dom/shadowRootType.html
     10
     11        * inspector/InspectorDOMAgent.cpp:
     12        (WebCore::shadowRootType):
     13        (WebCore::InspectorDOMAgent::buildObjectForNode):
     14        Set the shadowRootType property when a node is a ShadowRoot.
     15
    1162016-06-29  Jeremy Jones  <jeremyj@apple.com>
    217

  • trunk/Source/WebCore/inspector/InspectorDOMAgent.cpp

    r202242 r202634  
    12811281}
    12821282
     1283static Inspector::Protocol::DOM::ShadowRootType shadowRootType(ShadowRoot::Type type)
     1284{
     1285    switch (type) {
     1286    case ShadowRoot::Type::UserAgent:
     1287        return Inspector::Protocol::DOM::ShadowRootType::UserAgent;
     1288    case ShadowRoot::Type::Closed:
     1289        return Inspector::Protocol::DOM::ShadowRootType::Closed;
     1290    case ShadowRoot::Type::Open:
     1291        return Inspector::Protocol::DOM::ShadowRootType::Open;
     1292    }
     1293
     1294    ASSERT_NOT_REACHED();
     1295    return Inspector::Protocol::DOM::ShadowRootType::UserAgent;
     1296}
     1297
    12831298static String computeContentSecurityPolicySHA256Hash(const Element& element)
    12841299{
    … …  
    13921407        value->setName(attribute.name());
    13931408        value->setValue(attribute.value());
     1409    } else if (is<ShadowRoot>(*node)) {
     1410        ShadowRoot& shadowRoot = downcast<ShadowRoot>(*node);
     1411        value->setShadowRootType(shadowRootType(shadowRoot.type()));
    13941412    }
    13951413

  • trunk/Source/WebInspectorUI/ChangeLog

    r202589 r202634  
     12016-06-29  Joseph Pecoraro  <pecoraro@apple.com>
     2
     3        Web Inspector: Show Shadow Root type in DOM Tree
     4        https://bugs.webkit.org/show_bug.cgi?id=159236
     5        <rdar://problem/27068521>
     6
     7        Reviewed by Timothy Hatcher.
     8
     9        * Localizations/en.lproj/localizedStrings.js:
     10        "Shadow Content (type)" string.
     11
     12        * UserInterface/Models/DOMNode.js:
     13        (WebInspector.DOMNode):
     14        (WebInspector.DOMNode.prototype.shadowRoots):
     15        (WebInspector.DOMNode.prototype.shadowRootType):
     16        Initialize state and add accessors.
     17
     18        * UserInterface/Views/DOMTreeElement.js:
     19        (WebInspector.DOMTreeElement.shadowRootTypeDisplayName):
     20        (WebInspector.DOMTreeElement.prototype._nodeTitleInfo):
     21        Better string when an element is a Shadow Root.
     22
     23        * UserInterface/Views/DOMTreeElementPathComponent.js:
     24        (WebInspector.DOMTreeElementPathComponent):
     25        Better to check the Shadow Root type.
     26
     27        * UserInterface/Views/DOMTreeOutline.css:
     28        (.tree-outline.dom .html-fragment.shadow):
     29        Opacity looks poor when there is a selection. Switch to gray.
     30
    1312016-06-28  Nikita Vasilyev  <nvasilyev@apple.com>
    232

  • trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js

    r202253 r202634  
    160160localizedStrings["Close Tab"] = "Close Tab";
    161161localizedStrings["Close resource view"] = "Close resource view";
     162localizedStrings["Closed"] = "Closed";
    162163localizedStrings["Closure Variables"] = "Closure Variables";
    163164localizedStrings["Closure Variables (%s)"] = "Closure Variables (%s)";
    … …  
    498499localizedStrings["Only show resources with issues"] = "Only show resources with issues";
    499500localizedStrings["Opacity"] = "Opacity";
     501localizedStrings["Open"] = "Open";
    500502localizedStrings["Option-click to show all units"] = "Option-click to show all units";
    501503localizedStrings["Option-click to show all values"] = "Option-click to show all values";
    … …  
    622624localizedStrings["Shadow"] = "Shadow";
    623625localizedStrings["Shadow Content"] = "Shadow Content";
     626localizedStrings["Shadow Content (%s)"] = "Shadow Content (%s)";
    624627localizedStrings["Shared Focus"] = "Shared Focus";
    625628localizedStrings["Shortest property path to %s"] = "Shortest property path to %s";
    … …  
    734737localizedStrings["Unknown node"] = "Unknown node";
    735738localizedStrings["Untitled"] = "Untitled";
     739localizedStrings["User Agent"] = "User Agent";
    736740localizedStrings["User Agent Stylesheet"] = "User Agent Stylesheet";
    737741localizedStrings["User Stylesheet"] = "User Stylesheet";

  • trunk/Source/WebInspectorUI/UserInterface/Models/DOMNode.js

    r201965 r202634  
    4848        this._nodeValue = payload.nodeValue;
    4949        this._pseudoType = payload.pseudoType;
     50        this._shadowRootType = payload.shadowRootType;
    5051        this._computedRole = payload.role;
    5152        this._contentSecurityPolicyHash = payload.contentSecurityPolicyHash;
    … …  
    317318    {
    318319        return this._pseudoElements.get(WebInspector.DOMNode.PseudoElementType.After) || null;
     320    }
     321
     322    shadowRoots()
     323    {
     324        return this._shadowRoots;
     325    }
     326
     327    shadowRootType()
     328    {
     329        return this._shadowRootType;
    319330    }
    320331
    … …  
    679690    After: "after",
    680691};
     692
     693WebInspector.DOMNode.ShadowRootType = {
     694    UserAgent: "user-agent",
     695    Closed: "closed",
     696    Open: "open",
     697};

  • trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js

    r201965 r202634  
    4949    }
    5050
     51    // Static
     52
     53    static shadowRootTypeDisplayName(type)
     54    {
     55        switch (type) {
     56        case WebInspector.DOMNode.ShadowRootType.UserAgent:
     57            return WebInspector.UIString("User Agent");
     58        case WebInspector.DOMNode.ShadowRootType.Open:
     59            return WebInspector.UIString("Open");
     60        case WebInspector.DOMNode.ShadowRootType.Closed:
     61            return WebInspector.UIString("Closed");
     62        }
     63    }
     64
     65    // Public
     66
    5167    isCloseTag()
    5268    {
    … …  
    11961212            case Node.DOCUMENT_FRAGMENT_NODE:
    11971213                var fragmentElement = info.titleDOM.createChild("span", "html-fragment");
    1198                 if (node.isInShadowTree()) {
    1199                     fragmentElement.textContent = WebInspector.UIString("Shadow Content");
     1214                if (node.shadowRootType()) {
     1215                    fragmentElement.textContent = WebInspector.UIString("Shadow Content (%s)").format(WebInspector.DOMTreeElement.shadowRootTypeDisplayName(node.shadowRootType()));
    12001216                    fragmentElement.classList.add("shadow");
    12011217                } else if (node.parentNode && node.parentNode.templateContent() === node)

  • trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElementPathComponent.js

    r187496 r202634  
    7373            // <rdar://problem/12800950> Need icon for DOCUMENT_FRAGMENT_NODE and PROCESSING_INSTRUCTION_NODE
    7474            className = WebInspector.DOMTreeElementPathComponent.DOMDocumentTypeIconStyleClassName;
    75             if (node.isInShadowTree())
     75            if (node.shadowRootType())
    7676                title = WebInspector.UIString("Shadow Content");
    7777            else

  • trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css

    r201840 r202634  
    188188
    189189.tree-outline.dom .html-fragment.shadow {
    190     opacity: 0.6;
     190    color: gray;
    191191}
    192192
Note: See TracChangeset for help on using the changeset viewer.