devtools-tracing 1.0.0

package/lib/front_end/core/platform/ArrayUtilities.ts

@@ -0,0 +1,271 @@
+// Copyright 2020 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+export const removeElement = <T>(array: T[], element: T, firstOnly?: boolean): boolean => {
+  let index = array.indexOf(element);
+  if (index === -1) {
+    return false;
+  }
+  if (firstOnly) {
+    array.splice(index, 1);
+    return true;
+  }
+  for (let i = index + 1, n = array.length; i < n; ++i) {
+    if (array[i] !== element) {
+      array[index++] = array[i];
+    }
+  }
+  array.length = index;
+  return true;
+};
+
+type NumberComparator = (a: number, b: number) => number;
+
+export function swap<T>(array: T[], i1: number, i2: number): void {
+  const temp = array[i1];
+  array[i1] = array[i2];
+  array[i2] = temp;
+}
+
+function partition(
+    array: number[], comparator: NumberComparator, left: number, right: number, pivotIndex: number): number {
+  const pivotValue = array[pivotIndex];
+  swap(array, right, pivotIndex);
+  let storeIndex = left;
+  for (let i = left; i < right; ++i) {
+    if (comparator(array[i], pivotValue) < 0) {
+      swap(array, storeIndex, i);
+      ++storeIndex;
+    }
+  }
+  swap(array, right, storeIndex);
+  return storeIndex;
+}
+
+function quickSortRange(
+    array: number[], comparator: NumberComparator, left: number, right: number, sortWindowLeft: number,
+    sortWindowRight: number): void {
+  if (right <= left) {
+    return;
+  }
+  const pivotIndex = Math.floor(Math.random() * (right - left)) + left;
+  const pivotNewIndex = partition(array, comparator, left, right, pivotIndex);
+  if (sortWindowLeft < pivotNewIndex) {
+    quickSortRange(array, comparator, left, pivotNewIndex - 1, sortWindowLeft, sortWindowRight);
+  }
+  if (pivotNewIndex < sortWindowRight) {
+    quickSortRange(array, comparator, pivotNewIndex + 1, right, sortWindowLeft, sortWindowRight);
+  }
+}
+
+export function sortRange(
+    array: number[], comparator: NumberComparator, leftBound: number, rightBound: number, sortWindowLeft: number,
+    sortWindowRight: number): number[] {
+  if (leftBound === 0 && rightBound === (array.length - 1) && sortWindowLeft === 0 && sortWindowRight >= rightBound) {
+    array.sort(comparator);
+  } else {
+    quickSortRange(array, comparator, leftBound, rightBound, sortWindowLeft, sortWindowRight);
+  }
+  return array;
+}
+export const binaryIndexOf = <T, S>(array: T[], value: S, comparator: (a: S, b: T) => number): number => {
+  const index = lowerBound(array, value, comparator);
+  return index < array.length && comparator(value, array[index]) === 0 ? index : -1;
+};
+
+function mergeOrIntersect<T>(
+    array1: T[], array2: T[], comparator: (a: T, b: T) => number, mergeNotIntersect: boolean): T[] {
+  const result = [];
+  let i = 0;
+  let j = 0;
+  while (i < array1.length && j < array2.length) {
+    const compareValue = comparator(array1[i], array2[j]);
+    if (mergeNotIntersect || !compareValue) {
+      result.push(compareValue <= 0 ? array1[i] : array2[j]);
+    }
+    if (compareValue <= 0) {
+      i++;
+    }
+    if (compareValue >= 0) {
+      j++;
+    }
+  }
+  if (mergeNotIntersect) {
+    while (i < array1.length) {
+      result.push(array1[i++]);
+    }
+    while (j < array2.length) {
+      result.push(array2[j++]);
+    }
+  }
+  return result;
+}
+
+export const intersectOrdered = <T>(array1: T[], array2: T[], comparator: (a: T, b: T) => number): T[] => {
+  return mergeOrIntersect(array1, array2, comparator, false);
+};
+
+export const mergeOrdered = <T>(array1: T[], array2: T[], comparator: (a: T, b: T) => number): T[] => {
+  return mergeOrIntersect(array1, array2, comparator, true);
+};
+
+export const DEFAULT_COMPARATOR = (a: string|number, b: string|number): -1|0|1 => {
+  return a < b ? -1 : (a > b ? 1 : 0);
+};
+
+/**
+ * Returns the index of the element closest to the needle that is equal to or
+ * greater than it. Assumes that the provided array is sorted.
+ *
+ * If no element is found, the right bound is returned.
+ *
+ * Uses the provided comparator function to determine if two items are equal or
+ * if one is greater than the other. If you are working with strings or
+ * numbers, you can use ArrayUtilities.DEFAULT_COMPARATOR. Otherwise, you
+ * should define one that takes the needle element and an element from the
+ * array and returns a positive or negative number to indicate which is greater
+ * than the other.
+ *
+ * When specified, |left| (inclusive) and |right| (exclusive) indices
+ * define the search window.
+ */
+export function lowerBound<T>(
+    array: Uint32Array|Int32Array, needle: T, comparator: (needle: T, b: number) => number, left?: number,
+    right?: number): number;
+export function lowerBound<S, T>(
+    array: S[], needle: T, comparator: (needle: T, b: S) => number, left?: number, right?: number): number;
+export function lowerBound<S, T>(
+    array: readonly S[], needle: T, comparator: (needle: T, b: S) => number, left?: number, right?: number): number;
+export function lowerBound<S, T, A extends S[]>(
+    array: A, needle: T, comparator: (needle: T, b: S) => number, left?: number, right?: number): number {
+  let l = left || 0;
+  let r = right !== undefined ? right : array.length;
+  while (l < r) {
+    const m = (l + r) >> 1;
+    if (comparator(needle, array[m]) > 0) {
+      l = m + 1;
+    } else {
+      r = m;
+    }
+  }
+  return r;
+}
+
+/**
+ * Returns the index of the element closest to the needle that is greater than
+ * it. Assumes that the provided array is sorted.
+ *
+ * If no element is found, the right bound is returned.
+ *
+ * Uses the provided comparator function to determine if two items are equal or
+ * if one is greater than the other. If you are working with strings or
+ * numbers, you can use ArrayUtilities.DEFAULT_COMPARATOR. Otherwise, you
+ * should define one that takes the needle element and an element from the
+ * array and returns a positive or negative number to indicate which is greater
+ * than the other.
+ *
+ * When specified, |left| (inclusive) and |right| (exclusive) indices
+ * define the search window.
+ */
+export function upperBound<T>(
+    array: Uint32Array, needle: T, comparator: (needle: T, b: number) => number, left?: number, right?: number): number;
+export function upperBound<S, T>(
+    array: S[], needle: T, comparator: (needle: T, b: S) => number, left?: number, right?: number): number;
+export function upperBound<S, T, A extends S[]>(
+    array: A, needle: T, comparator: (needle: T, b: S) => number, left?: number, right?: number): number {
+  let l = left || 0;
+  let r = right !== undefined ? right : array.length;
+  while (l < r) {
+    const m = (l + r) >> 1;
+    if (comparator(needle, array[m]) >= 0) {
+      l = m + 1;
+    } else {
+      r = m;
+    }
+  }
+  return r;
+}
+
+const enum NearestSearchStart {
+  BEGINNING = 'BEGINNING',
+  END = 'END',
+}
+/**
+ * Obtains the first or last item in the array that satisfies the predicate function.
+ * So, for example, if the array were arr = [2, 4, 6, 8, 10], and you are looking for
+ * the last item arr[i] such that arr[i] < 5  you would be returned 1, because
+ * array[1] is 4, the last item in the array that satisfies the
+ * predicate function.
+ *
+ * If instead you were looking for the first item in the same array that satisfies
+ * arr[i] > 5 you would be returned 2 because array[2] = 6.
+ *
+ * Please note: this presupposes that the array is already ordered.
+ * This function uses a variation of Binary Search.
+ */
+function nearestIndex<T>(
+    arr: readonly T[], predicate: (arrayItem: T) => boolean, searchStart: NearestSearchStart): number|null {
+  const searchFromEnd = searchStart === NearestSearchStart.END;
+  if (arr.length === 0) {
+    return null;
+  }
+
+  let left = 0;
+  let right = arr.length - 1;
+  let pivot = 0;
+  let matchesPredicate = false;
+  let moveToTheRight = false;
+  let middle = 0;
+  do {
+    middle = left + (right - left) / 2;
+    pivot = searchFromEnd ? Math.ceil(middle) : Math.floor(middle);
+    matchesPredicate = predicate(arr[pivot]);
+    moveToTheRight = matchesPredicate === searchFromEnd;
+    if (moveToTheRight) {
+      left = Math.min(right, pivot + (left === pivot ? 1 : 0));
+    } else {
+      right = Math.max(left, pivot + (right === pivot ? -1 : 0));
+    }
+  } while (right !== left);
+
+  // Special-case: the indexed item doesn't pass the predicate. This
+  // occurs when none of the items in the array are a match for the
+  // predicate.
+  if (!predicate(arr[left])) {
+    return null;
+  }
+  return left;
+}
+
+/**
+ * Obtains the first item in the array that satisfies the predicate function.
+ * So, for example, if the array was arr = [2, 4, 6, 8, 10], and you are looking for
+ * the first item arr[i] such that arr[i] > 5 you would be returned 2, because
+ * array[2] is 6, the first item in the array that satisfies the
+ * predicate function.
+ *
+ * Please note: this presupposes that the array is already ordered.
+ */
+export function nearestIndexFromBeginning<T>(arr: T[], predicate: (arrayItem: T) => boolean): number|null {
+  return nearestIndex(arr, predicate, NearestSearchStart.BEGINNING);
+}
+
+/**
+ * Obtains the last item in the array that satisfies the predicate function.
+ * So, for example, if the array was arr = [2, 4, 6, 8, 10], and you are looking for
+ * the last item arr[i] such that arr[i] < 5 you would be returned 1, because
+ * arr[1] is 4, the last item in the array that satisfies the
+ * predicate function.
+ *
+ * Please note: this presupposes that the array is already ordered.
+ */
+
+export function nearestIndexFromEnd<T>(arr: readonly T[], predicate: (arrayItem: T) => boolean): number|null {
+  return nearestIndex(arr, predicate, NearestSearchStart.END);
+}
+
+/** Type guard for ensuring that `arr` does not contain null or undefined **/
+export function arrayDoesNotContainNullOrUndefined<T>(arr: Array<T|null|undefined>): arr is T[] {
+  return !arr.includes(null) && !arr.includes(undefined);
+}

