chrome-devtools-frontend 1.0.1585664 → 1.0.1586699

package/front_end/core/common/Srcset.ts

@@ -0,0 +1,61 @@
+// Copyright 2026 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 TokenType {
+  LITERAL = 0,
+  URL = 1
+}
+
+export interface Token {
+  type: TokenType;
+  value: string;
+}
+
+/**
+ * Parsing of
+ * https://html.spec.whatwg.org/multipage/images.html#srcset-attribute and href
+ * attributes to identify URLs vs other text in the srcset.
+ *
+ * Note: this is probably not spec compliant.
+ */
+export function parseSrcset(value: string): Token[] {
+  const result: Token[] = [];
+  let i = 0;
+  while (value.length) {
+    if (i++ > 0) {
+      result.push({value: ' ', type: TokenType.LITERAL});
+    }
+    value = value.trim();
+    let url = '';
+    let descriptor = '';
+    const indexOfSpace = value.search(/\s/);
+    if (indexOfSpace === -1) {
+      url = value;
+    } else if (indexOfSpace > 0 && value[indexOfSpace - 1] === ',') {
+      url = value.substring(0, indexOfSpace);
+    } else {
+      url = value.substring(0, indexOfSpace);
+      const indexOfComma = value.indexOf(',', indexOfSpace);
+      if (indexOfComma !== -1) {
+        descriptor = value.substring(indexOfSpace, indexOfComma + 1);
+      } else {
+        descriptor = value.substring(indexOfSpace);
+      }
+    }
+
+    if (url) {
+      if (url.endsWith(',')) {
+        result.push({value: url.substring(0, url.length - 1), type: TokenType.URL});
+        result.push({type: TokenType.LITERAL, value: ','});
+      } else {
+        result.push({value: url, type: TokenType.URL});
+      }
+    }
+    if (descriptor) {
+      result.push({type: TokenType.LITERAL, value: descriptor});
+    }
+    value = value.substring(url.length + descriptor.length);
+  }
+  return result;
+}

package/front_end/core/common/common.ts

@@ -29,6 +29,7 @@ import * as SegmentedRange from './SegmentedRange.js';
 import * as SettingRegistration from './SettingRegistration.js';
 import * as Settings from './Settings.js';
 import * as SimpleHistoryManager from './SimpleHistoryManager.js';
+import * as Srcset from './Srcset.js';
 import * as StringOutputStream from './StringOutputStream.js';
 import * as TextDictionary from './TextDictionary.js';
 import * as Throttler from './Throttler.js';
