squash 'resources/unpacked/devtools' changes from 07e3483..b289bdc

b289bdc DevTools: all ToolbarInputs should have clear button
7fcee9d DevTools: move tests (part 11)
d5467a1 [DevTools] Mark targets as 'page' by default in ChromeDevToolsManagerDelegate
cb106ac DevTools: sort service workers in the applications panel.
e92f24e [Devtools] Minor fixes for accessibility 'tree'
f148685 [Devtools] Style fixes for contrast line
4592d46 [Devtools] Maintain selection when selecting accessibility tree nodes which aren't represented in Elements tree
a1b02a9 DevTools: move http/tests/inspector/network/* tests (part 10)
f368889 [DevTools] Check valid origin before tracking for Cache Storage live update

git-subtree-dir: resources/unpacked/devtools
git-subtree-split: b289bdc

Author: darwin

front_end/Tests.js

@@ -905,6 +905,20 @@
     }
   };
 
+  TestSuite.prototype.testCreateTargetType = function() {
+    var test = this;
+    test.takeControl();
+
+    var target = SDK.targetManager.mainTarget();
+    target.registerTargetDispatcher({
+      targetCreated: function(targetInfo) {
+        test.assertEquals('page', targetInfo.type);
+        test.releaseControl();
+      }
+    });
+    target.targetAgent().createTarget('about:blank');
+  };
+
   TestSuite.prototype.testWindowInitializedOnNavigateBack = function() {
     var messages = ConsoleModel.consoleModel.messages();
     this.assertEquals(1, messages.length);

front_end/accessibility/AXBreadcrumbsPane.js

@@ -16,6 +16,8 @@ Accessibility.AXBreadcrumbsPane = class extends Accessibility.AccessibilitySubPa
 
     /** @type {?Accessibility.AXBreadcrumb} */
     this._preselectedBreadcrumb = null;
+    /** @type {?Accessibility.AXBreadcrumb} */
+    this._inspectedNodeBreadcrumb = null;
 
     this._selectedByUser = true;
 
@@ -27,6 +29,7 @@ Accessibility.AXBreadcrumbsPane = class extends Accessibility.AccessibilitySubPa
     this._rootElement.addEventListener('mouseleave', this._onMouseLeave.bind(this), false);
     this._rootElement.addEventListener('click', this._onClick.bind(this), false);
     this._rootElement.addEventListener('contextmenu', this._contextMenuEventFired.bind(this), false);
+    this._rootElement.addEventListener('focusout', this._onFocusOut.bind(this), false);
     this.registerRequiredCSS('accessibility/axBreadcrumbs.css');
   }
 
@@ -65,14 +68,14 @@ Accessibility.AXBreadcrumbsPane = class extends Accessibility.AccessibilitySubPa
       depth++;
     }
 
-    var inspectedNodeBreadcrumb = breadcrumb;
-    inspectedNodeBreadcrumb.setPreselected(true, this._selectedByUser);
+    this._inspectedNodeBreadcrumb = breadcrumb;
+    this._inspectedNodeBreadcrumb.setPreselected(true, this._selectedByUser);
 
-    this._setPreselectedBreadcrumb(inspectedNodeBreadcrumb);
+    this._setPreselectedBreadcrumb(this._inspectedNodeBreadcrumb);
 
     for (var child of axNode.children()) {
       var childBreadcrumb = new Accessibility.AXBreadcrumb(child, depth, false);
-      inspectedNodeBreadcrumb.appendChild(childBreadcrumb);
+      this._inspectedNodeBreadcrumb.appendChild(childBreadcrumb);
     }
 
     this._selectedByUser = false;
@@ -147,10 +150,12 @@ Accessibility.AXBreadcrumbsPane = class extends Accessibility.AccessibilitySubPa
       return;
     if (this._preselectedBreadcrumb)
       this._preselectedBreadcrumb.setPreselected(false, this._selectedByUser);
-    this._preselectedBreadcrumb = breadcrumb;
-    if (this._preselectedBreadcrumb)
-      this._preselectedBreadcrumb.setPreselected(true, this._selectedByUser);
-    else if (this._selectedByUser)
+    if (breadcrumb)
+      this._preselectedBreadcrumb = breadcrumb;
+    else
+      this._preselectedBreadcrumb = this._inspectedNodeBreadcrumb;
+    this._preselectedBreadcrumb.setPreselected(true, this._selectedByUser);
+    if (!breadcrumb && this._selectedByUser)
       SDK.OverlayModel.hideDOMNodeHighlight();
   }
 