package/lib/front_end/core/platform/Brand.ts

@@ -0,0 +1,23 @@
+// Copyright 2023 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+/**
+ * Helper type to introduce new branded types.
+ *
+ * `Base` is the underlying data type and `Tag` must be unique symbol/string.
+ *
+ * Usage:
+ * ```ts
+ *   type LineNumber = Brand<number, "LineNumber">;
+ *   type RawUrl = Brand<string, "RawUrl">;
+ * ```
+ *
+ * We purposefully use the string index of `_tag` rather then creating a Symbol
+ * wrapper that would hide if in IDEs and fail build. This means that at build
+ * time if one uses `<branded-var>._tag`, it will build without error and have
+ * potentially having a runtime error. This allows us to have multiple places
+ * where we define the brands and they will overlap. Also a use case for reusing
+ * the type in other downstream projects is simplified.
+ */
+export type Brand<Base, Tag> = Base&{_tag: Tag};

package/lib/front_end/core/platform/Constructor.ts

@@ -0,0 +1,10 @@
+// Copyright 2025 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export type Constructor<T, Args extends any[] = any[]> = new (...args: Args) => T;
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export type AbstractConstructor<T, Args extends any[] = any[]> = (abstract new (...args: Args) => T);
+
+export type ConstructorOrAbstract<T> = Constructor<T>|AbstractConstructor<T>;