@@ -68,6 +69,7 @@ export {
   SettingRegistration,
   Settings,
   SimpleHistoryManager,
+  Srcset,
   StringOutputStream,
   TextDictionary,
   Throttler,

package/front_end/models/ai_assistance/AiConversation.ts

@@ -456,16 +456,20 @@ Time: ${micros(time)}`;
         },
         options.multimodalInput,
         )) {
+      // Add to history if relevant
       if (shouldAddToHistory(data)) {
         void this.addHistoryItem(data);
       }
+      // Always yield the data
+      yield data;
+
+      // If we change the context
+      // requery with the specialized agent.
       if (data.type === ResponseType.CONTEXT_CHANGE) {
         this.setContext(data.context);
         yield* this.#runAgent(initialQuery, options);
         return;
       }
-
-      yield data;
     }
   }
 

package/front_end/models/javascript_metadata/NativeFunctions.js

@@ -6624,8 +6624,8 @@ export const NativeFunctions = [
     signatures: [["type","?eventInitDict"]]
   },
   {
-    name: "setFormControlRange",
-    signatures: [["element","start","end"]]
+    name: "getValueRange",
+    signatures: [["start","end"]]
   },
   {
     name: "getBoxQuads",

package/front_end/panels/ai_assistance/AiAssistancePanel.ts

@@ -1621,6 +1621,7 @@ export class AiAssistancePanel extends UI.Panel.Panel {
             this.#handleConversationContextChange(data.context);
             step.isLoading = false;
             commitStep();
+            step = {isLoading: true};
 
             break;
           }

package/front_end/panels/console/PromptBuilder.ts

@@ -9,6 +9,7 @@ import * as Formatter from '../../models/formatter/formatter.js';
 import * as Logs from '../../models/logs/logs.js';
 import * as TextUtils from '../../models/text_utils/text_utils.js';
 import * as Components from '../../ui/legacy/components/utils/utils.js';
+import * as UI from '../../ui/legacy/legacy.js';
 
 import type {ConsoleViewMessage} from './ConsoleViewMessage.js';
 
@@ -85,7 +86,7 @@ export class PromptBuilder {
 
     const relatedCode = sourceCode?.text ? formatRelatedCode(sourceCode) : '';
     const relatedRequest = request ? formatNetworkRequest(request) : '';
-    const stacktrace = sourcesTypes.includes(SourceType.STACKTRACE) ? formatStackTrace(this.#consoleMessage) : '';
+    const stacktrace = sourcesTypes.includes(SourceType.STACKTRACE) ? await formatStackTrace(this.#consoleMessage) : '';
 
     const message = formatConsoleMessage(this.#consoleMessage);
 
@@ -290,14 +291,25 @@ export function formatConsoleMessage(message: ConsoleViewMessage): string {
  * This formats the stacktrace from the console message which might or might not
  * match the content of stacktrace(s) in the console message arguments.
  */
-export function formatStackTrace(message: ConsoleViewMessage): string {
+async function formatStackTrace(message: ConsoleViewMessage): Promise<string> {
   const previewContainer = message.contentElement().querySelector('.stack-preview-container');
 
   if (!previewContainer) {
     return '';
   }
 
-  const preview = previewContainer.shadowRoot?.querySelector('.stack-preview-container') as HTMLElement;
+  const widget =
+      UI.Widget.Widget.get(previewContainer) as Components.JSPresentationUtils.StackTracePreviewContent | undefined;
+  if (!widget) {
+    return '';
+  }
+
+  await widget.updateComplete;
+
+  // TODO(crbug.com/433162438): Get the `StackTrace` from the widget and render that instead
+  //    of crawling the DOM. `StackTrace` is source mapped and has ignore listing.
+
+  const preview = widget.contentElement.querySelector('.stack-preview-container') as HTMLElement;
 
   const nodes = preview.childTextNodes();
   // Gets application-level source mapped stack trace taking the ignore list

package/front_end/panels/elements/ElementsTreeElement.ts

@@ -634,64 +634,12 @@ function renderTitle(
   }
 }
 
-const enum SrcsetTokenType {
-  LITERAL = 0,
-  LINK = 1
-}
-
-interface SrcsetToken {
-  type: SrcsetTokenType;
-  value: string;
-}
-
-// FIXME: find a home for this in SDK.
-function parseSrcset(value: string): SrcsetToken[] {
-  const result: SrcsetToken[] = [];
-  let i = 0;
-  while (value.length) {
-    if (i++ > 0) {
-      result.push({value: ' ', type: SrcsetTokenType.LITERAL});
-    }
-    value = value.trim();
-    let url = '';
-    let descriptor = '';
-    const indexOfSpace = value.search(/\s/);
-    if (indexOfSpace === -1) {
-      url = value;
-    } else if (indexOfSpace > 0 && value[indexOfSpace - 1] === ',') {
-      url = value.substring(0, indexOfSpace);
-    } else {
-      url = value.substring(0, indexOfSpace);
-      const indexOfComma = value.indexOf(',', indexOfSpace);
-      if (indexOfComma !== -1) {
-        descriptor = value.substring(indexOfSpace, indexOfComma + 1);
-      } else {
-        descriptor = value.substring(indexOfSpace);
-      }
-    }
-
-    if (url) {
-      if (url.endsWith(',')) {
-        result.push({value: url.substring(0, url.length - 1), type: SrcsetTokenType.LINK});
-        result.push({type: SrcsetTokenType.LITERAL, value: ','});
-      } else {
-        result.push({value: url, type: SrcsetTokenType.LINK});
-      }
-    }
-    if (descriptor) {
-      result.push({type: SrcsetTokenType.LITERAL, value: descriptor});
-    }
-    value = value.substring(url.length + descriptor.length);
-  }
-  return result;
-}
-
-function renderLinkifiedSrcset(tokens: SrcsetToken[], node: SDK.DOMModel.DOMNode): Lit.TemplateResult {
+function renderLinkifiedSrcset(tokens: Common.Srcset.Token[], node: SDK.DOMModel.DOMNode): Lit.TemplateResult {
   return html`${repeat(tokens, token => {
     switch (token.type) {
-      case SrcsetTokenType.LINK:
+      case Common.Srcset.TokenType.URL:
         return renderLinkifiedValue(token.value, node);
-      case SrcsetTokenType.LITERAL:
+      case Common.Srcset.TokenType.LITERAL:
         return token.value;
     }
   })}`;
@@ -849,7 +797,7 @@ function renderAttribute(
                         Boolean(updateRecord?.isAttributeModified(name) && hasText),
                         DOM_UPDATE_ANIMATION_CLASS_NAME)} ${valueRelationRefDirective} ${withEntitiesRef}>
                         ${valueType === ValueType.SRC ? renderLinkifiedValue(value, node) : nothing}
-                        ${valueType === ValueType.SRCSET ? renderLinkifiedSrcset(parseSrcset(value), node) : nothing}
+                        ${valueType === ValueType.SRCSET ? renderLinkifiedSrcset(Common.Srcset.parseSrcset(value), node) : nothing}
                 </span>"` :
                 nothing}</span>`;
   // clang-format on

package/front_end/panels/network/components/RequestHeadersView.ts

@@ -195,6 +195,7 @@ export class RequestHeadersView extends LegacyWrapper.LegacyWrapper.WrappableCom
       // clang-format off
       render(html`
         <style>${requestHeadersViewStyles}</style>