@@ -171,11 +176,20 @@ Accessibility.AXBreadcrumbsPane = class extends Accessibility.AccessibilitySubPa
       return;
     }
     var breadcrumb = breadcrumbElement.breadcrumb;
-    if (breadcrumb.preselected() || breadcrumb.inspected() || !breadcrumb.isDOMNode())
+    if (!breadcrumb.isDOMNode())
       return;
     this._setHoveredBreadcrumb(breadcrumb);
   }
 
+  /**
+   * @param {!Event} event
+   */
+  _onFocusOut(event) {
+    if (!this._preselectedBreadcrumb || event.target !== this._preselectedBreadcrumb.nodeElement())
+      return;
+    this._setPreselectedBreadcrumb(null);
+  }
+
   /**
    * @param {!Event} event
    */
@@ -189,7 +203,7 @@ Accessibility.AXBreadcrumbsPane = class extends Accessibility.AccessibilitySubPa
     if (breadcrumb.inspected()) {
       // If the user is clicking the inspected breadcrumb, they probably want to
       // focus it.
-      breadcrumb.element().focus();
+      breadcrumb.nodeElement().focus();
       return;
     }
     if (!breadcrumb.isDOMNode())
@@ -228,15 +242,8 @@ Accessibility.AXBreadcrumbsPane = class extends Accessibility.AccessibilitySubPa
     this._selectedByUser = true;
 
     axNode.deferredDOMNode().resolve(domNode => {
-      var inspectedDOMNode = UI.context.flavor(SDK.DOMNode);
-      // Special case the root accessibility node: set the node for the
-      // accessibility panel, not the Elements tree, as it maps to the Document
-      // node which is not shown in the DOM panel, causing the first child to be
-      // inspected instead.
-      if (axNode.parentNode() && domNode !== inspectedDOMNode)
-        Common.Revealer.reveal(domNode, true /* omitFocus */);
-      else
-        this._axSidebarView.setNode(domNode);
+      this._axSidebarView.setNode(domNode, true /* fromAXTree */);
+      Common.Revealer.reveal(domNode, true /* omitFocus */);
     });
 
     return true;
