chrome-devtools-frontend 1.0.1581708 → 1.0.1583146

package/front_end/ui/components/markdown_view/MarkdownLinksMap.ts

@@ -58,9 +58,12 @@ export const markdownLinks = new Map<string, string>([
   ['signatureHeader', 'https://www.rfc-editor.org/rfc/rfc9421.html#name-the-signature-http-field'],
   ['signatureInputHeader', 'https://www.rfc-editor.org/rfc/rfc9421.html#name-the-signature-input-http-fi'],
   ['signatureParameters', 'https://www.rfc-editor.org/rfc/rfc9421.html#name-signature-parameters'],
-  ['sfDictionary', 'https://www.rfc-editor.org/rfc/rfc8941.html#name-dictionaries'],
   ['sfByteSequence', 'https://www.rfc-editor.org/rfc/rfc8941.html#name-byte-sequences'],
+  ['sfDictionary', 'https://www.rfc-editor.org/rfc/rfc8941.html#name-dictionaries'],
   ['sfInnerList', 'https://www.rfc-editor.org/rfc/rfc8941.html#name-inner-lists'],
+  ['sfList', 'https://www.rfc-editor.org/rfc/rfc8941.html#name-lists'],
+  ['sfString', 'https://www.rfc-editor.org/rfc/rfc8941.html#name-strings'],
+  ['sfToken', 'https://www.rfc-editor.org/rfc/rfc8941.html#name-tokens'],
   ['componentParameterSf', 'https://www.rfc-editor.org/rfc/rfc9421.html#name-strict-serialization-of-htt'],
   ['componentParameterReq', 'https://www.rfc-editor.org/rfc/rfc9421.html#content-request-response'],
   [
@@ -74,6 +77,7 @@ export const markdownLinks = new Map<string, string>([
     'https://privacysandbox.com/news/update-on-plans-for-privacy-sandbox-technologies/',
     'https://privacysandbox.com/news/update-on-plans-for-privacy-sandbox-technologies/'
   ],
+  ['urlPatternSpec', 'https://urlpattern.spec.whatwg.org/'],
 ]);
 
 export const getMarkdownLink = (key: string): string => {

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

@@ -18,6 +18,7 @@ import {
   acceptAiAutoCompleteSuggestion,
   aiAutoCompleteSuggestion,
   aiAutoCompleteSuggestionState,
+  AiSuggestionSource,
   hasActiveAiSuggestion,
   setAiAutoCompleteSuggestion,
   showCompletionHint,
@@ -201,6 +202,12 @@ export class AiCodeCompletionProvider {
           if (!this.#aiCodeCompletion || !this.#editor || !hasActiveAiSuggestion(this.#editor.state)) {
             return false;
           }
+          if (this.#editor.state.field(aiAutoCompleteSuggestionState)?.source === AiSuggestionSource.GENERATION) {
+            // If the suggestion is from code generation, we don't want to
+            // dismiss it here. The user should use the code generation
+            // provider's keymap to dismiss the suggestion.
+            return false;
+          }
           this.#editor.dispatch({
             effects: setAiAutoCompleteSuggestion.of(null),
           });
@@ -347,6 +354,7 @@ export class AiCodeCompletionProvider {
               startTime,
               clearCachedRequest: this.clearCache.bind(this),
               onImpression: this.#aiCodeCompletion?.registerUserImpression.bind(this.#aiCodeCompletion),
+              source: AiSuggestionSource.COMPLETION,
             })
           });
         }

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

@@ -19,6 +19,7 @@ import {
   acceptAiAutoCompleteSuggestion,
   aiAutoCompleteSuggestion,
   aiAutoCompleteSuggestionState,
+  AiSuggestionSource,
   hasActiveAiSuggestion,
   setAiAutoCompleteSuggestion,
 } from './config.js';
@@ -159,6 +160,12 @@ export class AiCodeGenerationProvider {
             return false;
           }
           if (hasActiveAiSuggestion(this.#editor.state)) {
+            if (this.#editor.state.field(aiAutoCompleteSuggestionState)?.source === AiSuggestionSource.COMPLETION) {
+              // If the suggestion is from code completion, we don't want to
+              // dismiss it here. The user should use the code completion
+              // provider's keymap to dismiss the suggestion.
+              return false;
+            }
             this.#dismissTeaserAndSuggestion();
             return true;
           }
@@ -341,6 +348,7 @@ export class AiCodeGenerationProvider {
             sampleId: topSample.sampleId,
             startTime,
             onImpression: this.#aiCodeGeneration?.registerUserImpression.bind(this.#aiCodeGeneration),
+            source: AiSuggestionSource.GENERATION,
           }),
           setAiCodeGenerationTeaserMode.of(AiCodeGenerationTeaserMode.ACTIVE)
         ]

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