+        <style>${Input.checkboxStyles}</style>
         ${this.#renderGeneralSection()}
         ${this.#renderEarlyHintsHeaders()}
         ${this.#renderResponseHeaders()}
@@ -216,31 +217,22 @@ export class RequestHeadersView extends LegacyWrapper.LegacyWrapper.WrappableCom
     };
 
     // Disabled until https://crbug.com/1079231 is fixed.
-    // clang-format off
-    return html`
-      <devtools-request-headers-category
-        @togglerawevent=${toggleShowRaw}
-        .data=${{
-        name: 'early-hints-headers',
-        title: i18nString(UIStrings.earlyHintsHeaders),
-        headerCount: this.#request.earlyHintsHeaders.length,
-        checked: undefined,
-        additionalContent: undefined,
-        forceOpen: this.#toReveal?.section === NetworkForward.UIRequestLocation.UIHeaderSection.EARLY_HINTS,
-        loggingContext: 'early-hints-headers',
-      } as CategoryData}
-        aria-label=${i18nString(UIStrings.earlyHintsHeaders)}
-      >
-        ${this.#showResponseHeadersText ?
-        this.#renderRawHeaders(this.#request.responseHeadersText, true) : html`
+    return renderCategory({
+      onToggleRawHeaders: toggleShowRaw,
+      name: 'early-hints-headers',
+      title: i18nString(UIStrings.earlyHintsHeaders),
+      headerCount: this.#request.earlyHintsHeaders.length,
+      checked: undefined,
+      additionalContent: undefined,
+      forceOpen: this.#toReveal?.section === NetworkForward.UIRequestLocation.UIHeaderSection.EARLY_HINTS,
+      loggingContext: 'early-hints-headers',
+      contents: this.#showResponseHeadersText ? this.#renderRawHeaders(this.#request.responseHeadersText, true) : html`
           <devtools-early-hints-header-section .data=${{
-            request: this.#request,
-            toReveal: this.#toReveal,
-          } as ResponseHeaderSectionData}></devtools-early-hints-header-section>
-        `}
-      </devtools-request-headers-category>
-    `;
-    // clang-format on
+        request: this.#request,
+        toReveal: this.#toReveal,
+      } as ResponseHeaderSectionData}></devtools-early-hints-header-section>
+        `
+    });
   }
 
   #renderResponseHeaders(): Lit.LitTemplate {
@@ -253,32 +245,25 @@ export class RequestHeadersView extends LegacyWrapper.LegacyWrapper.WrappableCom
       void this.render();
     };
 
-    // Disabled until https://crbug.com/1079231 is fixed.
-    // clang-format off
-    return html`
-      <devtools-request-headers-category
-        @togglerawevent=${toggleShowRaw}
-        .data=${{
-          name: 'response-headers',
-          title: i18nString(UIStrings.responseHeaders),
-          headerCount: this.#request.sortedResponseHeaders.length,
-          checked: this.#request.responseHeadersText ? this.#showResponseHeadersText : undefined,
-          additionalContent: this.#renderHeaderOverridesLink(),
-          forceOpen: this.#toReveal?.section === NetworkForward.UIRequestLocation.UIHeaderSection.RESPONSE,
-          loggingContext: 'response-headers',
-        } as CategoryData}
-        aria-label=${i18nString(UIStrings.responseHeaders)}
-      >
-        ${this.#showResponseHeadersText ?
-            this.#renderRawHeaders(this.#request.responseHeadersText, true) : html`
+    return renderCategory({
+      onToggleRawHeaders: toggleShowRaw,
+      name: 'response-headers',
+      title: i18nString(UIStrings.responseHeaders),
+      headerCount: this.#request.sortedResponseHeaders.length,
+      checked: this.#request.responseHeadersText ? this.#showResponseHeadersText : undefined,
+      additionalContent: this.#renderHeaderOverridesLink(),
+      forceOpen: this.#toReveal?.section === NetworkForward.UIRequestLocation.UIHeaderSection.RESPONSE,
+      loggingContext: 'response-headers',
+      contents: this.#showResponseHeadersText ?
+          this.#renderRawHeaders(this.#request.responseHeadersText, true) :
+          html`
           <devtools-response-header-section .data=${{
             request: this.#request,
             toReveal: this.#toReveal,
-          } as ResponseHeaderSectionData} jslog=${VisualLogging.section('response-headers')}></devtools-response-header-section>
-        `}
-      </devtools-request-headers-category>
-    `;
-    // clang-format on
+          } as ResponseHeaderSectionData} jslog=${
+              VisualLogging.section('response-headers')}></devtools-response-header-section>
+        `
+    });
   }
 
   #renderHeaderOverridesLink(): Lit.LitTemplate {
@@ -348,31 +333,22 @@ export class RequestHeadersView extends LegacyWrapper.LegacyWrapper.WrappableCom
       void this.render();
     };
 