package/lib/front_end/core/platform/DOMUtilities.ts

@@ -0,0 +1,138 @@
+// 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.
+
+/**
+ * `document.activeElement` will not enter shadow roots to find the element
+ * that has focus; use this method if you need to traverse through any shadow
+ * roots to find the actual, specific focused element.
+ */
+export function deepActiveElement(doc: Document): Element|null {
+  let activeElement: Element|null = doc.activeElement;
+  while (activeElement?.shadowRoot?.activeElement) {
+    activeElement = activeElement.shadowRoot.activeElement;
+  }
+  return activeElement;
+}
+
+export function getEnclosingShadowRootForNode(node: Node): Node|null {
+  let parentNode = node.parentNodeOrShadowHost();
+  while (parentNode) {
+    if (parentNode instanceof ShadowRoot) {
+      return parentNode;
+    }
+    parentNode = parentNode.parentNodeOrShadowHost();
+  }
+  return null;
+}
+
+export function rangeOfWord(
+    rootNode: Node, offset: number, stopCharacters: string, stayWithinNode: Node, direction?: string): Range {
+  let startNode;
+  let startOffset = 0;
+  let endNode;
+  let endOffset = 0;
+
+  if (!stayWithinNode) {
+    stayWithinNode = rootNode;
+  }
+
+  if (!direction || direction === 'backward' || direction === 'both') {
+    let node: Node|null = rootNode;
+    while (node) {
+      if (node === stayWithinNode) {
+        if (!startNode) {
+          startNode = stayWithinNode;
+        }
+        break;
+      }
+
+      if (node.nodeType === Node.TEXT_NODE && node.nodeValue !== null) {
+        const start = (node === rootNode ? (offset - 1) : (node.nodeValue.length - 1));
+        for (let i = start; i >= 0; --i) {
+          if (stopCharacters.indexOf(node.nodeValue[i]) !== -1) {
+            startNode = node;
+            startOffset = i + 1;
+            break;
+          }
+        }
+      }
+
+      if (startNode) {
+        break;
+      }
+
+      node = node.traversePreviousNode(stayWithinNode);
+    }
+
+    if (!startNode) {
+      startNode = stayWithinNode;
+      startOffset = 0;
+    }
+  } else {
+    startNode = rootNode;
+    startOffset = offset;
+  }
+
+  if (!direction || direction === 'forward' || direction === 'both') {
+    let node: (Node|null)|Node = rootNode;
+    while (node) {
+      if (node === stayWithinNode) {
+        if (!endNode) {
+          endNode = stayWithinNode;
+        }
+        break;
+      }
+
+      if (node.nodeType === Node.TEXT_NODE && node.nodeValue !== null) {
+        const start = (node === rootNode ? offset : 0);
+        for (let i = start; i < node.nodeValue.length; ++i) {
+          if (stopCharacters.indexOf(node.nodeValue[i]) !== -1) {
+            endNode = node;
+            endOffset = i;
+            break;
+          }
+        }
+      }
+
+      if (endNode) {
+        break;
+      }
+
+      node = node.traverseNextNode(stayWithinNode);
+    }
+
+    if (!endNode) {
+      endNode = stayWithinNode;
+      endOffset = stayWithinNode.nodeType === Node.TEXT_NODE ? stayWithinNode.nodeValue?.length || 0 :
+                                                               stayWithinNode.childNodes.length;
+    }
+  } else {
+    endNode = rootNode;
+    endOffset = offset;
+  }
+
+  if (!rootNode.ownerDocument) {
+    throw new Error('No `ownerDocument` found for rootNode');
+  }
+  const result = rootNode.ownerDocument.createRange();
+  result.setStart(startNode, startOffset);
+  result.setEnd(endNode, endOffset);
+
+  return result;
+}
+
+/**
+ * Appends the list of `styles` as individual `<style>` elements to the
+ * given `node`.
+ *
+ * @param node the `Node` to append the `<style>` elements to.
+ * @param styles an optional list of styles to append to the `node`.
+ */
+export function appendStyle(node: Node, ...styles: CSSInJS[]): void {
+  for (const cssText of styles) {
+    const style = (node.ownerDocument ?? document).createElement('style');
+    style.textContent = cssText;
+    node.appendChild(style);
+  }
+}