@@ -246,7 +253,7 @@ Accessibility.AXBreadcrumbsPane = class extends Accessibility.AccessibilitySubPa
    * @param {!Event} event
    */
   _contextMenuEventFired(event) {
-    var breadcrumbElement = event.target.enclosingNodeOrSelfWithClass('ax-node');
+    var breadcrumbElement = event.target.enclosingNodeOrSelfWithClass('ax-breadcrumb');
     if (!breadcrumbElement)
       return;
 
@@ -279,10 +286,11 @@ Accessibility.AXBreadcrumb = class {
     this._axNode = axNode;
 
     this._element = createElementWithClass('div', 'ax-breadcrumb');
-    UI.ARIAUtils.markAsTreeitem(this._element);
     this._element.breadcrumb = this;
 
     this._nodeElement = createElementWithClass('div', 'ax-node');
+    UI.ARIAUtils.markAsTreeitem(this._nodeElement);
+    this._nodeElement.tabIndex = -1;
     this._element.appendChild(this._nodeElement);
     this._nodeWrapper = createElementWithClass('div', 'wrapper');
     this._nodeElement.appendChild(this._nodeWrapper);
@@ -329,14 +337,21 @@ Accessibility.AXBreadcrumb = class {
     return this._element;
   }
 
+  /**
+   * @return {!Element}
+   */
+  nodeElement() {
+    return this._nodeElement;
+  }
+
   /**
    * @param {!Accessibility.AXBreadcrumb} breadcrumb
    */
   appendChild(breadcrumb) {
     this._children.push(breadcrumb);
     breadcrumb.setParent(this);
     this._nodeElement.classList.add('parent');
-    UI.ARIAUtils.setExpanded(this._element, true);
+    UI.ARIAUtils.setExpanded(this._nodeElement, true);
     this._childrenGroupElement.appendChild(breadcrumb.element());
   }
 
@@ -366,7 +381,7 @@ Accessibility.AXBreadcrumb = class {
     if (preselected)
       this._nodeElement.setAttribute('tabIndex', 0);
     else
-      this._nodeElement.removeAttribute('tabIndex');
+      this._nodeElement.setAttribute('tabIndex', -1);
     if (this._preselected) {
       if (selectedByUser)
         this._nodeElement.focus();

front_end/accessibility/AccessibilitySidebarView.js

@@ -9,6 +9,7 @@ Accessibility.AccessibilitySidebarView = class extends UI.ThrottledWidget {
     super();
     this._node = null;
     this._axNode = null;
+    this._skipNextPullNode = false;
     this._sidebarPaneStack = UI.viewManager.createStackLocation();
     this._breadcrumbsSubPane = new Accessibility.AXBreadcrumbsPane(this);
     this._sidebarPaneStack.showView(this._breadcrumbsSubPane);
@@ -37,8 +38,10 @@ Accessibility.AccessibilitySidebarView = class extends UI.ThrottledWidget {
 
   /**
    * @param {?SDK.DOMNode} node
+   * @param {boolean=} fromAXTree
    */
-  setNode(node) {
+  setNode(node, fromAXTree) {
+    this._skipNextPullNode = !!fromAXTree;
     this._node = node;
     this.update();
   }
@@ -72,6 +75,7 @@ Accessibility.AccessibilitySidebarView = class extends UI.ThrottledWidget {
     var node = this.node();
     this._axNodeSubPane.setNode(node);
     this._ariaSubPane.setNode(node);
+    this._breadcrumbsSubPane.setNode(node);
     if (!node)
       return Promise.resolve();
     var accessibilityModel = node.domModel().target().model(Accessibility.AccessibilityModel);
@@ -114,6 +118,10 @@ Accessibility.AccessibilitySidebarView = class extends UI.ThrottledWidget {
   }
 
   _pullNode() {
+    if (this._skipNextPullNode) {
+      this._skipNextPullNode = false;
+      return;
+    }
     this.setNode(UI.context.flavor(SDK.DOMNode));
   }
 

front_end/color_picker/spectrum.css

@@ -101,6 +101,7 @@
     background-color: rgba(255, 255, 255, 0.2);
     align-items: center;
     transition: right .05s ease-out, left .05s ease-out, bottom .05s ease-out, top .05s ease-out;
+    cursor: pointer;
 }
 
 .spectrum-contrast-info.contrast-unknown .value {
@@ -623,6 +624,10 @@ button.background-color-picker {
     top: 7px;
 }
 
-button.background-color-picker.active [is=ui-icon].largeicon-eyedropper.icon-mask{
+button.background-color-picker.active [is=ui-icon].largeicon-eyedropper.icon-mask {
     background-color: hsl(218, 81%, 59%);
 }
+
+button.background-color-picker:hover [is=ui-icon].largeicon-eyedropper.icon-mask {
+    background-color: #333;
+}

front_end/console/ConsoleView.js

@@ -1019,7 +1019,7 @@ Console.ConsoleViewFilter = class {
     this._filterByExecutionContextSetting.addChangeListener(this._filterChanged);
     this._filterByConsoleAPISetting.addChangeListener(this._filterChanged);
 
-    this._textFilterUI = new UI.ToolbarInput(Common.UIString('Filter'), 0.2, 1, true);
+    this._textFilterUI = new UI.ToolbarInput(Common.UIString('Filter'), 0.2, 1);
     this._textFilterUI.element.title = Common.UIString('e.g. /event\\d/ -cdn url:a.com');
     this._textFilterUI.addEventListener(UI.ToolbarInput.Event.TextChanged, this._textFilterChanged, this);
     this._filterParser = new TextUtils.FilterParser(Object.values(Console.ConsoleViewFilter._filterType));

front_end/coverage/CoverageView.js

@@ -35,7 +35,7 @@ Coverage.CoverageView = class extends UI.VBox {
     this._textFilterRegExp = null;
 
     toolbar.appendSeparator();
-    this._filterInput = new UI.ToolbarInput(Common.UIString('URL filter'), 0.4, 1, true);
+    this._filterInput = new UI.ToolbarInput(Common.UIString('URL filter'), 0.4, 1);
     this._filterInput.setEnabled(false);
     this._filterInput.addEventListener(UI.ToolbarInput.Event.TextChanged, this._onFilterChanged, this);
     toolbar.appendToolbarItem(this._filterInput);

front_end/network/ResourceWebSocketFrameView.js

@@ -73,7 +73,7 @@ Network.ResourceWebSocketFrameView = class extends UI.VBox {
     this._filterType = null;
 
     var placeholder = 'Enter regex, for example: (web)?socket';
-    this._filterTextInput = new UI.ToolbarInput(Common.UIString(placeholder), 0.4, undefined, true);
+    this._filterTextInput = new UI.ToolbarInput(Common.UIString(placeholder), 0.4);
     this._filterTextInput.addEventListener(UI.ToolbarInput.Event.TextChanged, this._updateFilterSetting, this);
     this._mainToolbar.appendToolbarItem(this._filterTextInput);
     this._filterRegex = null;

front_end/resources/ServiceWorkersView.js

@@ -83,9 +83,23 @@ Resources.ServiceWorkersView = class extends UI.VBox {
 
   _updateSectionVisibility() {
     var securityOrigins = new Set(this._securityOriginManager.securityOrigins());
+    var matchingSections = new Set();
     for (var section of this._sections.values()) {
-      var visible = this._showAllCheckbox.checked() || securityOrigins.has(section._registration.securityOrigin);
-      section._section.element.classList.toggle('hidden', !visible);
+      if (securityOrigins.has(section._registration.securityOrigin))
+        matchingSections.add(section._section);
+    }
+
+    this._reportView.sortSections((a, b) => {
+      var aMatching = matchingSections.has(a);
+      var bMatching = matchingSections.has(b);
+      if (aMatching === bMatching)
+        return a.title().localeCompare(b.title());
+      return aMatching ? -1 : 1;
+    });
+
+    for (var section of this._sections.values()) {
+      var sameOrigin = securityOrigins.has(section._registration.securityOrigin);
+      section._section.element.classList.toggle('hidden', !this._showAllCheckbox.checked() && !sameOrigin);
     }
   }
 
@@ -139,8 +153,10 @@ Resources.ServiceWorkersView = class extends UI.VBox {
   _updateRegistration(registration) {
     var section = this._sections.get(registration);
     if (!section) {
-      section =
-          new Resources.ServiceWorkersView.Section(this._manager, this._reportView.appendSection(''), registration);
+      section = new Resources.ServiceWorkersView.Section(
+          this._manager,
+          this._reportView.appendSection(Resources.ServiceWorkersView._displayScopeURL(registration.scopeURL)),
+          registration);
       this._sections.set(registration, section);
     }
     this._updateSectionVisibility();
@@ -161,9 +177,21 @@ Resources.ServiceWorkersView = class extends UI.VBox {
   _removeRegistrationFromList(registration) {
     var section = this._sections.get(registration);
     if (section)
-      section._section.remove();
+      section._section.detach();
     this._sections.delete(registration);
   }
+
+  /**
+   * @param {string} scopeURL
+   * @return {string}
+   */
+  static _displayScopeURL(scopeURL) {
+    var parsedURL = scopeURL.asParsedURL();
+    var path = parsedURL.path;
+    if (path.endsWith('/'))
+      path = path.substring(0, path.length - 1);
+    return parsedURL.host + path;
+  }
 };
 
 /**
@@ -244,8 +272,8 @@ Resources.ServiceWorkersView.Section = class {
     this._toolbar.setEnabled(!this._registration.isDeleted);
 
     var versions = this._registration.versionsByMode();
-    var title = this._registration.isDeleted ? Common.UIString('%s - deleted', this._registration.scopeURL) :
-                                               this._registration.scopeURL;
+    var scopeURL = Resources.ServiceWorkersView._displayScopeURL(this._registration.scopeURL);
+    var title = this._registration.isDeleted ? Common.UIString('%s - deleted', scopeURL) : scopeURL;
     this._section.setTitle(title);
 
     var active = versions.get(SDK.ServiceWorkerVersion.Modes.Active);

front_end/resources/StorageItemsView.js

@@ -19,7 +19,7 @@ Resources.StorageItemsView = class extends UI.VBox {
 
     this._mainToolbar = new UI.Toolbar('top-resources-toolbar', this.element);
 
-    this._filterItem = new UI.ToolbarInput(Common.UIString('Filter'), 0.4, undefined, true);
+    this._filterItem = new UI.ToolbarInput(Common.UIString('Filter'), 0.4);
     this._filterItem.addEventListener(UI.ToolbarInput.Event.TextChanged, this._filterChanged, this);
 
     var toolbarItems = [this._refreshButton, this._deleteAllButton, this._deleteSelectedButton, this._filterItem];

front_end/sdk/ServiceWorkerCacheModel.js

@@ -124,6 +124,9 @@ SDK.ServiceWorkerCacheModel = class extends SDK.SDKModel {
 
   _addOrigin(securityOrigin) {
     this._loadCacheNames(securityOrigin);
+    var parsedURL = securityOrigin.asParsedURL();
+    if (!parsedURL || !parsedURL.scheme.startsWith('http'))
+      return;
     this._storageAgent.trackCacheStorageForOrigin(securityOrigin);
   }
 
@@ -138,6 +141,9 @@ SDK.ServiceWorkerCacheModel = class extends SDK.SDKModel {
         this._cacheRemoved(cache);
       }
     }
+    var parsedURL = securityOrigin.asParsedURL();
+    if (!parsedURL || !parsedURL.scheme.startsWith('http'))
+      return;
     this._storageAgent.untrackCacheStorageForOrigin(securityOrigin);
   }