-    // Disabled until https://crbug.com/1079231 is fixed.
-    // clang-format off
-    return html`
-      <devtools-request-headers-category
-        @togglerawevent=${toggleShowRaw}
-        .data=${{
-          name: 'request-headers',
-          title: i18nString(UIStrings.requestHeaders),
-          headerCount: this.#request.requestHeaders().length,
-          checked: requestHeadersText? this.#showRequestHeadersText : undefined,
-          forceOpen: this.#toReveal?.section === NetworkForward.UIRequestLocation.UIHeaderSection.REQUEST,
-          loggingContext: 'request-headers',
-        } as CategoryData}
-        aria-label=${i18nString(UIStrings.requestHeaders)}
-      >
-        ${(this.#showRequestHeadersText && requestHeadersText) ?
-            this.#renderRawHeaders(requestHeadersText, false) : html`
+    return renderCategory({
+      onToggleRawHeaders: toggleShowRaw,
+      name: 'request-headers',
+      title: i18nString(UIStrings.requestHeaders),
+      headerCount: this.#request.requestHeaders().length,
+      checked: requestHeadersText ? this.#showRequestHeadersText : undefined,
+      forceOpen: this.#toReveal?.section === NetworkForward.UIRequestLocation.UIHeaderSection.REQUEST,
+      loggingContext: 'request-headers',
+      contents: (this.#showRequestHeadersText && requestHeadersText) ?
+          this.#renderRawHeaders(requestHeadersText, false) :
+          html`
           <devtools-widget .widgetConfig=${UI.Widget.widgetConfig(RequestHeaderSection, {
             request: this.#request,
             toReveal: this.#toReveal,
-          })} jslog=${VisualLogging.section('request-headers')}></devtools-widget>
-        `}
-      </devtools-request-headers-category>
-    `;
-    // clang-format on
+          })} jslog=${VisualLogging.section('request-headers')}></devtools-widget>`
+    });
   }
 
   #renderRawHeaders(rawHeadersText: string, forResponseHeaders: boolean): Lit.TemplateResult {
