chrome-devtools-frontend 1.0.1650035 → 1.0.1650232

package/front_end/third_party/third-party-web/package/lib/create-entity-finder-api.js

@@ -1,22 +1,35 @@
 const DOMAIN_IN_URL_REGEX = /:\/\/(\S*?)(:\d+)?(\/|$)/
-const DOMAIN_CHARACTERS = /([a-z0-9.-]+\.[a-z0-9]+|localhost)/i
+const DOMAIN_CHARACTERS = /(?:[a-z0-9.-]+\.[a-z0-9]+|localhost)/i
 const IP_REGEX = /^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/
 const ROOT_DOMAIN_REGEX = /[^.]+\.([^.]+|(gov|com|co|ne)\.\w{2})$/i
 
-function getDomainFromOriginOrURL(originOrURL) {
-  if (typeof originOrURL !== 'string') return null
-  if (originOrURL.length > 10000 || originOrURL.startsWith('data:')) return null
-  if (DOMAIN_IN_URL_REGEX.test(originOrURL)) return originOrURL.match(DOMAIN_IN_URL_REGEX)[1]
-  if (DOMAIN_CHARACTERS.test(originOrURL)) return originOrURL.match(DOMAIN_CHARACTERS)[0]
-  return null
+/**
+ * @param {string} originOrURL
+ * @return {[string|null, string|null]} - The first item is the root domain, the second item is the domain.
+ */
+function parseDomains(originOrURL) {
+  if (typeof originOrURL !== 'string') return [null, null]
+  if (originOrURL.length > 10000 || originOrURL.startsWith('data:')) return [null, null]
+  let m = originOrURL.match(DOMAIN_IN_URL_REGEX)
+  let domain;
+  if (m) {
+    domain = m[1]
+  }
+  m = originOrURL.match(DOMAIN_CHARACTERS)
+  if (m) {
+    domain = m[0]
+  }
+
+  if (!domain) return [null, null]
+  if (IP_REGEX.test(domain)) return [domain, domain]
+  m = domain.match(ROOT_DOMAIN_REGEX)
+  const rootDomain = m && m[0] || domain;
+
+  return [rootDomain, domain]
 }
 
-function getRootDomain(originOrURL) {
-  const domain = getDomainFromOriginOrURL(originOrURL)
-  if (!domain) return null
-  if (IP_REGEX.test(domain)) return domain
-  const match = domain.match(ROOT_DOMAIN_REGEX)
-  return (match && match[0]) || domain
+function getRootDomain(originOrURL,) {
+  return parseDomains(originOrURL)[0];
 }
 
 function sliceSubdomainFromDomain(domain, rootDomain) {
@@ -28,8 +41,7 @@ function sliceSubdomainFromDomain(domain, rootDomain) {
 }
 
 function getEntityInDataset(entityByDomain, entityBySubDomain, entityByRootDomain, originOrURL) {
-  const domain = getDomainFromOriginOrURL(originOrURL)
-  const rootDomain = getRootDomain(domain)
+  const [rootDomain, domain] = parseDomains(originOrURL);
   if (!domain || !rootDomain) return undefined
   if (entityByDomain.has(domain)) return entityByDomain.get(domain)
 

package/front_end/third_party/third-party-web/package/lib/create-entity-finder-api.test.js

@@ -1,3 +1,5 @@
+const fs = require('fs')
+const path = require('path')
 const {createAPIFromDataset} = require('./create-entity-finder-api.js')
 
 describe('getEntity', () => {
@@ -41,4 +43,16 @@ describe('getEntity', () => {
     expect(api.getEntity('https://bar.example.co.uk/path').name).toEqual('Domain')
     expect(api.getEntity('https://baz.bar.example.co.uk/path').name).toEqual('Domain')
   })
+
+  it.skip('stress test', () => {
+    const urls = fs
+      .readFileSync(path.join(__dirname, '../data/random-urls.txt'), 'utf8')
+      .split('\n')
+      .filter(Boolean)
+    console.time('getEntity')
+    for (let i = 0; i < 1_000_000; i++) {
+      api.getEntity(urls[i % urls.length])
+    }
+    console.timeEnd('getEntity')
+  })
 })

package/front_end/third_party/third-party-web/package/lib/entities.test.js

@@ -24,4 +24,14 @@ describe('Entities', () => {
       }
     }
   })
+
+  it('should not have commas within a domain', () => {
+    for (const entity of entities) {
+      for (const domain of entity.domains) {
+        // A domain can be `*.maxymiser.net` or `maxymiser.hs.llnwd.net`
+        // A domain can't be `*.maxymiser.net, maxymiser.hs.llnwd.net`
+        expect(domain).toEqual(expect.not.stringContaining(','))
+      }
+    }
+  })
 })

