DevTools: Inspect element mode does not select element in ShadowDOM

Source/devtools/front_end/ElementsPanel.js

 /*
  * Copyright (C) 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2008 Matt Lilek <webkit@mattlilek.com>
  * Copyright (C) 2009 Joseph Pecoraro
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
@@ skipping 89 matching lines @@
     this._dockSideChanged();
 
     this._popoverHelper = new WebInspector.PopoverHelper(this.element, this._getPopoverAnchor.bind(this), this._showPopover.bind(this));
     this._popoverHelper.setTimeout(0);
 
     WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.AttrModified, this._updateBreadcrumbIfNeeded, this);
     WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.AttrRemoved, this._updateBreadcrumbIfNeeded, this);
     WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.NodeRemoved, this._nodeRemoved, this);
     WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.DocumentUpdated, this._documentUpdatedEvent, this);
     WebInspector.domAgent.addEventListener(WebInspector.DOMAgent.Events.InspectElementRequested, this._inspectElementRequested, this);
+    WebInspector.settings.showShadowDOM.addChangeListener(this._showShadowDOMChanged.bind(this));
 
     if (WebInspector.domAgent.existingDocument())
         this._documentUpdated(WebInspector.domAgent.existingDocument());
 }
 
 WebInspector.ElementsPanel.prototype = {
     get statusBarItems()
     {
         return [this.crumbsElement];
     },
@@ skipping 938 matching lines @@
     },
 
     revealAndSelectNode: function(nodeId)
     {
         WebInspector.inspectorView.setCurrentPanel(this);
 
         var node = WebInspector.domAgent.nodeForId(nodeId);
         if (!node)
             return;
 
+        while (!WebInspector.settings.showShadowDOM.get() && node && node.isInShadowTree())
+            node = node.parentNode;
+
         WebInspector.domAgent.highlightDOMNodeForTwoSeconds(nodeId);
         this.selectDOMNode(node, true);
     },
 
     /** 
      * @param {WebInspector.ContextMenu} contextMenu
      * @param {Object} target
      */
     appendApplicableItems: function(event, contextMenu, target)
     {
@@ skipping 23 matching lines @@
         contextMenu.show();
     },
 
     _dockSideChanged: function()
     {
         var dockSide = WebInspector.dockController.dockSide();
         var vertically = dockSide === WebInspector.DockController.State.DockedToRight && WebInspector.settings.splitVerticallyWhenDockedToRight.get();
         this._splitVertically(vertically);
     },
 
+    _showShadowDOMChanged: function()
+    {
+        this.treeOutline.update();
+    },
+
     /**
      * @param {boolean} vertically
      */
     _splitVertically: function(vertically)
     {
         if (this.sidebarPaneView && vertically === !this.splitView.isVertical())
             return;
 
         if (this.sidebarPaneView)
             this.sidebarPaneView.detach();
@@ skipping 41 matching lines @@
      * @param {WebInspector.SidebarPane} pane
      */
     addExtensionSidebarPane: function(id, pane)
     {
         this.sidebarPanes[id] = pane;
         this.sidebarPaneView.addPane(pane);
     },
 
     __proto__: WebInspector.Panel.prototype
 }