@@ -466,19 +442,13 @@ export class RequestHeadersView extends LegacyWrapper.LegacyWrapper.WrappableCom
 
     const statusText = [this.#request.statusCode, this.#request.getInferredStatusText(), comment].join(' ');
 
-    // Disabled until https://crbug.com/1079231 is fixed.
-    // clang-format off
-    return html`
-      <devtools-request-headers-category
-        .data=${{
-          name: 'general',
-          title: i18nString(UIStrings.general),
-          forceOpen: this.#toReveal?.section === NetworkForward.UIRequestLocation.UIHeaderSection.GENERAL,
-          loggingContext: 'general',
-        } as CategoryData}
-        aria-label=${i18nString(UIStrings.general)}
-      >
-      <div jslog=${VisualLogging.section('general')}>
+    return renderCategory({
+      name: 'general',
+      title: i18nString(UIStrings.general),
+      forceOpen: this.#toReveal?.section === NetworkForward.UIRequestLocation.UIHeaderSection.GENERAL,
+      loggingContext: 'general',
+      // clang-format off
+          contents: html`<div jslog=${VisualLogging.section('general')}>
         ${this.#renderGeneralRow(i18nString(UIStrings.requestUrl), this.#request.url(), 'request-url')}
         ${this.#request.statusCode? this.#renderGeneralRow(i18nString(UIStrings.requestMethod),
             this.#request.requestMethod, 'request-method') : Lit.nothing}
@@ -488,9 +458,7 @@ export class RequestHeadersView extends LegacyWrapper.LegacyWrapper.WrappableCom
             this.#request.remoteAddress(), 'remote-address') : Lit.nothing}
         ${this.#request.referrerPolicy()? this.#renderGeneralRow(i18nString(UIStrings.referrerPolicy),
             String(this.#request.referrerPolicy()), 'referrer-policy') : Lit.nothing}
-      </div>
-      </devtools-request-headers-category>
-    `;
+      </div>`});
     // clang-format on
   }
 
@@ -522,87 +490,53 @@ export class RequestHeadersView extends LegacyWrapper.LegacyWrapper.WrappableCom
   }
 }
 
