chrome-devtools-frontend 1.0.1026160 → 1.0.1026673

package/docs/triage_guidelines.md

@@ -1,124 +1,3 @@
 # Triage Guidelines
 
-## Disclaimer
-
-The most important thing: please use common sense. The guidelines below are likely not exhaustive and do not cover every case.
-
-## What should be triaged?
-
-All `Untriaged` DevTools issues, as well as any `Unconfirmed` issues that also have the `TE-NeedsTriageHelp` label need to be triaged.
-
-[[Query]](https://bugs.chromium.org/p/chromium/issues/list?sort=-modified&q=-label%3ADevTools-Triaged%20component%3APlatform%3EDevTools%20status%3AUntriaged%20OR%20component%3APlatform%3EDevTools%20status%3AUnconfirmed%20label%3ATE-NeedsTriageHelp)
-
-## Who is triaging?
-
-Right now there is a Google-internal rotation set-up, with people that do weekly shifts.
-As Microsoft is in an opposite timezone they have a similar rotation on the same triage queue, but during a different time.
-
-- Google rotation: GMT+1
-- MS rotation: GMT-9
-
-## What are the SLOs?
-
-[[Query]](https://bugs.chromium.org/p/chromium/issues/list?q=component%3APlatform%3EDevTools%20status%3AUntriaged%20modified-before%3Atoday-7%20OR%20component%3APlatform%3EDevTools%20status%3AUnconfirmed%20label%3ATE-NeedsTriageHelp%20modified-before%3Atoday-7)
-
-Issues in the untriaged queue should receive a meaningful response within a business week. This means that the goal is to make the query mentioned above return zero issues.
-
-## How are priorities defined?
-
-- P0: This needs to be urgently done, fire drill alert!
-  - Most of the time, this seldom needs to be used.
-  - Critical security exploits that affect stable are a good example for a P0
-  - DevTools crashing on startup is a good example
-- P1: This is important. Let’s aim to get this done next
-  - Non-critical security fixes will likely be in this category
-  - Regression bugs will be likely in this category
-  - Important features that partners are waiting for might be in this category
-- P2: We want to do that. The exact time of delivery is not that important though.
-  - General feature work will likely be in this category
-  - Non-severe bugs
-- P3: This is nice, but not important. We unlikely will do work here.
-  - Edge-case bugs might fit this category
-  - Non-important feature requests too
-
-## How should issues be triaged?
-
-- Close issues as `WontFix` if they don't reproduce (in simple cases) or are requests for features we've already concluded not to pursue.
-- Close issues as `Archived` that are valid, but it seems unlikely that we will get there anytime soon.
-- Move issues out of `Platform>DevTools` if they are not DevTools issues (but just reported via the menu item in DevTools), put on the `DevTools-Triaged` label and leave the `Untriaged` status as is.
-- Assign regression bugs with bisects to individuals directly and set the status to `Assigned`.
-- Put proper `Platform>DevTools>XXX` component(s) on the issue and do an initial check-in regarding the priority.
-- Put one of the following labels on it and set the status to `Available`:
-  - `Hotlist-DevTools-ProductReview` if it's controversial or clear that consensus needs to be built first.
-  - `Team-DevTools-BrowserAutomation` if it's an issue related to ChromeDriver or puppeteer.
-  - `Team-DevTools-RuntimeDebugging` if it's a JavaScript or WebAssembly debugging issue.
-  - `Team-DevTools-WebDebugging` if it's a Web specific debugging issue (i.e. Network or Application panel).
-  - `Team-DevTools-DesignAccessibility` if it's a design or accessibility issue.
-  - `Team-DevTools-Performance` if the issue is related to our performance tooling (i.e. Performance panel, Lighthouse).
-  - `Team-DevTools-RecordReplay` if it's an issue with the recorder or puppeteer.
-  - No specific `Team` or `Hotlist` if it doesn't fit any specific team otherwise. Make sure to have the `Platform>DevTools` component (or a subcomponent) on it though.
-- Also remember to put the `Needs-UX` label on it, if help from a designer is likely to be required.
-
-### Setting Assigned or Available
-
-Set issues to `Available` if they don’t need immediate action and nobody right now and in the short-term future (an iteration) needs to work on it.
-
-Issues that are handled by Microsoft have the label “Hotlist-DevTools-MS-Backlog” and “Hotlist-DevTools-MS-CurrentSprint” respectively and can be considered triaged.
-
-If you think they are super urgent, please assign them to yangguo@chromium.org and cc bmeurer@chromium.org and hablich@chromium.org.
-
-### Closing issues
-
-Don’t be afraid to close issues with WontFix if:
-
-- Bugs that are not reproducible
-- After two weeks you did not get a response back from the reporter on a question
-- The requested “bug” is the intended behavior
-  Make sure that you bundle the WontFix with a brief comment explaining it e.g. “Setting to WontFix because not reproducible.”
-
-## FAQ
-
-### What if the issue belongs to another team?
-
-If you think the to-triage issue is not a DevTools issue, please simply set it to a component that you think it should belong to and potentially remove the DevTools component. Make sure that the status is set to Untriaged. Please also ensure that you add the label DevTools-Triaged to the bug to ensure that the bug does not come back to the DevTools component. Feel free to CC people that you think might help with triaging this.
-This essentially moves the issue out of the DevTools triage queue into another team’s queue.
-
-### What if the issue is best handled by Microsoft?
-
-If you think the to-triage issue or feature request is best handled by Microsoft then add the label "msft-consider" to the issue along with completing the other normal triage steps.
-
-### There is a feature request I am unsure how to handle. What should I do?
-
-Please set the request to Available and add the label “Hotlist-DevTools-ProductReview”.
-
-### How do I indicate that a bug should block a release?
-
-The combination of the label “M-<milestone>” and “Release-Block-<channel>” signals that this very bug is blocking a release. Examples:
-
-- M-80, Release-Block-Stable
-  - This blocks the release of 80 to the Stable channel
-  - Depends in which release channel 80 is, this might not be an urgent (but still important bug to fix)
-- M-81, Release-Block-Beta
-  - This blocks the release of 81 to the Beta channel
-  - Depends in which release channel 81 is, this might not be an urgent (but still important bug to fix)
-- M-81, Release-Block-Dev
-  - This blocks the release of 81 to the Dev channel
-  - This typically means that the bug is urgent and important, as Dev releases are happening every week and are ok to be a little bit buggy.
-
-## Out of scope
-
-### Managing the backlog
-
-[[Query]](https://bugs.chromium.org/p/chromium/issues/list?q=component%3APlatform%3EDevTools%20status%3AAvailable)
-
-Managing the backlog is out of scope for the triage rotation. The backlog will be groomed continuously by hablich@ for now. The SLA is that there should be a maximum of 50 issues in there.
-
-### Managing the ProductReview queue
-
-[[Query]](https://bugs.chromium.org/p/chromium/issues/list?q=Hotlist%3DDevTools-ProductReview)
-
-Issues in `ProductReview` will continuously be handled by hablich@ to unblock items in there. SLA is max 10 issues.
-
-## References
-
-- [Chromium triage guidelines](https://www.chromium.org/for-testers/bug-reporting-guidelines/triage-best-practices)
+Moved to [go/chrome-devtools/triage-sheriff](http://go/chrome-devtools/triage-sheriff).

package/front_end/core/i18n/locales/en-US.json

@@ -1709,6 +1709,12 @@
   "models/timeline_model/TimelineModel.ts | workerSS": {
     "message": "Worker: {PH1} — {PH2}"
   },
+  "models/timeline_model/TimelineModel.ts | workletService": {
+    "message": "Auction Worklet Service"
+  },
+  "models/timeline_model/TimelineModel.ts | workletServiceS": {
+    "message": "Auction Worklet Service — {PH1}"
+  },
   "models/workspace/UISourceCode.ts | index": {
     "message": "(index)"
   },
@@ -8921,6 +8927,12 @@
   "panels/security/SecurityPanel.ts | contentWithCertificateErrors": {
     "message": "content with certificate errors"
   },
+  "panels/security/SecurityPanel.ts | enabled": {
+    "message": "enabled"
+  },
+  "panels/security/SecurityPanel.ts | encryptedClientHello": {
+    "message": "Encrypted ClientHello"
+  },
   "panels/security/SecurityPanel.ts | flaggedByGoogleSafeBrowsing": {
     "message": "Flagged by Google Safe Browsing"
   },
@@ -9044,6 +9056,9 @@
   "panels/security/SecurityPanel.ts | securityOverview": {
     "message": "Security overview"
   },
+  "panels/security/SecurityPanel.ts | serverSignature": {
+    "message": "Server signature"
+  },
   "panels/security/SecurityPanel.ts | showFullDetails": {
     "message": "Show full details"
   },
@@ -9146,6 +9161,9 @@
   "panels/security/SecurityPanel.ts | unknownCanceled": {
     "message": "Unknown / canceled"
   },
+  "panels/security/SecurityPanel.ts | unknownField": {
+    "message": "unknown"
+  },
   "panels/security/SecurityPanel.ts | validAndTrusted": {
     "message": "valid and trusted"
   },

package/front_end/core/i18n/locales/en-XL.json

@@ -1709,6 +1709,12 @@
   "models/timeline_model/TimelineModel.ts | workerSS": {
     "message": "Worker: {PH1} — {PH2}"
   },
+  "models/timeline_model/TimelineModel.ts | workletService": {
+    "message": "Âúĉt́îón̂ Ẃôŕk̂ĺêt́ Ŝér̂v́îćê"
+  },
+  "models/timeline_model/TimelineModel.ts | workletServiceS": {
+    "message": "Âúĉt́îón̂ Ẃôŕk̂ĺêt́ Ŝér̂v́îćê — {PH1}"
+  },
   "models/workspace/UISourceCode.ts | index": {
     "message": "(îńd̂éx̂)"
   },
@@ -8921,6 +8927,12 @@
   "panels/security/SecurityPanel.ts | contentWithCertificateErrors": {
     "message": "ĉón̂t́êńt̂ ẃît́ĥ ćêŕt̂íf̂íĉát̂é êŕr̂ór̂ś"
   },
+  "panels/security/SecurityPanel.ts | enabled": {
+    "message": "êńâb́l̂éd̂"
+  },
+  "panels/security/SecurityPanel.ts | encryptedClientHello": {
+    "message": "Êńĉŕŷṕt̂éd̂ Ćl̂íêńt̂H́êĺl̂ó"
+  },
   "panels/security/SecurityPanel.ts | flaggedByGoogleSafeBrowsing": {
     "message": "F̂ĺâǵĝéd̂ b́ŷ Ǵôóĝĺê Śâf́ê B́r̂óŵśîńĝ"
   },
@@ -9044,6 +9056,9 @@
   "panels/security/SecurityPanel.ts | securityOverview": {
     "message": "Ŝéĉúr̂ít̂ý ôv́êŕv̂íêẃ"
   },
+  "panels/security/SecurityPanel.ts | serverSignature": {
+    "message": "Ŝér̂v́êŕ ŝíĝńât́ûŕê"
+  },
   "panels/security/SecurityPanel.ts | showFullDetails": {
     "message": "Ŝh́ôẃ f̂úl̂ĺ d̂ét̂áîĺŝ"
   },
@@ -9146,6 +9161,9 @@
   "panels/security/SecurityPanel.ts | unknownCanceled": {
     "message": "Ûńk̂ńôẃn̂ / ćâńĉél̂éd̂"
   },
+  "panels/security/SecurityPanel.ts | unknownField": {
+    "message": "ûńk̂ńôẃn̂"
+  },
   "panels/security/SecurityPanel.ts | validAndTrusted": {
     "message": "v̂ál̂íd̂ án̂d́ t̂ŕûśt̂éd̂"
   },

package/front_end/core/sdk/SourceMap.ts

@@ -77,6 +77,9 @@ export interface SourceMap {
       SourceMapEntry|null;
   mappings(): SourceMapEntry[];
   mapsOrigin(): boolean;
+  hasIgnoreListHint(sourceURL: Platform.DevToolsPath.UrlString): boolean;
+  findRanges(predicate: (sourceURL: Platform.DevToolsPath.UrlString) => boolean, options: {isStartMatching: boolean}):
+      TextUtils.TextRange.TextRange[];
 }
 
 export class SourceMapV3 {
@@ -595,19 +598,32 @@ export class TextSourceMap implements SourceMap {
   }
 
   /**
-   * Returns a list of ranges in the generated script, which are known to be
-   * third-party code that should be ignore-listed. Each range is a [begin, end)
-   * pair, meaning that code at the beginning location, up to but not including
-   * the end location, is known to be third-party code.
+   * Returns a list of ranges in the generated script for original sources that
+   * match a predicate. Each range is a [begin, end) pair, meaning that code at
+   * the beginning location, up to but not including the end location, matches
+   * the predicate.
    */
-  ignoreListRanges(): TextUtils.TextRange.TextRange[] {
+  findRanges(predicate: (sourceURL: Platform.DevToolsPath.UrlString) => boolean, options?: {isStartMatching: boolean}):
+      TextUtils.TextRange.TextRange[] {
     const mappings = this.mappings();
     const ranges = [];
 
+    if (!mappings.length) {
+      return [];
+    }
+
     let current: TextUtils.TextRange.TextRange|null = null;
 
+    // If the first mapping isn't at the beginning of the original source, it's
+    // up to the caller to decide if it should be considered matching the
+    // predicate or not. By default, it's not.
+    if ((mappings[0].lineNumber !== 0 || mappings[0].columnNumber !== 0) && options?.isStartMatching) {
+      current = TextUtils.TextRange.TextRange.createUnboundedFromLocation(0, 0);
+      ranges.push(current);
+    }
+
     for (const {sourceURL, lineNumber, columnNumber} of mappings) {
-      const ignoreListHint = sourceURL && this.hasIgnoreListHint(sourceURL);
+      const ignoreListHint = sourceURL && predicate(sourceURL);
 
       if (!current && ignoreListHint) {
         current = TextUtils.TextRange.TextRange.createUnboundedFromLocation(lineNumber, columnNumber);

package/front_end/generated/protocol.ts

@@ -236,6 +236,10 @@ export namespace Accessibility {
      * This `Node`'s role, whether explicit or implicit.
      */
     role?: AXValue;
+    /**
+     * This `Node`'s Chrome raw role.
+     */
+    chromeRole?: AXValue;
     /**
      * The accessible name for this `Node`.
      */

package/front_end/legacy_test_runner/sources_test_runner/DebuggerTestRunner.js

@@ -291,7 +291,7 @@ SourcesTestRunner.captureStackTraceIntoString = async function(callFrames, async
       const script = location.script();
       const uiLocation = await self.Bindings.debuggerWorkspaceBinding.rawLocationToUILocation(location);
       const isFramework =
-          uiLocation ? self.Bindings.ignoreListManager.isIgnoreListedUISourceCode(uiLocation.uiSourceCode) : false;
+          uiLocation ? self.Bindings.ignoreListManager.isUserIgnoreListedURL(uiLocation.uiSourceCode.url()) : false;
 
       if (options.dropFrameworkCallFrames && isFramework) {
         continue;

package/front_end/models/bindings/CompilerScriptMapping.ts

@@ -247,7 +247,7 @@ export class CompilerScriptMapping implements DebuggerSourceMapping {
     const sourceMap = event.data.sourceMap;
     await this.removeStubUISourceCode(script);
 
-    if (IgnoreListManager.instance().isIgnoreListedURL(script.sourceURL, script.isContentScript())) {
+    if (IgnoreListManager.instance().isUserIgnoreListedURL(script.sourceURL, script.isContentScript())) {
       this.sourceMapAttachedForTest(sourceMap);
       return;
     }

package/front_end/models/bindings/DebuggerWorkspaceBinding.ts

@@ -509,7 +509,13 @@ export class Location extends LiveLocationWithPool {
 
   async isIgnoreListed(): Promise<boolean> {
     const uiLocation = await this.uiLocation();
-    return uiLocation ? IgnoreListManager.instance().isIgnoreListedUISourceCode(uiLocation.uiSourceCode) : false;
+    if (!uiLocation) {
+      return false;
+    }
+    const manager = this.rawLocation.debuggerModel.sourceMapManager();
+    const script = this.rawLocation.script();
+    const map = script ? await manager.sourceMapForClientPromise(script) : null;
+    return IgnoreListManager.instance().isUserOrSourceMapIgnoreListedUISourceCode(uiLocation.uiSourceCode, map);
   }
 }
 

package/front_end/models/bindings/IgnoreListManager.ts

@@ -97,17 +97,25 @@ export class IgnoreListManager implements SDK.TargetManager.SDKModelObserver<SDK
     return debuggerModel.setBlackboxPatterns(patterns);
   }
 
-  isIgnoreListedUISourceCode(uiSourceCode: Workspace.UISourceCode.UISourceCode): boolean {
+  isUserOrSourceMapIgnoreListedUISourceCode(
+      uiSourceCode: Workspace.UISourceCode.UISourceCode, sourceMap: SDK.SourceMap.SourceMap|null): boolean {
     const projectType = uiSourceCode.project().type();
     const isContentScript = projectType === Workspace.Workspace.projectTypes.ContentScripts;
     if (isContentScript && Common.Settings.Settings.instance().moduleSetting('skipContentScripts').get()) {
       return true;
     }
     const url = this.uiSourceCodeURL(uiSourceCode);
-    return url ? this.isIgnoreListedURL(url) : false;
+    return url ? this.isUserOrSourceMapIgnoreListedURL(url, sourceMap) : false;
   }
 
-  isIgnoreListedURL(url: Platform.DevToolsPath.UrlString, isContentScript?: boolean): boolean {
+  isUserOrSourceMapIgnoreListedURL(url: Platform.DevToolsPath.UrlString, sourceMap: SDK.SourceMap.SourceMap|null):
+      boolean {
+    const userIgnoreListed = this.isUserIgnoreListedURL(url);
+    const sourceMapIgnoreListed = sourceMap?.hasIgnoreListHint(url) ?? false;
+    return userIgnoreListed || sourceMapIgnoreListed;
+  }
+
+  isUserIgnoreListedURL(url: Platform.DevToolsPath.UrlString, isContentScript?: boolean): boolean {
     if (this.#isIgnoreListedURLCache.has(url)) {
       return Boolean(this.#isIgnoreListedURLCache.get(url));
     }
@@ -137,8 +145,9 @@ export class IgnoreListManager implements SDK.TargetManager.SDKModelObserver<SDK
 
   private async updateScriptRanges(script: SDK.Script.Script, sourceMap: SDK.SourceMap.SourceMap|null): Promise<void> {
     let hasIgnoreListedMappings = false;
-    if (!IgnoreListManager.instance().isIgnoreListedURL(script.sourceURL, script.isContentScript())) {
-      hasIgnoreListedMappings = sourceMap ? sourceMap.sourceURLs().some(url => this.isIgnoreListedURL(url)) : false;
+    if (!IgnoreListManager.instance().isUserIgnoreListedURL(script.sourceURL, script.isContentScript())) {
+      hasIgnoreListedMappings =
+          sourceMap?.sourceURLs().some(url => this.isUserOrSourceMapIgnoreListedURL(url, sourceMap)) ?? false;
     }
     if (!hasIgnoreListedMappings) {
       if (scriptToRange.get(script) && await script.setBlackboxedRanges([])) {
@@ -152,21 +161,10 @@ export class IgnoreListManager implements SDK.TargetManager.SDKModelObserver<SDK
       return;
     }
 
-    const mappings = sourceMap.mappings();
-    const newRanges: SourceRange[] = [];
-    if (mappings.length > 0) {
-      let currentIgnoreListed = false;
-      if (mappings[0].lineNumber !== 0 || mappings[0].columnNumber !== 0) {
-        newRanges.push({lineNumber: 0, columnNumber: 0});
-        currentIgnoreListed = true;
-      }
-      for (const mapping of mappings) {
-        if (mapping.sourceURL && currentIgnoreListed !== this.isIgnoreListedURL(mapping.sourceURL)) {
-          newRanges.push({lineNumber: mapping.lineNumber, columnNumber: mapping.columnNumber});
-          currentIgnoreListed = !currentIgnoreListed;
-        }
-      }
-    }
+    const newRanges =
+        sourceMap
+            .findRanges(srcURL => this.isUserOrSourceMapIgnoreListedURL(srcURL, sourceMap), {isStartMatching: true})
+            .flatMap(range => [range.start, range.end]);
 
     const oldRanges = scriptToRange.get(script) || [];
     if (!isEqual(oldRanges, newRanges) && await script.setBlackboxedRanges(newRanges)) {

package/front_end/models/issues_manager/descriptions/clientHintMetaTagAllowListInvalidOrigin.md

@@ -1,4 +1,4 @@
 # Client Hint meta tag contained invalid origin
 
-Items in the accept-ch meta tag allow list must be valid origins.
+Items in the delegate-ch meta tag allow list must be valid origins.
 No special values (e.g. self, none, and *) are permitted.

package/front_end/models/issues_manager/descriptions/clientHintMetaTagModifiedHTML.md

@@ -1,4 +1,4 @@
 # Client Hint meta tag modified by javascript
 
-Only accept-ch meta tags in the original HTML sent from the server
+Only delegate-ch meta tags in the original HTML sent from the server
 are respected. Any injected via javascript (or other means) are ignored.

package/front_end/models/text_utils/TextRange.ts

@@ -230,6 +230,14 @@ export class TextRange {
     }
     return this.startLine < lineNumber && lineNumber < this.endLine;
   }
+
+  get start(): {lineNumber: number, columnNumber: number} {
+    return {lineNumber: this.startLine, columnNumber: this.startColumn};
+  }
+
+  get end(): {lineNumber: number, columnNumber: number} {
+    return {lineNumber: this.endLine, columnNumber: this.endColumn};
+  }
 }
 
 export class SourceRange {

package/front_end/models/timeline_model/TimelineModel.ts

@@ -94,6 +94,18 @@ const UIStrings = {
    *@description Title of an auction worklet in the timeline flame chart of the Performance panel
    */
   unknownWorklet: 'Auction Worklet',
+
+  /**
+   *@description Title of control thread of a service process for an auction worklet in the timeline flame chart of the Performance panel
+   */
+  workletService: 'Auction Worklet Service',
+
+  /**
+   *@description Title of control thread of a service process for an auction worklet with known URL in the timeline flame chart of the Performance panel
+   * @example {https://google.com} PH1
+   */
+  workletServiceS: 'Auction Worklet Service — {PH1}',
+
 };
 const str_ = i18n.i18n.registerUIStrings('models/timeline_model/TimelineModel.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
@@ -535,7 +547,8 @@ export class TimelineModelImpl {
         } else {
           let urlForOther: Platform.DevToolsPath.UrlString|null = null;
           let workletTypeForOther: WorkletType = WorkletType.NotWorklet;
-          if (thread.name() === TimelineModelImpl.AuctionWorkletThreadName) {
+          if (thread.name() === TimelineModelImpl.AuctionWorkletThreadName ||
+              thread.name() === TimelineModelImpl.UtilityMainThreadName) {
             if (typeof workletUrl !== 'boolean') {
               urlForOther = workletUrl;
             }
@@ -822,6 +835,9 @@ export class TimelineModelImpl {
     } else if (thread.name() === TimelineModelImpl.AuctionWorkletThreadName) {
       track.url = url || Platform.DevToolsPath.EmptyUrlString;
       track.name = TimelineModelImpl.nameAuctionWorklet(workletType, url);
+    } else if (workletType !== WorkletType.NotWorklet && thread.name() === TimelineModelImpl.UtilityMainThreadName) {
+      track.url = url || Platform.DevToolsPath.EmptyUrlString;
+      track.name = url ? i18nString(UIStrings.workletServiceS, {PH1: url}) : i18nString(UIStrings.workletService);
     }
     this.tracksInternal.push(track);
 
@@ -1700,6 +1716,7 @@ export namespace TimelineModelImpl {
   export const WorkerThreadNameLegacy = 'DedicatedWorker Thread';
   export const RendererMainThreadName = 'CrRendererMain';
   export const BrowserMainThreadName = 'CrBrowserMain';
+  export const UtilityMainThreadName = 'CrUtilityMain';
   export const AuctionWorkletThreadName = 'AuctionV8HelperThread';
 
   export const DevToolsMetadataEvent = {

package/front_end/panels/elements/ElementsTreeOutline.ts

@@ -453,6 +453,8 @@ export class ElementsTreeOutline extends
       }
     }
 
+    this.createTopLayerContainer();
+
     if (selectedNode) {
       this.revealAndSelectNode(selectedNode, true);
     }
@@ -1173,24 +1175,16 @@ export class ElementsTreeOutline extends
     }
 
     return new Promise<void>(resolve => {
-             treeElement.node().getChildNodes(() => {
-               populatedTreeElements.add(treeElement);
-               this.updateModifiedParentNode(treeElement.node());
-               resolve();
-             });
-           })
-        .then(() => {
-          if (treeElement.node().nodeName() === 'BODY') {
-            this.createTopLayerContainer(treeElement);
-          }
-        });
+      treeElement.node().getChildNodes(() => {
+        populatedTreeElements.add(treeElement);
+        this.updateModifiedParentNode(treeElement.node());
+        resolve();
+      });
+    });
   }
 
-  createTopLayerContainer(bodyElement: ElementsTreeElement): void {
-    if (!this.topLayerContainer) {
-      this.topLayerContainer = new TopLayerContainer(bodyElement);
-    }
-    this.topLayerContainer.updateBody(bodyElement);
+  createTopLayerContainer(): void {
+    this.topLayerContainer = new TopLayerContainer(this);
     void this.topLayerContainer.throttledUpdateTopLayerElements();
   }
 

package/front_end/panels/elements/TopLayerContainer.ts

@@ -23,29 +23,18 @@ 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 {
-    if (this.bodyElement !== bodyElement) {
-      this.#inserted = false;
-    }
-    this.bodyElement = bodyElement;
-  }
-
   async throttledUpdateTopLayerElements(): Promise<void> {
     await this.topLayerUpdateThrottler.schedule(() => this.updateTopLayerElements());
   }
@@ -55,7 +44,13 @@ export class TopLayerContainer extends UI.TreeOutline.TreeElement {
     this.removeCurrentTopLayerElementsAdorners();
     this.currentTopLayerElements = new Set();
 
-    const newTopLayerElementsIDs = await this.domModel.getTopLayerElements();
+    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;
@@ -63,12 +58,12 @@ export class TopLayerContainer extends UI.TreeOutline.TreeElement {
 
     let topLayerElementIndex = 0;
     for (let i = 0; i < newTopLayerElementsIDs.length; i++) {
-      const topLayerDOMNode = this.domModel.idToDOMNode.get(newTopLayerElementsIDs[i]);
+      const topLayerDOMNode = domModel.idToDOMNode.get(newTopLayerElementsIDs[i]);
       if (topLayerDOMNode && topLayerDOMNode.nodeName() !== '::backdrop') {
         const topLayerElementShortcut = new SDK.DOMModel.DOMNodeShortcut(
-            this.domModel.target(), topLayerDOMNode.backendNodeId(), 0, topLayerDOMNode.nodeName());
+            domModel.target(), topLayerDOMNode.backendNodeId(), 0, topLayerDOMNode.nodeName());
         const topLayerElementRepresentation = new ElementsTreeOutline.ShortcutTreeElement(topLayerElementShortcut);
-        const topLayerTreeElement = this.bodyElement.treeOutline?.treeElementByNode.get(topLayerDOMNode);
+        const topLayerTreeElement = this.domContainer.treeElementByNode.get(topLayerDOMNode);
         if (!topLayerTreeElement) {
           continue;
         }
@@ -78,11 +73,10 @@ export class TopLayerContainer extends UI.TreeOutline.TreeElement {
         this.currentTopLayerElements.add(topLayerTreeElement);
         this.appendChild(topLayerElementRepresentation);
         // Add the element's backdrop if previous top layer element is a backdrop.
-        const previousTopLayerDOMNode =
-            (i > 0) ? this.domModel.idToDOMNode.get(newTopLayerElementsIDs[i - 1]) : undefined;
+        const previousTopLayerDOMNode = (i > 0) ? domModel.idToDOMNode.get(newTopLayerElementsIDs[i - 1]) : undefined;
         if (previousTopLayerDOMNode && previousTopLayerDOMNode.nodeName() === '::backdrop') {
           const backdropElementShortcut = new SDK.DOMModel.DOMNodeShortcut(
-              this.domModel.target(), previousTopLayerDOMNode.backendNodeId(), 0, previousTopLayerDOMNode.nodeName());
+              domModel.target(), previousTopLayerDOMNode.backendNodeId(), 0, previousTopLayerDOMNode.nodeName());
           const backdropElementRepresentation = new ElementsTreeOutline.ShortcutTreeElement(backdropElementShortcut);
           topLayerElementRepresentation.appendChild(backdropElementRepresentation);
         }
@@ -91,7 +85,7 @@ export class TopLayerContainer extends UI.TreeOutline.TreeElement {
 
     this.hidden = topLayerElementIndex <= 0;
     if (!this.hidden && !this.#inserted) {
-      this.bodyElement.insertChild(this, this.bodyElement.childCount() - 1);
+      this.domContainer.appendChild(this);
       this.#inserted = true;
     }
   }

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/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

@@ -219,13 +219,13 @@ 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');
       this.showMoreMessageElement.classList.add('hidden');
       this.items.replaceAll([]);
       UI.Context.Context.instance().setFlavor(SDK.DebuggerModel.CallFrame, null);
-      this.setSourceMapSubscription(null);
       return;
     }
 
@@ -251,7 +251,6 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
     }
 
     let debuggerModel = details.debuggerModel;
-    this.setSourceMapSubscription(debuggerModel);
     let asyncStackTraceId = details.asyncStackTraceId;
     let asyncStackTrace: Protocol.Runtime.StackTrace|undefined|null = details.asyncStackTrace;
     let previousStackTrace: Protocol.Runtime.CallFrame[]|SDK.DebuggerModel.CallFrame[] = details.callFrames;
@@ -494,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();

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/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/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(

package/front_end/ui/components/docs/building-ui-documentation/CreatingComponents.md

@@ -78,9 +78,11 @@ Each component defines a `#render` method which is responsible for invoking LitH
 The `#render` method calls `LitHtml.render`, building up a template with `LitHtml.html`:
 
 ```ts
-LitHtml.render(LitHtml.html``, this.#shadow, {host: this});
+LitHtml.render(LitHtml.html`<p>hello world!</p>`, this.#shadow, {host: this});
 ```
 
+The third argument (`{host: this}`) tells LitHtml to automatically bind event listeners to the component. This can save you some painful debugging where event listeners do not have the right `this` reference; so we enforce the use of `{host: this}` via a custom ESLint rule.
+
 There is unfortunately a [clang-format bug](crbug.com/1079231) which makes its auto-formatting of LitHtml templates very unreadable, so we usually disable clang-format round the call:
 
 ```ts
@@ -110,3 +112,172 @@ void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#boundRender);
 ```
 
 > `scheduleRender` returns a promise; we use the `void` keyword to instruct TypeScript that we are purposefully not using `await` to wait for the promise to resolve. When scheduling a render it's most common to "fire and forget".
+
+To summarise, most components start off life looking like:
+
+```ts
+export class ElementsBreadcrumbs extends HTMLElement {
+  static readonly litTagName = LitHtml.literal`devtools-chrome-link`;
+  readonly #shadow = this.attachShadow({mode: 'open'});
+  readonly #boundRender = this.#render.bind(this);
+
+  #render(): void {
+    LitHtml.render(LitHtml.html``, this.#shadow, {host:this});
+  }
+}
+```
+
+## Triggering a render
+
+One of the most important aspects to understand about our component system is that **rendering does not happen automatically**.
+
+To ensure we trigger a render once the component is added to the DOM, we can define [`connectedCallback`](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements#:~:text=lifecycle.%20For%20example%2C-,connectedCallback,-is%20invoked%20each):
+
+```ts
+export class ElementsBreadcrumbs extends HTMLElement {
+  static readonly litTagName = LitHtml.literal`devtools-chrome-link`;
+  readonly #shadow = this.attachShadow({mode: 'open'});
+  readonly #boundRender = this.#render.bind(this);
+
+  connectedCallback(): void {
+    void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#boundRender);
+  }
+
+  #render(): void {
+    LitHtml.render(LitHtml.html``, this.#shadow, {host:this});
+  }
+}
+```
+
+## Passing data into a component
+
+Most of our components will require data that is passed into them. For example, `ElementsBreadcrumbs` takes in an array of `DOMNode` objects.
+
+To provide a component some data, we define a `data` setter. This setter takes an object with any data the component requires. This object should have a TypeScript interface defined for it:
+
+```ts
+export interface ElementsBreadcrumbsData {
+  selectedNode: DOMNode|null;
+  crumbs: DOMNode[];
+}
+
+export class ElementsBreadcrumbs extends HTMLElement {
+  // ...
+  #crumbs: DOMNode[] = [];
+  #selectedNode: DOMNode|null = null;
+
+  set data(data: ElementsBreadcrumbsData) {
+    this.#crumbs = data.crumbs;
+    this.#selectedNode = data.selectedNode;
+    void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#boundRender);
+  }
+}
+```
+
+## Rendering components
+
+Now we know how to create components that can take data, let's render them!
+
+### From a DevTools Widget
+
+If you are rendering a component from the DevTools widget system, you should instantiate the component, pass any `data` to it, and then append it into the DOM:
+
+```ts
+// Within a Widget
+const breadcrumbs = new ElementsBreadcrumbs();
+breadcrumbs.data = {selectedNode: node, crumbs: [...]};
+this.appendChild(breadcrumbs);
+```
+
+### From another component
+
+If you are rendering a component from within another component, render it within the call to `LitHtml.html` and use the static `litTagName` property:
+
+```ts
+// Within some component
+LitHtml.render(LitHtml.html`
+  <${ElementsBreadcrumbs.litTagName}></${ElementsBreadcrumbs>
+`, this.#shadow, {host: this});
+```
+
+To pass data, we use [LitHtml's dot syntax](https://lit.dev/docs/templates/expressions/#property-expressions) to set the `data` property (and invoke our `set data` setter):
+
+```ts
+// Within some component
+LitHtml.render(LitHtml.html`
+  <${ElementsBreadcrumbs.litTagName} .data=${{
+    selectedNode: node,
+    crumbs: [...],
+  }}>
+  </${ElementsBreadcrumbs>
+`, this.#shadow, {host: this});
+```
+
+To enforce some type safety, we also use TypeScript's `as` keyword to force the compiler to type-check the `data` object against the interface:
+
+```ts
+// Within some component
+LitHtml.render(LitHtml.html`
+  <${ElementsBreadcrumbs.litTagName} .data=${{
+    selectedNode: node,
+    crumbs: [...],
+  } as ElementsBreadcrumbsData}>
+  </${ElementsBreadcrumbs>
+`, this.#shadow, {host: this});
+```
+
+This type-checking requirement is enforced by an ESLint rule.
+
+## Performance concerns with data passing
+
+The approach of `set data(data)` was chosen because:
+
+1. It requires few lines of code.
+2. It provides some form of type safety via the `as FooData` check.
+3. At the time we didn't have a solution for scheduled and batched renders, and didn't want multiple setters to trigger multiple unnecessary renders.
+
+However, using `set data(data)` does come with some negative performance costs:
+
+1. LitHtml will always think the value has changed, because it's an object. If a component renders twice with `.data=${{name: 'Jack'}}`, Lit will think that the value has changed because it's a new object, even though we can see it's holding the same data.
+2. This approach causes these objects to be created (and subsequently garbage collected) on/after each render.
+
+For most components in DevTools, these trade-offs are acceptable, and we prefer the type-safety of `set data` and take the usually imperceivable performance hit. However, in rare circumstances, this performance hit is noticeable. A good example of this is in Performance Insights, where we have to constantly re-render components as the user scrolls through their performance timeline. We noticed that this caused a large amount of garbage collection from all the objects being created per-render and then immediately disposed.
+
+For these situations, we can instead move to an approach where we set properties individually. We still define the interface as before, and then define an individual setter for each property:
+
+```ts
+interface ElementsBreadcrumbsData {
+  selectedNode: DOMNode|null;
+  crumbs: DOMNode[];
+}
+
+class ElementsBreadcrumbs extends HTMLElement {
+  #crumbs: DOMNode[] = [];
+  #selectedNode: DOMNode|null = null;
+
+  set crumbs(crumbs: ElementsBreadcrumbsData['crumbs']) {
+    this.#crumbs = crumbs;
+    void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#boundRender);
+  }
+
+  set selectedNode(selectedNode: ElementsBreadcrumbsData['selectedNode']) {
+    this.#selectedNode = selectedNode;
+    void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#boundRender);
+  }
+}
+```
+
+Rendering this component within another Lit component would now be done like so:
+
+```ts
+// Within some component
+LitHtml.render(LitHtml.html`
+  <${ElementsBreadcrumbs.litTagName} .crumbs=${[...]} .selectedNode=${node}>
+  </${ElementsBreadcrumbs>
+`, this.#shadow, {host: this});
+```
+
+This solution is more performant, but less type-safe as TypeScript has no means of checking those values. This is something we may rectify using the `as` pattern, but for now it's preferred to use the `set data` method by default.
+
+
+

package/front_end/ui/components/text_editor/TextEditor.ts

@@ -105,6 +105,9 @@ export class TextEditor extends HTMLElement {
   connectedCallback(): void {
     if (!this.#activeEditor) {
       this.#createEditor();
+    } else {
+      this.#activeEditor.scrollDOM.scrollTop = this.#lastScrollPos.top;
+      this.#activeEditor.scrollDOM.scrollLeft = this.#lastScrollPos.left;
     }
   }
 

package/front_end/ui/legacy/components/utils/JSPresentationUtils.ts

@@ -70,7 +70,7 @@ function populateContextMenu(link: Element, event: Event): void {
   const uiLocation = Linkifier.uiLocation(link);
   if (uiLocation &&
       Bindings.IgnoreListManager.IgnoreListManager.instance().canIgnoreListUISourceCode(uiLocation.uiSourceCode)) {
-    if (Bindings.IgnoreListManager.IgnoreListManager.instance().isIgnoreListedUISourceCode(uiLocation.uiSourceCode)) {
+    if (Bindings.IgnoreListManager.IgnoreListManager.instance().isUserIgnoreListedURL(uiLocation.uiSourceCode.url())) {
       contextMenu.debugSection().appendItem(
           i18nString(UIStrings.removeFromIgnore),
           () => Bindings.IgnoreListManager.IgnoreListManager.instance().unIgnoreListUISourceCode(
@@ -127,8 +127,8 @@ export function buildStackTraceRows(
         // TODO(crbug.com/1183325): fix race condition with uiLocation still being null here
         const uiLocation = Linkifier.uiLocation(link);
         if (uiLocation &&
-            Bindings.IgnoreListManager.IgnoreListManager.instance().isIgnoreListedUISourceCode(
-                uiLocation.uiSourceCode)) {
+            Bindings.IgnoreListManager.IgnoreListManager.instance().isUserIgnoreListedURL(
+                uiLocation.uiSourceCode.url())) {
           ignoreListHide = true;
         }
         // Linkifier is using a workaround with the 'zero width space' (\u200b).
@@ -175,7 +175,8 @@ function updateHiddenRows(
     if ('link' in row && row.link) {
       const uiLocation = Linkifier.uiLocation(row.link);
       if (uiLocation &&
-          Bindings.IgnoreListManager.IgnoreListManager.instance().isIgnoreListedUISourceCode(uiLocation.uiSourceCode)) {
+          Bindings.IgnoreListManager.IgnoreListManager.instance().isUserIgnoreListedURL(
+              uiLocation.uiSourceCode.url())) {
         row.ignoreListHide = true;
       }
       if (row.rowCountHide || row.ignoreListHide) {

package/package.json

@@ -55,5 +55,5 @@
     "unittest": "scripts/test/run_unittests.py --no-text-coverage",
     "watch": "vpython third_party/node/node.py --output scripts/watch_build.js"
   },
-  "version": "1.0.1026160"
+  "version": "1.0.1026673"
 }