package/lib/front_end/core/platform/DateUtilities.ts

@@ -0,0 +1,15 @@
+// Copyright 2020 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+export const isValid = (date: Date): boolean => {
+  return !isNaN(date.getTime());
+};
+
+export const toISO8601Compact = (date: Date): string => {
+  function leadZero(x: number): string {
+    return (x > 9 ? '' : '0') + x;
+  }
+  return date.getFullYear() + leadZero(date.getMonth() + 1) + leadZero(date.getDate()) + 'T' +
+      leadZero(date.getHours()) + leadZero(date.getMinutes()) + leadZero(date.getSeconds());
+};

package/lib/front_end/core/platform/DevToolsPath.ts

@@ -0,0 +1,53 @@
+// Copyright 2021 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import type {Brand} from './Brand.js';
+
+/**
+ * URLs are in DevTools are repsented as encoded URL strings.
+ *
+ * @example 'file:///Hello%20World/file/js'
+ */
+export type UrlString = Brand<string, 'UrlString'>;
+export const EmptyUrlString = '' as UrlString;
+
+/**
+ * Tagged template helper to construct `UrlString`s in a more readable form,
+ * without having to sprinkle casts throughout the codebase. Primarily useful
+ * for writing unit tests.
+ *
+ * Usage:
+ * ```js
+ * const url1 = urlString`https://www.example.com/404.html`;
+ * const url2 = urlString`http://${host}/path/to/file.js`;
+ * ```
+ *
+ * This is implemented as a wrapper around `String.raw` for convenience. This
+ * function doesn't perform any kind of validation that the returned string is
+ * really a valid `UrlString`.
+ *
+ * @param strings the string parts of the template.
+ * @param values the dynamic values of the template.
+ * @returns the string constructed from `strings` and `values` casted to an
+ *         `UrlString`.
+ */
+export const urlString = (strings: ArrayLike<string>, ...values: any[]): UrlString =>
+    String.raw({raw: strings}, ...values) as UrlString;
+
+/**
+ * File paths in DevTools that are represented as unencoded absolute
+ * or relative paths.
+ *
+ * @example '/Hello World/file.js'
+ */
+export type RawPathString = Brand<string, 'RawPathString'>;
+export const EmptyRawPathString = '' as RawPathString;
+
+/**
+ * File paths in DevTools that are represented as encoded paths.
+ *
+ * @example '/Hello%20World/file.js'
+ */
+export type EncodedPathString = Brand<string, 'EncodedPathString'>;
+export const EmptyEncodedPathString = '' as EncodedPathString;