-export class ToggleRawHeadersEvent extends Event {
-  static readonly eventName = 'togglerawevent';
-
-  constructor() {
-    super(ToggleRawHeadersEvent.eventName, {});
-  }
-}
-
-export interface CategoryData {
-  name: string;
-  title: Common.UIString.LocalizedString;
-  headerCount?: number;
-  checked?: boolean;
-  additionalContent?: Lit.LitTemplate;
-  forceOpen?: boolean;
-  loggingContext: string;
-}
-
-export class Category extends HTMLElement {
-  readonly #shadow = this.attachShadow({mode: 'open'});
-  #expandedSetting?: Common.Settings.Setting<boolean>;
-  #title: Common.UIString.LocalizedString = Common.UIString.LocalizedEmptyString;
-  #headerCount?: number = undefined;
-  #checked: boolean|undefined = undefined;
-  #additionalContent: Lit.LitTemplate|undefined = undefined;
-  #forceOpen: boolean|undefined = undefined;
-  #loggingContext = '';
-
-  set data(data: CategoryData) {
-    this.#title = data.title;
-    this.#expandedSetting =
-        Common.Settings.Settings.instance().createSetting('request-info-' + data.name + '-category-expanded', true);
-    this.#headerCount = data.headerCount;
-    this.#checked = data.checked;
-    this.#additionalContent = data.additionalContent;
-    this.#forceOpen = data.forceOpen;
-    this.#loggingContext = data.loggingContext;
-    this.#render();
-  }
-
-  #onCheckboxToggle(): void {
-    this.dispatchEvent(new ToggleRawHeadersEvent());
-  }
-
-  #render(): void {
-    const isOpen = (this.#expandedSetting ? this.#expandedSetting.get() : true) || this.#forceOpen;
-    // Disabled until https://crbug.com/1079231 is fixed.
-    // clang-format off
-    render(html`
-      <style>${requestHeadersViewStyles}</style>
-      <style>${Input.checkboxStyles}</style>
-      <details ?open=${isOpen} @toggle=${this.#onToggle}>
+function renderCategory(data: {
+  name: string,
+  title: Common.UIString.LocalizedString,
+  contents: Lit.LitTemplate,
+  loggingContext: string,
+  headerCount?: number,
+  checked?: boolean,
+  additionalContent?: Lit.LitTemplate,
+  forceOpen?: boolean,
+  onToggleRawHeaders?: () => void,
+}): Lit.LitTemplate {
+  const expandedSetting =
+      Common.Settings.Settings.instance().createSetting('request-info-' + data.name + '-category-expanded', true);
+
+  const isOpen = (expandedSetting ? expandedSetting.get() : true) || data.forceOpen;
+  // Disabled until https://crbug.com/1079231 is fixed.
+  // clang-format off
+  return html`
+      <details ?open=${isOpen} @toggle=${onToggle} aria-label=${data.title}>
         <summary
           class="header"
-          @keydown=${this.#onSummaryKeyDown}
-          jslog=${VisualLogging.sectionHeader().track({click: true}).context(this.#loggingContext)}
+          @keydown=${onSummaryKeyDown}
+          jslog=${VisualLogging.sectionHeader().track({click: true}).context(data.loggingContext)}
         >
           <div class="header-grid-container">
             <div>
-              ${this.#title}${this.#headerCount !== undefined ?
-                html`<span class="header-count"> (${this.#headerCount})</span>` :
+              ${data.title}${data.headerCount !== undefined ?
+                html`<span class="header-count"> (${data.headerCount})</span>` :
                 Lit.nothing
               }
             </div>
             <div class="hide-when-closed">
-              ${this.#checked !== undefined ? html`
-                <devtools-checkbox .checked=${this.#checked} @change=${this.#onCheckboxToggle}
+              ${data.checked !== undefined ? html`
+                <devtools-checkbox .checked=${data.checked} @change=${data.onToggleRawHeaders}
                          jslog=${VisualLogging.toggle('raw-headers').track({change: true})}>
                   ${i18nString(UIStrings.raw)}
               </devtools-checkbox>` : Lit.nothing}
             </div>
-            <div class="hide-when-closed">${this.#additionalContent}</div>
+            <div class="hide-when-closed">${data.additionalContent}</div>
           </div>
         </summary>
-        <slot></slot>
+        ${data.contents}
       </details>
-    `, this.#shadow, {host: this});
-    // clang-format on
-  }
+    `;
+  // clang-format on
 
-  #onSummaryKeyDown(event: KeyboardEvent): void {
+  function onSummaryKeyDown(event: KeyboardEvent): void {
     if (!event.target) {
       return;
     }
@@ -621,17 +555,15 @@ export class Category extends HTMLElement {
     }
   }
 
-  #onToggle(event: Event): void {
-    this.#expandedSetting?.set((event.target as HTMLDetailsElement).open);
+  function onToggle(event: Event): void {
+    expandedSetting?.set((event.target as HTMLDetailsElement).open);
   }
 }
 
 customElements.define('devtools-request-headers', RequestHeadersView);
-customElements.define('devtools-request-headers-category', Category);
 
 declare global {
   interface HTMLElementTagNameMap {
     'devtools-request-headers': RequestHeadersView;
-    'devtools-request-headers-category': Category;
   }
 }

package/front_end/panels/sources/CallStackSidebarPane.ts

@@ -253,15 +253,12 @@ export class CallStackSidebarPane extends UI.View.SimpleView implements UI.Conte
 
     let {maxAsyncStackChainDepth} = this;
     let hasMore = false;
-    let previousFragment: StackTrace.StackTrace.Fragment = this.#stackTrace.syncFragment;
     for (const asyncFragment of this.#stackTrace.asyncFragments) {
-      items.push(Item.createForAsyncHeader(asyncFragment, previousFragment));
+      items.push(Item.createForAsyncHeader(this.#stackTrace, asyncFragment));
       for (const frame of asyncFragment.frames) {
         items.push(Item.createForFrame(frame));
       }
 
-      previousFragment = asyncFragment;
-
       if (--maxAsyncStackChainDepth <= 0) {
         hasMore = asyncFragment !== this.#stackTrace.asyncFragments.at(-1);
         break;
@@ -546,9 +543,8 @@ export class Item {
   }
 
   static createForAsyncHeader(
-      fragment: StackTrace.StackTrace.AsyncFragment, previousFragment: StackTrace.StackTrace.Fragment): Item {
-    const description = UI.UIUtils.asyncStackTraceLabel(
-        fragment.description, previousFragment.frames.map(f => ({functionName: f.name ?? ''})));
+      stackTrace: StackTrace.StackTrace.StackTrace, fragment: StackTrace.StackTrace.AsyncFragment): Item {
+    const description = UI.UIUtils.asyncFragmentLabel(stackTrace, fragment);
     const item = new Item(description);
     item.isAsyncHeader = true;
     return item;

package/front_end/panels/utils/utils.ts

@@ -151,12 +151,20 @@ export class PanelUtils {
     }
 
     if (type === Common.ResourceType.resourceTypes.Image) {
+      // clang-format off
       return html`<div class="image icon">
-          <img class="image-network-icon-preview"
-               title=${iconTitleForRequest(request)}
-               alt=${iconTitleForRequest(request)}
-               ${ref(e => request.populateImageSource(e as HTMLImageElement))}>
-        </div>`;
+        <img
+          class="image-network-icon-preview"
+          title=${iconTitleForRequest(request)}
+          alt=${iconTitleForRequest(request)}
+          ${ref(el => {
+            if (el) {
+             void request.populateImageSource(el as HTMLImageElement);
+            }
+          })}
+        />
+      </div>`;
+      // clang-format on
     }
 
     // Exclude Manifest here because it has mimeType:application/json but it has its own icon

package/front_end/third_party/chromium/README.chromium

@@ -1,7 +1,7 @@
 Name: Dependencies sourced from the upstream `chromium` repository
 URL: https://chromium.googlesource.com/chromium/src
 Version: N/A
-Revision: ccc41bdd9ec5ebd001ba6ac080db5aa20d8b96a9
+Revision: 649f914735bb39cbd9bfe68673921ced1cc2e71f
 Update Mechanism: Manual (https://crbug.com/428069060)
 License: BSD-3-Clause
 License File: LICENSE

package/front_end/third_party/puppeteer/README.chromium

@@ -1,10 +1,10 @@
 Name: Puppeteer Core
 Short Name: Puppeteer Core
 URL: https://github.com/puppeteer/puppeteer/tree/main/packages/puppeteer-core
-Version: 24.37.3
+Version: 24.37.4
 License: Apache-2.0
 License File: LICENSE
-Revision: eee111bedbbf719ce27f356f4f5307646b13b0eb
+Revision: c771d9cc0c6c3611532e18d89291c2d734f736ab
 Security Critical: no
 Shipped: yes
 Update Mechanism: Autoroll

package/front_end/third_party/puppeteer/package/lib/cjs/puppeteer/cdp/FrameManager.js

@@ -267,7 +267,7 @@ class FrameManager extends EventEmitter_js_1.EventEmitter {
             frame.updateClient(target._session());
         }
         this.setupEventListeners(target._session());
-        void this.initialize(target._session(), frame);
+        void this.initialize(target._session(), frame).catch(util_js_1.debugError);
     }
     _deviceRequestPromptManager(client) {
         let manager = this.#deviceRequestPromptManagerMap.get(client);