@@ -483,6 +483,11 @@ export function contentIncludingHint(view: CM.EditorView): string {
 
 export const setAiAutoCompleteSuggestion = CM.StateEffect.define<ActiveSuggestion|null>();
 
+export const enum AiSuggestionSource {
+  COMPLETION = 'completion',
+  GENERATION = 'generation',
+}
+
 export interface ActiveSuggestion {
   text: string;
   from: number;
@@ -491,6 +496,7 @@ export interface ActiveSuggestion {
   startTime: number;
   onImpression: (rpcGlobalId: Host.AidaClient.RpcGlobalId, latency: number, sampleId?: number) => void;
   clearCachedRequest?: () => void;
+  source: AiSuggestionSource;
 }
 
 export const aiAutoCompleteSuggestionState = CM.StateField.define<ActiveSuggestion|null>({

package/front_end/ui/legacy/Toolbar.ts

@@ -835,7 +835,7 @@ export class ToolbarInputElement extends HTMLElement {
 
   item?: ToolbarInput;
   datalist: HTMLDataListElement|null = null;
-  value: string|undefined = undefined;
+  #value: string|undefined = undefined;
   #disabled = false;
 
   connectedCallback(): void {
@@ -862,8 +862,8 @@ export class ToolbarInputElement extends HTMLElement {
           /* shrinkFactor=*/ undefined, tooltip, this.datalist ? this.#onAutocomplete.bind(this) : undefined,
           /* dynamicCompletions=*/ undefined, jslogContext, this);
     }
-    if (this.value) {
-      this.item.setValue(this.value);
+    if (this.#value) {
+      this.item.setValue(this.#value);
     }
     if (this.#disabled) {
       this.item.setEnabled(false);
@@ -894,7 +894,7 @@ export class ToolbarInputElement extends HTMLElement {
       if (this.item && this.item.value() !== newValue) {
         this.item.setValue(newValue, true);
       } else {
-        this.value = newValue;
+        this.#value = newValue;
       }
     } else if (name === 'disabled') {
       this.#disabled = typeof newValue === 'string';
@@ -904,6 +904,14 @@ export class ToolbarInputElement extends HTMLElement {
     }
   }
 
+  get value(): string {
+    return this.item ? this.item.value() : (this.#value ?? '');
+  }
+
+  set value(value: string) {
+    this.setAttribute('value', value);
+  }
+
   set disabled(disabled: boolean) {
     if (disabled) {
       this.setAttribute('disabled', '');
@@ -1321,11 +1329,11 @@ export class ToolbarCheckbox extends ToolbarItem<void> {
   constructor(
       text: Common.UIString.LocalizedString, tooltip?: Common.UIString.LocalizedString,
       listener?: ((arg0: MouseEvent) => void), jslogContext?: string) {
-    const checkboxLabel = CheckboxLabel.create(text, undefined, undefined, jslogContext);
+    // Pass tooltip to CheckboxLabel.create so it's set on the inner input/text elements,
+    // rather than installing it on the wrapper element which causes screen readers to
+    // incorrectly announce it as a group name.
+    const checkboxLabel = CheckboxLabel.create(text, undefined, undefined, jslogContext, undefined, tooltip);
     super(checkboxLabel);
-    if (tooltip) {
-      Tooltip.install(this.element, tooltip);
-    }
     if (listener) {
       this.element.addEventListener('click', listener, false);
     }

package/front_end/ui/legacy/Treeoutline.ts

@@ -1704,7 +1704,7 @@ export class TreeViewElement extends HTMLElementWithLightDOMTemplate {
     super();
     this.#treeOutline.addEventListener(Events.ElementSelected, event => {
       if (event.data instanceof TreeViewTreeElement) {
-        this.dispatchEvent(new TreeViewElement.SelectEvent(event.data.configElement));
+        event.data.listItemElement.dispatchEvent(new TreeViewElement.SelectEvent());
       }
     });
     this.#treeOutline.addEventListener(Events.ElementExpanded, event => {
@@ -1859,9 +1859,9 @@ export class TreeViewElement extends HTMLElementWithLightDOMTemplate {
 }
 
 export namespace TreeViewElement {
-  export class SelectEvent extends CustomEvent<HTMLLIElement> {
-    constructor(detail: HTMLLIElement) {
-      super('select', {detail});
+  export class SelectEvent extends CustomEvent<void> {
+    constructor() {
+      super('select');
     }
   }
 

package/front_end/ui/legacy/UIUtils.ts

@@ -1173,7 +1173,7 @@ export class CheckboxLabel extends HTMLElement {
 
   static create(
       title?: Platform.UIString.LocalizedString, checked?: boolean, subtitle?: Platform.UIString.LocalizedString,
-      jslogContext?: string, small?: boolean): CheckboxLabel {
+      jslogContext?: string, small?: boolean, tooltip?: Platform.UIString.LocalizedString): CheckboxLabel {
     const element = document.createElement('devtools-checkbox');
     element.#checkboxElement.checked = Boolean(checked);
     if (jslogContext) {
@@ -1182,11 +1182,17 @@ export class CheckboxLabel extends HTMLElement {
     }
     if (title !== undefined) {
       element.#textElement.textContent = title;
-      element.#checkboxElement.title = title;
       if (subtitle !== undefined) {
         element.#textElement.createChild('div', 'devtools-checkbox-subtitle').textContent = subtitle;
       }
     }
+    // checkboxElement tooltip: tooltip first, then title (custom tooltip takes precedence for the input)
+    const inputTooltip = tooltip ?? title;
+    if (inputTooltip) {
+      element.#checkboxElement.title = inputTooltip;
+      // Set aria-description for screen reader announcement
+      element.#checkboxElement.setAttribute('aria-description', inputTooltip);
+    }
     element.#checkboxElement.classList.toggle('small', small);
     return element;
   }
@@ -2069,7 +2075,7 @@ export class HTMLElementWithLightDOMTemplate extends HTMLElement {
         HTMLElementWithLightDOMTemplate.patchLitTemplate(value);
         return value;
       }
-      if (Array.isArray(value)) {
+      if (Array.isArray(value) || value instanceof Iterator) {
         return value.map(patchValue);
       }
 
@@ -2187,13 +2193,29 @@ export const bindCheckboxImpl = function(
   };
 };
 
+export type BindToSettingOpts = ((newSettingValue: string) => boolean)|{
+  validator?: (newSettingValue: string) => boolean,
+  jslog?: boolean,
+};
 export const bindToSetting =
     (settingOrName: string|Common.Settings.Setting<boolean|string>|Common.Settings.RegExpSetting,
-     stringValidator?: (newSettingValue: string) => boolean): ReturnType<typeof Directives.ref> => {
+     optionsOrValidator?: BindToSettingOpts): ReturnType<typeof Directives.ref> => {
       const setting = typeof settingOrName === 'string' ?
           Common.Settings.Settings.instance().moduleSetting(settingOrName) :
           settingOrName;
 
+      let stringValidator: ((newSettingValue: string) => boolean)|undefined;
+      let jslog = true;
+      if (typeof optionsOrValidator === 'function') {
+        stringValidator = optionsOrValidator;
+      } else if (optionsOrValidator) {
+        stringValidator = optionsOrValidator.validator;
+        if (optionsOrValidator.jslog !== undefined) {
+          jslog = optionsOrValidator.jslog;
+        }
+      }
+
+      const jslogBuilder = jslog ? VisualLogging.toggle(setting.name).track({change: true}) : null;
       // We can't use `setValue` as the change listener directly, otherwise we won't
       // be able to remove it again.
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -2208,6 +2230,9 @@ export const bindToSetting =
             setting.removeChangeListener(settingChanged);
             return;
           }
+          if (jslogBuilder) {
+            e.setAttribute('jslog', jslogBuilder.toString());
+          }
 
           setting.addChangeListener(settingChanged);
           setValue =
@@ -2223,6 +2248,9 @@ export const bindToSetting =
             return;
           }
 
+          if (jslogBuilder) {
+            e.setAttribute('jslog', jslogBuilder.toString());
+          }
           setting.addChangeListener(settingChanged);
           setValue = bindInput(e as HTMLInputElement, setting.set.bind(setting), (value: string) => {
             try {
@@ -2243,6 +2271,9 @@ export const bindToSetting =
             return;
           }
 
+          if (jslogBuilder) {
+            e.setAttribute('jslog', jslogBuilder.toString());
+          }
           setting.addChangeListener(settingChanged);
           setValue = bindInput(
               e as HTMLInputElement, setting.set.bind(setting), stringValidator ?? (() => true), /* numeric */ false);

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

@@ -96,7 +96,7 @@ function populateContextMenu(link: Element, event: Event): void {
 }
 
 // TODO(crbug.com/456517732): remove when all usages of runtimeStackTrace are migrated.
-export function buildStackTraceRowsForLegacyRuntimeStackTrace(
+function buildStackTraceRowsForLegacyRuntimeStackTrace(
     stackTrace: Protocol.Runtime.StackTrace,
     target: SDK.Target.Target|null,
     linkifier: Linkifier,
@@ -159,7 +159,7 @@ export function buildStackTraceRowsForLegacyRuntimeStackTrace(
   return stackTraceRows;
 }
 
-export function buildStackTraceRows(
+function buildStackTraceRows(
     stackTrace: StackTrace.StackTrace.StackTrace,
     target: SDK.Target.Target|null,
     linkifier: Linkifier,
@@ -189,14 +189,9 @@ export function buildStackTraceRows(
         inlineFrameIndex: 0,
         revealBreakpoint: previousStackFrameWasBreakpointCondition,
       });
-      if (link) {
-        link.setAttribute('jslog', `${VisualLogging.link('stack-trace').track({click: true})}`);
-        link.addEventListener('contextmenu', populateContextMenu.bind(null, link));
+      link.setAttribute('jslog', `${VisualLogging.link('stack-trace').track({click: true})}`);
+      link.addEventListener('contextmenu', populateContextMenu.bind(null, link));
 
-        if (!link.textContent) {
-          link.textContent = i18nString(UIStrings.unknownSource);
-        }
-      }
       stackTraceRows.push({functionName, link});
       previousStackFrameWasBreakpointCondition = [
         SDK.DebuggerModel.COND_BREAKPOINT_SOURCE_URL,
@@ -306,12 +301,12 @@ export interface Options {
   expandable?: boolean;
 }
 
-export interface StackTraceRegularRow {
+interface StackTraceRegularRow {
   functionName: string;
   link: HTMLElement|null;
 }
 
-export interface StackTraceAsyncRow {
+interface StackTraceAsyncRow {
   asyncDescription: string;
 }
 

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

@@ -345,8 +345,7 @@ export class Linkifier extends Common.ObjectWrapper.ObjectWrapper<EventTypes> im
   }
 
   maybeLinkifyStackTraceFrame(
-      target: SDK.Target.Target|null, frame: StackTrace.StackTrace.Frame, options?: LinkifyOptions): HTMLElement|null {
-    let fallbackAnchor: HTMLElement|null = null;
+      target: SDK.Target.Target|null, frame: StackTrace.StackTrace.Frame, options?: LinkifyOptions): HTMLElement {
     const linkifyURLOptions: LinkifyURLOptions = {
       ...options,
       lineNumber: frame.line,
@@ -361,10 +360,8 @@ export class Linkifier extends Common.ObjectWrapper.ObjectWrapper<EventTypes> im
       omitOrigin: options?.omitOrigin,
     };
     const {className = ''} = linkifyURLOptions;
-    if (frame.url) {
-      fallbackAnchor = Linkifier.linkifyURL(frame.url as Platform.DevToolsPath.UrlString, linkifyURLOptions);
-    }
-    if (!target || target.isDisposed()) {
+    const fallbackAnchor = Linkifier.linkifyURL(frame.url as Platform.DevToolsPath.UrlString, linkifyURLOptions);
+    if (!target || target.isDisposed() || !frame.uiSourceCode) {
       return fallbackAnchor;
     }
 
@@ -383,7 +380,7 @@ export class Linkifier extends Common.ObjectWrapper.ObjectWrapper<EventTypes> im
       revealBreakpoint: options?.revealBreakpoint,
     };
 
-    const uiLocation = frame.uiSourceCode?.uiLocation(frame.line, frame.column) ?? null;
+    const uiLocation = frame.uiSourceCode.uiLocation(frame.line, frame.column) ?? null;
     this.updateAnchorFromUILocation(link, linkDisplayOptions, uiLocation);
 
     const anchors = (this.anchorsByTarget.get(target) as Element[]);

package/front_end/ui/visual_logging/KnownContextValues.ts

@@ -1271,6 +1271,7 @@ export const knownContextValues = new Set([
   'device-bound-sessions-empty',
   'device-bound-sessions-preserve-log',
   'device-bound-sessions-request',
+  'device-bound-sessions-root',
   'device-fold',
   'device-frame-enable',
   'device-mode',

package/package.json

@@ -105,5 +105,5 @@
       "flat-cache": "6.1.12"
     }
   },
-  "version": "1.0.1581708"
+  "version": "1.0.1583146"
 }

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

@@ -1 +0,0 @@
-# The provider's client metadata endpoint cannot be found.

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

@@ -1 +0,0 @@
-# Provider's client metadata is invalid.

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

@@ -1 +0,0 @@
-# The response body is empty when fetching the provider's client metadata.

package/front_end/panels/elements/computedStyleSidebarPane.css

@@ -1,18 +0,0 @@
-/*
- * Copyright 2015 The Chromium Authors
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file.
- */
-
-.styles-sidebar-pane-toolbar {
-  border-bottom: 1px solid var(--sys-color-divider);
-  flex-shrink: 0;
-}
-
-.styles-sidebar-computed-style-widget {
-  min-height: auto;
-}
-
-.styles-pane-toolbar {
-  width: 100%;
-}