package/lib/front_end/core/platform/KeyboardUtilities.ts

@@ -0,0 +1,38 @@
+// Copyright 2020 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+export const enum ArrowKey {
+  UP = 'ArrowUp',
+  DOWN = 'ArrowDown',
+  LEFT = 'ArrowLeft',
+  RIGHT = 'ArrowRight',
+}
+
+export const enum PageKey {
+  UP = 'PageUp',
+  DOWN = 'PageDown',
+}
+
+export const ENTER_KEY = 'Enter';
+export const ESCAPE_KEY = 'Escape';
+export const TAB_KEY = 'Tab';
+
+export const ARROW_KEYS = new Set<ArrowKey>([
+  ArrowKey.UP,
+  ArrowKey.DOWN,
+  ArrowKey.LEFT,
+  ArrowKey.RIGHT,
+]);
+
+export function keyIsArrowKey(key: string): key is ArrowKey {
+  return ARROW_KEYS.has(key as ArrowKey);
+}
+
+export function isEscKey(event: KeyboardEvent): boolean {
+  return event.key === 'Escape';
+}
+
+export function isEnterOrSpaceKey(event: KeyboardEvent): boolean {
+  return event.key === 'Enter' || event.key === ' ';
+}

package/lib/front_end/core/platform/MapUtilities.ts

@@ -0,0 +1,95 @@
+// Copyright 2020 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+export const inverse = function<K, V>(map: Map<K, V>): Multimap<V, K> {
+  const result = new Multimap<V, K>();
+  for (const [key, value] of map.entries()) {
+    result.set(value, key);
+  }
+  return result;
+};
+
+export class Multimap<K, V> {
+  private map = new Map<K, Set<V>>();
+
+  set(key: K, value: V): void {
+    let set = this.map.get(key);
+    if (!set) {
+      set = new Set();
+      this.map.set(key, set);
+    }
+    set.add(value);
+  }
+
+  get(key: K): Set<V> {
+    return this.map.get(key) || new Set();
+  }
+
+  has(key: K): boolean {
+    return this.map.has(key);
+  }
+
+  hasValue(key: K, value: V): boolean {
+    const set = this.map.get(key);
+    if (!set) {
+      return false;
+    }
+    return set.has(value);
+  }
+
+  get size(): number {
+    return this.map.size;
+  }
+
+  delete(key: K, value: V): boolean {
+    const values = this.get(key);
+    if (!values) {
+      return false;
+    }
+    const result = values.delete(value);
+    if (!values.size) {
+      this.map.delete(key);
+    }
+    return result;
+  }
+
+  deleteAll(key: K): void {
+    this.map.delete(key);
+  }
+
+  keysArray(): K[] {
+    return [...this.map.keys()];
+  }
+
+  keys(): IterableIterator<K> {
+    return this.map.keys();
+  }
+
+  valuesArray(): V[] {
+    const result = [];
+    for (const set of this.map.values()) {
+      result.push(...set.values());
+    }
+    return result;
+  }
+
+  clear(): void {
+    this.map.clear();
+  }
+}
+
+/**
+ * Gets value for key, assigning a default if value is falsy.
+ */
+// eslint-disable-next-line @typescript-eslint/no-empty-object-type
+export function getWithDefault<K extends {}, V>(
+    map: WeakMap<K, V>|Map<K, V>, key: K, defaultValueFactory: (key?: K) => V): V {
+  let value = map.get(key);
+  if (value === undefined || value === null) {
+    value = defaultValueFactory(key);
+    map.set(key, value);
+  }
+
+  return value;
+}