chrome-devtools-frontend 1.0.1025175 → 1.0.1026673

package/front_end/panels/elements/TopLayerContainer.ts

@@ -1,6 +1,7 @@
 // Copyright 2022 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
+import * as Common from '../../core/common/common.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import * as IconButton from '../../ui/components/icon_button/icon_button.js';
@@ -22,50 +23,71 @@ const str_ = i18n.i18n.registerUIStrings('panels/elements/TopLayerContainer.ts',
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 
 export class TopLayerContainer extends UI.TreeOutline.TreeElement {
-  treeOutline: ElementsTreeOutline.ElementsTreeOutline|null;
-  domModel: SDK.DOMModel.DOMModel;
+  domContainer: ElementsTreeOutline.ElementsTreeOutline;
   currentTopLayerElements: Set<ElementsTreeElement>;
-  bodyElement: ElementsTreeElement;
+  topLayerUpdateThrottler: Common.Throttler.Throttler;
+  #inserted = false;
 
-  constructor(bodyElement: ElementsTreeElement) {
+  constructor(domContainer: ElementsTreeOutline.ElementsTreeOutline) {
     super('#top-layer');
-    this.bodyElement = bodyElement;
-    this.domModel = bodyElement.node().domModel();
-    this.treeOutline = null;
+    this.domContainer = domContainer;
     this.currentTopLayerElements = new Set();
+    this.topLayerUpdateThrottler = new Common.Throttler.Throttler(1);
   }
 
-  updateBody(bodyElement: ElementsTreeElement): void {
-    this.bodyElement = bodyElement;
+  async throttledUpdateTopLayerElements(): Promise<void> {
+    await this.topLayerUpdateThrottler.schedule(() => this.updateTopLayerElements());
   }
 
-  async addTopLayerElementsAsChildren(): Promise<boolean> {
+  async updateTopLayerElements(): Promise<void> {
+    this.removeChildren();
     this.removeCurrentTopLayerElementsAdorners();
     this.currentTopLayerElements = new Set();
-    const newTopLayerElementsIDs = await this.domModel.getTopLayerElements();
-    if (newTopLayerElementsIDs === null) {
-      return false;
+
+    const domModel = this.domContainer.rootDOMNode?.domModel();
+    if (!domModel) {
+      this.hidden = true;
+      return;
+    }
+
+    const newTopLayerElementsIDs = await domModel.getTopLayerElements();
+    if (!newTopLayerElementsIDs || newTopLayerElementsIDs.length === 0) {
+      this.hidden = true;
+      return;
     }
+
     let topLayerElementIndex = 0;
-    if (newTopLayerElementsIDs) {
-      for (const elementID of newTopLayerElementsIDs) {
-        const topLayerDOMNode = this.domModel.idToDOMNode.get(elementID);
-        // Will need to add support for backdrop in the future.
-        if (topLayerDOMNode && topLayerDOMNode.nodeName() !== '::backdrop') {
-          topLayerElementIndex++;
-          const topLayerElementShortcut = new SDK.DOMModel.DOMNodeShortcut(
-              this.domModel.target(), topLayerDOMNode.backendNodeId(), 0, topLayerDOMNode.nodeName());
-          const topLayerTreeElement = this.treeOutline?.treeElementByNode.get(topLayerDOMNode);
-          const topLayerElementRepresentation = new ElementsTreeOutline.ShortcutTreeElement(topLayerElementShortcut);
-          if (topLayerTreeElement && !this.currentTopLayerElements.has(topLayerTreeElement)) {
-            this.appendChild(topLayerElementRepresentation);
-            this.addTopLayerAdorner(topLayerTreeElement, topLayerElementRepresentation, topLayerElementIndex);
-            this.currentTopLayerElements.add(topLayerTreeElement);
-          }
+    for (let i = 0; i < newTopLayerElementsIDs.length; i++) {
+      const topLayerDOMNode = domModel.idToDOMNode.get(newTopLayerElementsIDs[i]);
+      if (topLayerDOMNode && topLayerDOMNode.nodeName() !== '::backdrop') {
+        const topLayerElementShortcut = new SDK.DOMModel.DOMNodeShortcut(
+            domModel.target(), topLayerDOMNode.backendNodeId(), 0, topLayerDOMNode.nodeName());
+        const topLayerElementRepresentation = new ElementsTreeOutline.ShortcutTreeElement(topLayerElementShortcut);
+        const topLayerTreeElement = this.domContainer.treeElementByNode.get(topLayerDOMNode);
+        if (!topLayerTreeElement) {
+          continue;
+        }
+
+        topLayerElementIndex++;
+        this.addTopLayerAdorner(topLayerTreeElement, topLayerElementRepresentation, topLayerElementIndex);
+        this.currentTopLayerElements.add(topLayerTreeElement);
+        this.appendChild(topLayerElementRepresentation);
+        // Add the element's backdrop if previous top layer element is a backdrop.
+        const previousTopLayerDOMNode = (i > 0) ? domModel.idToDOMNode.get(newTopLayerElementsIDs[i - 1]) : undefined;
+        if (previousTopLayerDOMNode && previousTopLayerDOMNode.nodeName() === '::backdrop') {
+          const backdropElementShortcut = new SDK.DOMModel.DOMNodeShortcut(
+              domModel.target(), previousTopLayerDOMNode.backendNodeId(), 0, previousTopLayerDOMNode.nodeName());
+          const backdropElementRepresentation = new ElementsTreeOutline.ShortcutTreeElement(backdropElementShortcut);
+          topLayerElementRepresentation.appendChild(backdropElementRepresentation);
         }
       }
     }
-    return topLayerElementIndex > 0;
+
+    this.hidden = topLayerElementIndex <= 0;
+    if (!this.hidden && !this.#inserted) {
+      this.domContainer.appendChild(this);
+      this.#inserted = true;
+    }
   }
 
   private removeCurrentTopLayerElementsAdorners(): void {

package/front_end/panels/elements/elementsTreeOutline.css

@@ -28,7 +28,7 @@
 }
 
 .adorner-reveal {
-  margin: 3px;
+  margin: 0 3px;
 }
 
 .adorner-with-icon {

package/front_end/panels/lighthouse/LighthouseController.ts

@@ -309,6 +309,9 @@ export class LighthouseController extends Common.ObjectWrapper.ObjectWrapper<Eve
       return '';
     }
     const usageData = await mainTarget.storageAgent().invoke_getUsageAndQuota({origin});
+    if (usageData.getError()) {
+      return '';
+    }
     const locations = usageData.usageBreakdown.filter(usage => usage.usage)
                           .map(usage => STORAGE_TYPE_NAMES.get(usage.storageType))
                           .map(i18nStringFn => i18nStringFn ? i18nStringFn() : undefined)

package/front_end/panels/network/NetworkDataGridNode.ts

@@ -1043,8 +1043,7 @@ export class NetworkRequestNode extends NetworkNode {
         const secondIconElement = document.createElement('img');
         secondIconElement.classList.add('icon');
         secondIconElement.alt = i18nString(UIStrings.webBundleInnerRequest);
-        secondIconElement.src = 'Images/ic_file_webbundle_inner_request.svg';
-        new URL('../../Images/ic_file_webbundle_inner_request.svg', import.meta.url).toString();
+        secondIconElement.src = new URL('../../Images/ic_file_webbundle_inner_request.svg', import.meta.url).toString();
 
         const networkManager = SDK.NetworkManager.NetworkManager.forRequest(this.requestInternal);
         if (webBundleInnerRequestInfo.bundleRequestId && networkManager) {

package/front_end/panels/profiler/ProfilesPanel.ts

@@ -679,6 +679,7 @@ export class JSProfilerPanel extends ProfilesPanel implements UI.ActionRegistrat
   constructor() {
     const registry = instance;
     super('js_profiler', [registry.cpuProfileType], 'profiler.js-toggle-recording');
+    this.splitWidget().mainWidget()?.setMinimumSize(350, 0);
   }
 
   static instance(opts: {

package/front_end/panels/security/SecurityPanel.ts

@@ -329,6 +329,16 @@ const UIStrings = {
   */
   cipher: 'Cipher',
   /**
+  *@description Text in Security Panel that refers to the signature algorithm
+  *used by the server for authenticate in the TLS handshake.
+  */
+  serverSignature: 'Server signature',
+  /**
+  *@description Text in Security Panel that refers to whether the ClientHello
+  *message in the TLS handshake was encrypted.
+  */
+  encryptedClientHello: 'Encrypted ClientHello',
+  /**
   *@description Sct div text content in Security Panel of the Security panel
   */
   certificateTransparency: 'Certificate Transparency',
@@ -442,12 +452,42 @@ const UIStrings = {
   *@example {2} PH1
   */
   showMoreSTotal: 'Show more ({PH1} total)',
+  /**
+  *@description Shown when a field refers to an option that is unknown to the frontend.
+  */
+  unknownField: 'unknown',
+  /**
+  *@description Shown when a field refers to a TLS feature which was enabled.
+  */
+  enabled: 'enabled',
 };
 const str_ = i18n.i18n.registerUIStrings('panels/security/SecurityPanel.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 
 let securityPanelInstance: SecurityPanel;
 
+// See https://www.iana.org/assignments/tls-parameters/tls-parameters.xhtml#tls-signaturescheme
+// This contains signature schemes supported by Chrome.
+const SignatureSchemeStrings = new Map([
+  // The full name for these schemes is RSASSA-PKCS1-v1_5, sometimes
+  // "PKCS#1 v1.5", but those are very long, so let "RSA" vs "RSA-PSS"
+  // disambiguate.
+  [0x0201, 'RSA with SHA-1'],
+  [0x0401, 'RSA with SHA-256'],
+  [0x0501, 'RSA with SHA-384'],
+  [0x0601, 'RSA with SHA-512'],
+
+  // We omit the curve from these names because in TLS 1.2 these code points
+  // were not specific to a curve. Saying "P-256" for a server that used a P-384
+  // key with SHA-256 in TLS 1.2 would be confusing.
+  [0x0403, 'ECDSA with SHA-256'],
+  [0x0503, 'ECDSA with SHA-384'],
+
+  [0x0804, 'RSA-PSS with SHA-256'],
+  [0x0805, 'RSA-PSS with SHA-384'],
+  [0x0806, 'RSA-PSS with SHA-512'],
+]);
+
 export class SecurityPanel extends UI.Panel.PanelWithSidebar implements
     SDK.TargetManager.SDKModelObserver<SecurityModel> {
   private readonly mainView: SecurityMainView;
@@ -1466,11 +1506,23 @@ export class SecurityOriginView extends UI.Widget.VBox {
         table.addRow(i18nString(UIStrings.keyExchange), originState.securityDetails.keyExchangeGroup);
       }
 
+      if (originState.securityDetails.serverSignatureAlgorithm) {
+        // See https://www.iana.org/assignments/tls-parameters/tls-parameters.xhtml#tls-signaturescheme
+        let sigString = SignatureSchemeStrings.get(originState.securityDetails.serverSignatureAlgorithm);
+        sigString ??=
+            i18nString(UIStrings.unknownField) + ' (' + originState.securityDetails.serverSignatureAlgorithm + ')';
+        table.addRow(i18nString(UIStrings.serverSignature), sigString);
+      }
+
       table.addRow(
           i18nString(UIStrings.cipher),
           originState.securityDetails.cipher +
               (originState.securityDetails.mac ? ' with ' + originState.securityDetails.mac : ''));
 
+      if (originState.securityDetails.encryptedClientHello) {
+        table.addRow(i18nString(UIStrings.encryptedClientHello), i18nString(UIStrings.enabled));
+      }
+
       // Create the certificate section outside the callback, so that it appears in the right place.
       const certificateSection = this.element.createChild('div', 'origin-view-section');
       const certificateDiv = certificateSection.createChild('div', 'origin-view-section-title');

package/front_end/panels/security/originView.css

@@ -79,7 +79,7 @@
 
 .security-origin-view .details-table-row > td:first-child {
   color: var(--color-text-secondary);
-  width: calc(110px + 1em);
+  width: calc(120px + 1em);
   text-align: right;
   padding-right: 1em;
 }

package/front_end/panels/sources/CallStackSidebarPane.ts

@@ -34,6 +34,7 @@ import * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import * as Bindings from '../../models/bindings/bindings.js';
 import * as Persistence from '../../models/persistence/persistence.js';
+import * as SourceMapScopes from '../../models/source_map_scopes/source_map_scopes.js';
 import * as Workspace from '../../models/workspace/workspace.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
@@ -106,6 +107,7 @@ let callstackSidebarPaneInstance: CallStackSidebarPane;
 export class CallStackSidebarPane extends UI.View.SimpleView implements UI.ContextFlavorListener.ContextFlavorListener,
                                                                         UI.ListControl.ListDelegate<Item> {
   private readonly ignoreListMessageElement: Element;
+  private readonly ignoreListCheckboxElement: HTMLInputElement;
   private readonly notPausedMessageElement: HTMLElement;
   private readonly callFrameWarningsElement: HTMLElement;
   private readonly items: UI.ListModel.ListModel<Item>;
@@ -118,18 +120,20 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
   private readonly updateItemThrottler: Common.Throttler.Throttler;
   private readonly scheduledForUpdateItems: Set<Item>;
   private muteActivateItem?: boolean;
+  private lastDebuggerModel: SDK.DebuggerModel.DebuggerModel|null = null;
 
   private constructor() {
     super(i18nString(UIStrings.callStack), true);
 
-    this.ignoreListMessageElement = this.createIgnoreListMessageElement();
+    ({element: this.ignoreListMessageElement, checkbox: this.ignoreListCheckboxElement} =
+         this.createIgnoreListMessageElementAndCheckbox());
     this.contentElement.appendChild(this.ignoreListMessageElement);
 
     this.notPausedMessageElement = this.contentElement.createChild('div', 'gray-info-message');
     this.notPausedMessageElement.textContent = i18nString(UIStrings.notPaused);
     this.notPausedMessageElement.tabIndex = -1;
 
-    this.callFrameWarningsElement = this.contentElement.createChild('div', 'ignore-listed-message');
+    this.callFrameWarningsElement = this.contentElement.createChild('div', 'call-frame-warnings-message');
     const icon = UI.Icon.Icon.create('smallicon-warning', 'call-frame-warning-icon');
     this.callFrameWarningsElement.appendChild(icon);
     this.callFrameWarningsElement.appendChild(document.createTextNode(i18nString(UIStrings.callFrameWarnings)));
@@ -178,6 +182,7 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
 
   flavorChanged(_object: Object|null): void {
     this.showIgnoreListed = false;
+    this.ignoreListCheckboxElement.checked = false;
     this.maxAsyncStackChainDepth = defaultMaxAsyncStackChainDepth;
     this.update();
   }
@@ -186,6 +191,24 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
     this.update();
   }
 
+  private setSourceMapSubscription(debuggerModel: SDK.DebuggerModel.DebuggerModel|null): void {
+    // Shortcut for the case when we are listening to the same model.
+    if (this.lastDebuggerModel === debuggerModel) {
+      return;
+    }
+
+    if (this.lastDebuggerModel) {
+      this.lastDebuggerModel.sourceMapManager().removeEventListener(
+          SDK.SourceMapManager.Events.SourceMapAttached, this.debugInfoAttached, this);
+    }
+
+    this.lastDebuggerModel = debuggerModel;
+    if (this.lastDebuggerModel) {
+      this.lastDebuggerModel.sourceMapManager().addEventListener(
+          SDK.SourceMapManager.Events.SourceMapAttached, this.debugInfoAttached, this);
+    }
+  }
+
   private update(): void {
     void this.updateThrottler.schedule(() => this.doUpdate());
   }
@@ -196,6 +219,7 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
     this.callFrameWarningsElement.classList.add('hidden');
 
     const details = UI.Context.Context.instance().flavor(SDK.DebuggerModel.DebuggerPausedDetails);
+    this.setSourceMapSubscription(details?.debuggerModel ?? null);
     if (!details) {
       this.notPausedMessageElement.classList.remove('hidden');
       this.ignoreListMessageElement.classList.add('hidden');
@@ -256,6 +280,9 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
     }
     this.showMoreMessageElement.classList.toggle('hidden', !asyncStackTrace);
     this.items.replaceAll(items);
+    for (const item of this.items) {
+      this.refreshItem(item);
+    }
     if (this.maxAsyncStackChainDepth === defaultMaxAsyncStackChainDepth) {
       this.list.selectNextItem(true /* canWrap */, false /* center */);
       const selectedItem = this.list.selectedItem();
@@ -283,6 +310,7 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
         }
         this.ignoreListMessageElement.classList.toggle('hidden', true);
       } else {
+        this.showIgnoreListed = this.ignoreListCheckboxElement.checked;
         const itemsSet = new Set<Item>(items);
         let hasIgnoreListed = false;
         for (let i = 0; i < this.items.length; ++i) {
@@ -292,7 +320,7 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
           }
           hasIgnoreListed = hasIgnoreListed || item.isIgnoreListed;
         }
-        this.ignoreListMessageElement.classList.toggle('hidden', this.showIgnoreListed || !hasIgnoreListed);
+        this.ignoreListMessageElement.classList.toggle('hidden', !hasIgnoreListed);
       }
       delete this.muteActivateItem;
     });
@@ -365,24 +393,24 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
     return true;
   }
 
-  private createIgnoreListMessageElement(): Element {
+  private createIgnoreListMessageElementAndCheckbox(): {element: Element, checkbox: HTMLInputElement} {
     const element = document.createElement('div');
     element.classList.add('ignore-listed-message');
-    element.createChild('span');
-    const showAllLink = element.createChild('span', 'link');
-    showAllLink.textContent = i18nString(UIStrings.showIgnorelistedFrames);
-    UI.ARIAUtils.markAsLink(showAllLink);
-    showAllLink.tabIndex = 0;
+    const label = element.createChild('label');
+    label.classList.add('ignore-listed-message-label');
+    const checkbox = label.createChild('input') as HTMLInputElement;
+    checkbox.tabIndex = 0;
+    checkbox.type = 'checkbox';
+    checkbox.classList.add('ignore-listed-checkbox');
+    label.append(i18nString(UIStrings.showIgnorelistedFrames));
     const showAll = (): void => {
-      this.showIgnoreListed = true;
+      this.showIgnoreListed = checkbox.checked;
       for (const item of this.items) {
         this.refreshItem(item);
       }
-      this.ignoreListMessageElement.classList.toggle('hidden', true);
     };
-    showAllLink.addEventListener('click', showAll);
-    showAllLink.addEventListener('keydown', event => event.key === 'Enter' && showAll());
-    return element;
+    checkbox.addEventListener('click', showAll);
+    return {element, checkbox};
   }
 
   private createShowMoreMessageElement(): Element {
@@ -465,7 +493,7 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
     const canIgnoreList =
         Bindings.IgnoreListManager.IgnoreListManager.instance().canIgnoreListUISourceCode(uiSourceCode);
     const isIgnoreListed =
-        Bindings.IgnoreListManager.IgnoreListManager.instance().isIgnoreListedUISourceCode(uiSourceCode);
+        Bindings.IgnoreListManager.IgnoreListManager.instance().isUserIgnoreListedURL(uiSourceCode.url());
     const isContentScript = uiSourceCode.project().type() === Workspace.Workspace.projectTypes.ContentScripts;
 
     const manager = Bindings.IgnoreListManager.IgnoreListManager.instance();
@@ -572,7 +600,8 @@ export class Item {
   static async createForDebuggerCallFrame(
       frame: SDK.DebuggerModel.CallFrame, locationPool: Bindings.LiveLocation.LiveLocationPool,
       updateDelegate: (arg0: Item) => void): Promise<Item> {
-    const item = new Item(UI.UIUtils.beautifyFunctionName(frame.functionName), updateDelegate);
+    const name = await SourceMapScopes.NamesResolver.resolveFrameFunctionName(frame) ?? frame.functionName;
+    const item = new Item(UI.UIUtils.beautifyFunctionName(name), updateDelegate);
     await Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance().createCallFrameLiveLocation(
         frame.location(), item.update.bind(item), locationPool);
     return item;

package/front_end/panels/sources/DebuggerPlugin.ts

@@ -365,7 +365,7 @@ export class DebuggerPlugin extends Plugin {
       return;
     }
     const projectType = uiSourceCode.project().type();
-    if (!Bindings.IgnoreListManager.IgnoreListManager.instance().isIgnoreListedUISourceCode(uiSourceCode)) {
+    if (!Bindings.IgnoreListManager.IgnoreListManager.instance().isUserIgnoreListedURL(uiSourceCode.url())) {
       this.hideIgnoreListInfobar();
       return;
     }
@@ -513,7 +513,7 @@ export class DebuggerPlugin extends Plugin {
 
     if (this.uiSourceCode.project().type() === Workspace.Workspace.projectTypes.Network &&
         Common.Settings.Settings.instance().moduleSetting('jsSourceMapsEnabled').get() &&
-        !Bindings.IgnoreListManager.IgnoreListManager.instance().isIgnoreListedUISourceCode(this.uiSourceCode)) {
+        !Bindings.IgnoreListManager.IgnoreListManager.instance().isUserIgnoreListedURL(this.uiSourceCode.url())) {
       if (this.scriptFileForDebuggerModel.size) {
         const scriptFile: Bindings.ResourceScriptMapping.ResourceScriptFile =
             this.scriptFileForDebuggerModel.values().next().value;

package/front_end/panels/sources/callStackSidebarPane.css

@@ -4,7 +4,7 @@
  * found in the LICENSE file.
  */
 
-.ignore-listed-message {
+.call-frame-warnings-message {
   --override-ignore-message-background-color: #ffffc2;
 
   text-align: center;
@@ -14,6 +14,16 @@
   background-color: var(--override-ignore-message-background-color);
 }
 
+.ignore-listed-message {
+  padding: 1px;
+}
+
+.ignore-listed-message-label {
+  color: var(--color-text-secondary);
+  align-items: center;
+  display: flex;
+}
+
 .-theme-with-dark-background .ignore-listed-message,
 :host-context(.-theme-with-dark-background) .ignore-listed-message {
   --override-ignore-message-background-color: rgb(72 72 0);
@@ -23,14 +33,6 @@
   margin-left: 5px;
 }
 
-.ignore-listed-message > .link {
-  margin-left: 5px;
-}
-
-.ignore-listed-message > .link:focus {
-  outline-width: unset;
-}
-
 .show-more-message {
   text-align: center;
   font-style: italic;
@@ -80,6 +82,10 @@
   background-color: var(--legacy-focus-bg-color);
 }
 
+.ignore-listed-checkbox:focus-visible {
+  outline-width: unset;
+}
+
 .call-frame-item:not(.async-header):hover {
   background-color: var(--color-background-elevation-1);
 }

package/front_end/panels/sources/navigatorTree.css

@@ -121,9 +121,9 @@
   background: var(--override-image-font-tree-item-color);
 }
 
-.navigator-sm-folder-tree-item .tree-element-title,
-.navigator-sm-script-tree-item .tree-element-title,
-.navigator-sm-stylesheet-tree-item .tree-element-title {
+.tree-outline:not(:has(.navigator-deployed-tree-item)) .navigator-sm-folder-tree-item .tree-element-title,
+.tree-outline:not(:has(.navigator-deployed-tree-item)) .navigator-sm-script-tree-item .tree-element-title,
+.tree-outline:not(:has(.navigator-deployed-tree-item)) .navigator-sm-stylesheet-tree-item .tree-element-title {
   font-style: italic;
 }
 

package/front_end/panels/sources/watchExpressionsSidebarPane.css

@@ -10,6 +10,12 @@
   opacity: 0%;
 }
 
+:host-context(.-theme-with-dark-background) .watch-expression-delete-button {
+  /* This is a workaround due to a sprite with hardcoded color.
+     It should no longer be necessary after we update icons. */
+  filter: brightness(1.5);
+}
+
 .right-aligned {
   right: 16px;
 }

package/front_end/panels/timeline/TimelineFlameChartDataProvider.ts

@@ -701,7 +701,7 @@ export class TimelineFlameChartDataProvider extends Common.ObjectWrapper.ObjectW
   }
 
   private isIgnoreListedURL(url: Platform.DevToolsPath.UrlString): boolean {
-    return Bindings.IgnoreListManager.IgnoreListManager.instance().isIgnoreListedURL(url);
+    return Bindings.IgnoreListManager.IgnoreListManager.instance().isUserIgnoreListedURL(url);
   }
 
   private appendAsyncEventsGroup(