package/front_end/third_party/third-party-web/package/lib/index.test.js

@@ -59,7 +59,7 @@ describe('getEntity', () => {
   it('works for direct domain usage', () => {
     expect(getEntity('https://js.connect.facebook.net/lib.js')).toMatchInlineSnapshot(`
       Object {
-        "averageExecutionTime": 347.4278160199557,
+        "averageExecutionTime": 513.7506757503379,
         "categories": Array [
           "social",
         ],
@@ -103,8 +103,8 @@ describe('getEntity', () => {
             ],
           },
         ],
-        "totalExecutionTime": 1097107210,
-        "totalOccurrences": 3157799,
+        "totalExecutionTime": 2901178836,
+        "totalOccurrences": 5647056,
       }
     `)
   })
@@ -112,7 +112,7 @@ describe('getEntity', () => {
   it('works for inferred domain usage', () => {
     expect(getEntity('https://unknown.typekit.net/fonts.css')).toMatchInlineSnapshot(`
       Object {
-        "averageExecutionTime": 660.2645605704683,
+        "averageExecutionTime": 691.2697157512289,
         "categories": Array [
           "cdn",
         ],
@@ -129,8 +129,8 @@ describe('getEntity', () => {
         "homepage": "https://fonts.adobe.com/",
         "name": "Adobe TypeKit",
         "products": Array [],
-        "totalExecutionTime": 78981507,
-        "totalOccurrences": 119621,
+        "totalExecutionTime": 142315844,
+        "totalOccurrences": 205876,
       }
     `)
   })

package/front_end/third_party/third-party-web/package/lib/markdown/template.md

@@ -1,6 +1,4 @@
-# [Third Party Web](https://www.thirdpartyweb.today/)
-
-## Check out the shiny new web UI https://www.thirdpartyweb.today/
+# Third Party Web
 
 Data on third party entities and their impact on the web.
 

package/front_end/third_party/third-party-web/package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "third-party-web",
-  "version": "0.26.2",
+  "version": "0.29.2",
   "description": "Categorized data on third party entities on the web.",
   "main": "./lib/index.js",
   "scripts": {
@@ -23,6 +23,10 @@
     "url": "https://github.com/patrickhulce/third-party-web.git"
   },
   "license": "MIT",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "provenance": true
+  },
   "devDependencies": {
     "@google-cloud/bigquery": "^7.9.0",
     "chart.js": "^2.9.4",
@@ -33,7 +37,7 @@
     "lodash": "^4.17.15",
     "prettier": "^1.18.2",
     "prompts": "^2.4.2",
-    "semantic-release": "^24.2.0"
+    "semantic-release": "^25.0.3"
   },
   "config": {
     "exportAliases": {
@@ -42,5 +46,5 @@
       "httparchive-subset": "./lib/subsets/httparchive.js"
     }
   },
-  "packageManager": "yarn@4.1.1"
+  "packageManager": "yarn@4.10.3"
 }

package/front_end/third_party/third-party-web/package.json

@@ -3,6 +3,6 @@
   "description": "Package list used when building/upgrading third-party-web",
   "private": true,
   "dependencies": {
-    "third-party-web": "0.26.2"
+    "third-party-web": "0.29.2"
   }
 }

package/front_end/ui/components/buttons/floatingButton.css

@@ -27,7 +27,7 @@ button {
     background-color: var(--sys-color-tonal-container);
   }
 
-  :host-context(.theme-with-dark-background) & {
+  :host-context(.theme-with-dark-background) &:not(:disabled) {
     background-color: var(--sys-color-primary);
   }
 
@@ -36,11 +36,11 @@ button {
     height: var(--sys-size-7);
   }
 
-  &:not(:disabled):host-context(:not(.theme-with-dark-background)) & > devtools-icon {
+  :host-context(:not(.theme-with-dark-background)) &:not(:disabled) > devtools-icon {
     color: var(--sys-color-on-tonal-container);
   }
 
-  &:not(:disabled):host-context(.theme-with-dark-background) & > devtools-icon {
+  :host-context(.theme-with-dark-background) &:not(:disabled) > devtools-icon {
     color: var(--sys-color-on-primary);
   }
 

package/front_end/ui/components/lists/list.css

@@ -76,6 +76,8 @@ li {
   pointer-events: none;
   position: absolute;
   right: 0;
+  top: 0;
+  bottom: 0;
 }
 
 .controls-gradient {

package/front_end/ui/legacy/ListWidget.ts

@@ -9,7 +9,7 @@ import './Toolbar.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Platform from '../../core/platform/platform.js';
 import * as Buttons from '../../ui/components/buttons/buttons.js';
-import {html, render} from '../lit/lit.js';
+import {html, nothing, render} from '../lit/lit.js';
 import * as VisualLogging from '../visual_logging/visual_logging.js';
 
 import * as ARIAUtils from './ARIAUtils.js';
@@ -107,6 +107,7 @@ export class ListWidget<T> extends VBox {
   updateItem(index: number, newItem: T, editable: boolean, focusable = true, controlLabels: {
     edit?: string,
     delete?: string,
+    hideEdit?: boolean,
   } = {}): void {
     if (index < 0 || index >= this.#items.length) {
       this.appendItem(newItem, editable, focusable, controlLabels);
@@ -130,7 +131,8 @@ export class ListWidget<T> extends VBox {
     }
   }
 
-  appendItem(item: T, editable: boolean, focusable = true, controlLabels: {edit?: string, delete?: string} = {}): void {
+  appendItem(item: T, editable: boolean, focusable = true,
+             controlLabels: {edit?: string, delete?: string, hideEdit?: boolean} = {}): void {
     if (this.lastSeparator && this.#items.length) {
       const element = document.createElement('div');
       element.classList.add('list-separator');
@@ -204,7 +206,8 @@ export class ListWidget<T> extends VBox {
     this.updatePlaceholder();
   }
 
-  private createControls(item: T, element: HTMLElement, controlLabels: {edit?: string, delete?: string}): Element {
+  private createControls(item: T, element: HTMLElement,
+                         controlLabels: {edit?: string, delete?: string, hideEdit?: boolean}): Element {
     const controls = document.createElement('div');
     controls.classList.add('controls-container');
     controls.classList.add('fill');
@@ -214,12 +217,12 @@ export class ListWidget<T> extends VBox {
       <div class="controls-gradient"></div>
       <div class="controls-buttons">
         <devtools-toolbar>
-          <devtools-button class=toolbar-button
+          ${controlLabels?.hideEdit ? nothing : html`<devtools-button class=toolbar-button
                            .iconName=${'edit'}
                            .jslogContext=${'edit-item'}
                            .title=${controlLabels?.edit ?? i18nString(UIStrings.editString)}
                            .variant=${Buttons.Button.Variant.ICON}
-                           @click=${onEditClicked}></devtools-button>
+                           @click=${onEditClicked}></devtools-button>`}
           <devtools-button class=toolbar-button
                            .iconName=${'bin'}
                            .jslogContext=${'remove-item'}

package/front_end/ui/legacy/TextPrompt.ts

@@ -226,11 +226,12 @@ export class TextPromptElement extends HTMLElement {
   #done(e: Event, commit: boolean): void {
     const target = e.target as HTMLElement;
     const text = target.textContent || '';
-    this.#internals.setValidity({});
     if (commit) {
       const validationMessage = this.#validator?.(text) ?? '';
       if (validationMessage) {
         this.#internals.setValidity({customError: true}, validationMessage, this.#entrypoint);
+      } else {
+        this.#internals.setValidity({});
       }
 
       if (!this.#internals.reportValidity()) {
@@ -239,6 +240,7 @@ export class TextPromptElement extends HTMLElement {
 
       this.dispatchEvent(new TextPromptElement.CommitEvent(text));
     } else {
+      this.#internals.setValidity({});
       this.dispatchEvent(new TextPromptElement.CancelEvent());
     }
     e.consume();
@@ -248,12 +250,13 @@ export class TextPromptElement extends HTMLElement {
     if (event.handled || !(event instanceof KeyboardEvent)) {
       return;
     }
-    this.#internals.setValidity({});
 
     if (event.key === 'Enter') {
       this.#done(event, /* commit=*/ true);
     } else if (Platform.KeyboardUtilities.isEscKey(event)) {
       this.#done(event, /* commit=*/ false);
+    } else {
+      this.#internals.setValidity({});
     }
   }
 

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

@@ -1060,15 +1060,21 @@ export class LinkHandlerSettingUI {
 
   update(): void {
     this.element.removeChildren();
-    const names = [...linkHandlers.keys()];
-    names.unshift(i18nString(UIStrings.auto));
-    for (const name of names) {
+    // Populate the dropdown with extension origins. The first option is the
+    // special "Auto" value which is not a real origin.
+    const origins = [...linkHandlers.keys()];
+    origins.unshift(i18nString(UIStrings.auto));
+    for (const origin of origins) {
       const option = document.createElement('option');
-      option.textContent = name;
-      option.selected = name === Linkifier.linkHandlerSetting().get();
+      const registration = linkHandlers.get(origin);
+      // If the origin has a registered handler, display its user-friendly title.
+      // Otherwise, fallback to the origin string itself (e.g. for the "Auto" option).
+      option.textContent = registration === undefined ? origin : registration.title;
+      option.value = origin;
+      option.selected = origin === Linkifier.linkHandlerSetting().get();
       this.element.appendChild(option);
     }
-    this.element.disabled = names.length <= 1;
+    this.element.disabled = origins.length <= 1;
   }
 
   private onChange(event: Event): void {

package/front_end/ui/legacy/textPrompt.css

@@ -21,6 +21,7 @@
 .text-prompt {
   cursor: text;
   overflow-x: visible;
+  min-width: var(--devtools-text-prompt-min-width, auto);
 }
 
 .text-prompt::-webkit-scrollbar {

package/front_end/ui/visual_logging/KnownContextValues.ts

@@ -4368,6 +4368,7 @@ export const knownContextValues = new Set([
   'ur',
   'url',
   'url-pattern',
+  'url-pattern-warning',
   'usage',
   'usb',
   'use-code-with-caution',

package/package.json

@@ -92,5 +92,5 @@
     "webidl2": "24.5.0",
     "yargs": "17.7.2"
   },
-  "version": "1.0.1650035"
+  "version": "1.0.1650232"
 }

package/front_end/models/stack_trace/ErrorStackParser.ts

@@ -1,174 +0,0 @@
-// Copyright 2022 The Chromium Authors
-// 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 type * as Platform from '../../core/platform/platform.js';
-import type * as SDK from '../../core/sdk/sdk.js';
-import type * as Protocol from '../../generated/protocol.js';
-
-export interface ParsedErrorFrame {
-  line: string;
-  isCallFrame?: boolean;
-  link?: {
-    url: Platform.DevToolsPath.UrlString,
-    prefix: string,
-    suffix: string,
-    enclosedInBraces: boolean,
-    lineNumber?: number,
-    columnNumber?: number,
-    scriptId?: Protocol.Runtime.ScriptId,
-  };
-}
-
-/**
- * Combines the error description (essentially the `Error#stack` property value)
- * with the `issueSummary`.
- *
- * @param description the `description` property of the `Error` remote object.
- * @param issueSummary the optional `issueSummary` of the `exceptionMetaData`.
- * @returns the enriched description.
- * @see https://goo.gle/devtools-reduce-network-noise-design
- */
-export function concatErrorDescriptionAndIssueSummary(description: string, issueSummary: string): string {
-  // Insert the issue summary right after the error message.
-  const pos = description.indexOf('\n');
-  const prefix = pos === -1 ? description : description.substring(0, pos);
-  const suffix = pos === -1 ? '' : description.substring(pos);
-  description = `${prefix}. ${issueSummary}${suffix}`;
-  return description;
-}
-
-/**
- * Takes a V8 Error#stack string and extracts source position information.
- *
- * The result includes the url, line and column number, as well as where
- * the url is found in the raw line.
- *
- * @returns Null if the provided string has an unexpected format. A
- *          populated `ParsedErrorFrame[]` otherwise.
- */
-export function parseSourcePositionsFromErrorStack(
-    runtimeModel: SDK.RuntimeModel.RuntimeModel, stack: string): ParsedErrorFrame[]|null {
-  if (!(/\n\s*at\s/.test(stack) || stack.startsWith('SyntaxError:'))) {
-    return null;
-  }
-  const debuggerModel = runtimeModel.debuggerModel();
-  const baseURL = runtimeModel.target().inspectedURL();
-
-  const lines = stack.split('\n');
-  const linkInfos = [];
-  for (const line of lines) {
-    const match = /^\s*at\s(async\s)?/.exec(line);
-    if (!match) {
-      if (linkInfos.length && linkInfos[linkInfos.length - 1].isCallFrame) {
-        return null;
-      }
-      linkInfos.push({line});
-      continue;
-    }
-
-    const isCallFrame = true;
-    let left = match[0].length;
-    let right = line.length;
-    let enclosedInBraces = false;
-    if (line[right - 1] === ')') {
-      right--;
-      enclosedInBraces = true;
-      left = line.lastIndexOf(' (', right);
-      if (left < 0) {
-        return null;
-      }
-      left += 2;
-      // Relevant in the `eval at ...` case.
-      const newRight = line.indexOf('), ', left);
-      if (newRight > left) {
-        right = newRight;
-      }
-    }
-
-    const linkCandidate = line.substring(left, right);
-    const splitResult = Common.ParsedURL.ParsedURL.splitLineAndColumn(linkCandidate);
-    if (splitResult.url === '<anonymous>') {
-      if (linkInfos.length && linkInfos[linkInfos.length - 1].isCallFrame && !linkInfos[linkInfos.length - 1].link) {
-        // Combine builtin frames.
-        linkInfos[linkInfos.length - 1].line += `\n${line}`;
-      } else {
-        linkInfos.push({line, isCallFrame});
-      }
-      continue;
-    }
-    let url = parseOrScriptMatch(debuggerModel, splitResult.url);
-    if (!url && Common.ParsedURL.ParsedURL.isRelativeURL(splitResult.url)) {
-      url = parseOrScriptMatch(debuggerModel, Common.ParsedURL.ParsedURL.completeURL(baseURL, splitResult.url));
-    }
-    if (!url) {
-      return null;
-    }
-
-    linkInfos.push({
-      line,
-      isCallFrame,
-      link: {
-        url,
-        prefix: line.substring(0, left),
-        suffix: line.substring(right),
-        enclosedInBraces,
-        lineNumber: splitResult.lineNumber,
-        columnNumber: splitResult.columnNumber,
-      },
-    });
-  }
-  return linkInfos;
-}
-
-function parseOrScriptMatch(debuggerModel: SDK.DebuggerModel.DebuggerModel, url: Platform.DevToolsPath.UrlString|null):
-    Platform.DevToolsPath.UrlString|null {
-  if (!url) {
-    return null;
-  }
-  if (Common.ParsedURL.ParsedURL.isValidUrlString(url)) {
-    return url;
-  }
-  if (debuggerModel.scriptsForSourceURL(url).length) {
-    return url;
-  }
-  // nodejs stack traces contain (absolute) file paths, but v8 reports them as file: urls.
-  const fileUrl = new URL(url, 'file://');
-  if (debuggerModel.scriptsForSourceURL(fileUrl.href).length) {
-    return fileUrl.href as Platform.DevToolsPath.UrlString;
-  }
-  return null;
-}
-
-/**
- * Error#stack output only contains script URLs. In some cases we are able to
- * retrieve additional exception details from V8 that we can use to augment
- * the parsed Error#stack with script IDs.
- * This function sets the `scriptId` field in `ParsedErrorFrame` when it finds
- * the corresponding info in `Protocol.Runtime.StackTrace`.
- */
-export function augmentErrorStackWithScriptIds(
-    parsedFrames: ParsedErrorFrame[], protocolStackTrace: Protocol.Runtime.StackTrace): void {
-  // Note that the number of frames between the two stack traces can differ. The
-  // parsed Error#stack can contain Builtin frames which are not present in the protocol
-  // stack. This means its easier to always search the whole protocol stack for a matching
-  // frame rather then trying to detect the Builtin frames and skipping them.
-  for (const parsedFrame of parsedFrames) {
-    const protocolFrame = protocolStackTrace.callFrames.find(frame => framesMatch(parsedFrame, frame));
-    if (protocolFrame && parsedFrame.link) {
-      parsedFrame.link.scriptId = protocolFrame.scriptId;
-    }
-  }
-}
-
-/** Returns true iff both stack frames have the same url and line/column numbers. The function name is ignored */
-function framesMatch(parsedFrame: ParsedErrorFrame, protocolFrame: Protocol.Runtime.CallFrame): boolean {
-  if (!parsedFrame.link) {
-    return false;
-  }
-
-  const {url, lineNumber, columnNumber} = parsedFrame.link;
-  return url === protocolFrame.url && lineNumber === protocolFrame.lineNumber &&
-      columnNumber === protocolFrame.columnNumber;
-}