chrome-devtools-frontend 1.0.1662289 → 1.0.1664496

package/front_end/panels/issues/AffectedLazyLoadImagesView.ts

@@ -0,0 +1,76 @@
+// 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.
+
+import * as i18n from '../../core/i18n/i18n.js';
+import type * as Platform from '../../core/platform/platform.js';
+import type * as IssuesManager from '../../models/issues_manager/issues_manager.js';
+import {html, render} from '../../ui/lit/lit.js';
+
+import {AffectedResourcesView} from './AffectedResourcesView.js';
+import type {IssueView} from './IssueView.js';
+
+const UIStrings = {
+  /**
+   * @description Noun for singular or plural number of affected element resource indication in issue view.
+   */
+  nElements: '{n, plural, =1 {# element} other {# elements}}',
+} as const;
+const str_ = i18n.i18n.registerUIStrings('panels/issues/AffectedLazyLoadImagesView.ts', UIStrings);
+const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
+
+export interface ViewInput {
+  issues: Iterable<IssuesManager.LazyLoadImageIssue.LazyLoadImageIssue>;
+  issueCategory: IssuesManager.Issue.IssueCategory;
+  createElementCell: (element: IssuesManager.Issue.AffectedElement,
+                      category: IssuesManager.Issue.IssueCategory) => Promise<Element>;
+}
+
+export type View = (input: ViewInput, output: object, target: HTMLElement) => Promise<void>;
+
+export const DEFAULT_VIEW: View = async (input, _output, target) => {
+  const templates = [];
+  for (const issue of input.issues) {
+    for (const element of issue.elements()) {
+      templates.push(html`<tr>
+        ${await input.createElementCell(element, input.issueCategory)}
+      </tr>`);
+    }
+  }
+  render(html`${templates}`, target);
+};
+
+export class AffectedLazyLoadImagesView extends AffectedResourcesView {
+  readonly #view: View;
+
+  constructor(parent: IssueView, issue: IssuesManager.IssueAggregator.AggregatedIssue, jslogContext: string,
+              view = DEFAULT_VIEW) {
+    super(parent, issue, jslogContext);
+    this.#view = view;
+  }
+
+  override update(): void {
+    this.requestResolver.clear();
+    void this.#render();
+  }
+
+  protected override getResourceNameWithCount(count: number): Platform.UIString.LocalizedString {
+    return i18nString(UIStrings.nElements, {n: count});
+  }
+
+  async #render(): Promise<void> {
+    const issues = this.issue.getLazyLoadImageIssues();
+    let count = 0;
+    for (const issue of issues) {
+      count += issue.elementCount();
+    }
+    this.updateAffectedResourceCount(count);
+
+    const input = {
+      issues,
+      issueCategory: this.issue.getCategory(),
+      createElementCell: this.createElementCell.bind(this),
+    };
+    await this.#view(input, {}, this.affectedResources);
+  }
+}

package/front_end/panels/issues/AffectedResourcesView.ts

@@ -31,7 +31,7 @@ const UIStrings = {
   /**
    * @description Tooltip for button linking to the Elements panel
    */
-  clickToRevealTheFramesDomNodeIn: 'Click to reveal the frame\'s DOM node in the Elements panel',
+  clickToRevealTheFramesDomNodeIn: 'Click to reveal the frame’s DOM node in the Elements panel',
   /**
    * @description Replacement text for a link to an HTML element which is not available (anymore).
    */

package/front_end/panels/issues/CorsIssueDetailsView.ts

@@ -93,7 +93,7 @@ const UIStrings = {
   /**
    * @description Content for the problem column in the affected resources table for a CORS issue that indicates that the HTTP status the preflight request was not successful.
    */
-  preflightInvalidStatus: 'HTTP status of preflight request didn\'t indicate success',
+  preflightInvalidStatus: 'HTTP status of preflight request didn’t indicate success',
   /**
    * @description Title for a column in the affected resources for a CORS issue showing the origin that was allowed according to CORS headers.
    */

package/front_end/panels/issues/IssueView.ts

@@ -25,6 +25,7 @@ import {AffectedDirectivesView} from './AffectedDirectivesView.js';
 import {AffectedDocumentsInQuirksModeView} from './AffectedDocumentsInQuirksModeView.js';
 import {AffectedElementsView} from './AffectedElementsView.js';
 import {AffectedHeavyAdView} from './AffectedHeavyAdView.js';
+import {AffectedLazyLoadImagesView} from './AffectedLazyLoadImagesView.js';
 import {AffectedMetadataAllowedSitesView} from './AffectedMetadataAllowedSitesView.js';
 import {AffectedPartitioningBlobURLView} from './AffectedPartitioningBlobURLView.js';
 import {AffectedPermissionElementsView} from './AffectedPermissionElementsView.js';
@@ -259,6 +260,7 @@ export class IssueView extends UI.TreeOutline.TreeElement {
       new AffectedDescendantsWithinSelectElementView(this, this.#issue, 'disallowed-select-descendants-details'),
       new AffectedPartitioningBlobURLView(this, this.#issue, 'partitioning-blob-url-details'),
       new AffectedPermissionElementsView(this, this.#issue, 'permission-element-elements'),
+      new AffectedLazyLoadImagesView(this, this.#issue, 'lazy-load-image-details'),
       new AffectedSelectivePermissionsInterventionView(this, this.#issue, 'selective-permissions-intervention-details'),
     ];
     this.#hiddenIssuesMenu = new Components.HideIssuesMenu.HideIssuesMenu();

package/front_end/panels/issues/issues.ts

@@ -2,12 +2,14 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import * as AffectedLazyLoadImagesView from './AffectedLazyLoadImagesView.js';
 import * as AffectedSelectivePermissionsInterventionView from './AffectedSelectivePermissionsInterventionView.js';
 import * as IssueRevealer from './IssueRevealer.js';
 import * as IssuesPane from './IssuesPane.js';
 import * as IssueView from './IssueView.js';
 
 export {
+  AffectedLazyLoadImagesView,
   AffectedSelectivePermissionsInterventionView,
   IssueRevealer,
   IssuesPane,

package/front_end/panels/layer_viewer/Layers3DView.ts

@@ -45,7 +45,7 @@ const UIStrings = {
   /**
    * @description Text in DView of the Layers panel
    */
-  cantDisplayLayers: 'Can\'t display layers',
+  cantDisplayLayers: 'Can’t display layers',
   /**
    * @description Text in DView of the Layers panel
    */

package/front_end/panels/lighthouse/LighthouseController.ts

@@ -900,3 +900,8 @@ export interface EventTypes {
   [Events.PageWarningsChanged]: PageWarningsChangedEvent;
   [Events.AuditProgressChanged]: AuditProgressChangedEvent;
 }
+
+export function clearSettingsCacheForTest(): void {
+  runtimeSettings = null;
+  presets = null;
+}

package/front_end/panels/lighthouse/LighthouseReportRenderer.ts

@@ -7,8 +7,8 @@ import * as Common from '../../core/common/common.js';
 import * as Host from '../../core/host/host.js';
 import * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
+import * as TextUtils from '../../core/text_utils/text_utils.js';
 import type * as LighthouseModel from '../../models/lighthouse/lighthouse.js';
-import * as TextUtils from '../../models/text_utils/text_utils.js';
 import * as Workspace from '../../models/workspace/workspace.js';
 import * as LighthouseReport from '../../third_party/lighthouse/report/report.js';
 import * as Components from '../../ui/legacy/components/utils/utils.js';

package/front_end/panels/network/BinaryResourceView.ts

@@ -9,7 +9,7 @@ import * as Common from '../../core/common/common.js';
 import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import type * as Platform from '../../core/platform/platform.js';
-import type * as TextUtils from '../../models/text_utils/text_utils.js';
+import type * as TextUtils from '../../core/text_utils/text_utils.js';
 import * as SourceFrame from '../../ui/legacy/components/source_frame/source_frame.js';
 import * as UI from '../../ui/legacy/legacy.js';
 

package/front_end/panels/network/NetworkDataGridNode.ts

@@ -47,6 +47,7 @@ import * as Bindings from '../../models/bindings/bindings.js';
 import type * as HAR from '../../models/har/har.js';
 import * as Logs from '../../models/logs/logs.js';
 import type * as NetworkTimeCalculator from '../../models/network_time_calculator/network_time_calculator.js';
+import * as StackTrace from '../../models/stack_trace/stack_trace.js';
 import * as NetworkForward from '../../panels/network/forward/forward.js';
 import * as Buttons from '../../ui/components/buttons/buttons.js';
 import {createIcon} from '../../ui/kit/kit.js';
@@ -107,7 +108,7 @@ const UIStrings = {
   /**
    * @description Reason why a request was blocked shown in the Network panel
    */
-  coopSandboxedIframeCannotNavigateToCoopPage: 'Sandboxed iframe\'s popup cannot navigate to COOP page',
+  coopSandboxedIframeCannotNavigateToCoopPage: 'Sandboxed iframe’s popup cannot navigate to COOP page',
   /**
    * @description Reason why a request was blocked shown in the Network panel
    */
@@ -343,6 +344,16 @@ const UIStrings = {
    * @description Text in Network Data Grid Node of the Network panel. Noun. Refers to a potentially blocking resource.
    */
   potentiallyBlocking: 'Potentially blocking',
+  /**
+   * @description Text indicating a request originated from the DevTools console. Used as a subtitle in the
+   * Initiator column.
+   */
+  console: 'Console',
+  /**
+   * @description Tooltip for the console icon in the Network panel, indicating a request was initiated
+   * from the Console.
+   */
+  requestOriginatedFromConsole: 'Request originated from Console',
 
 } as const;
 const str_ = i18n.i18n.registerUIStrings('panels/network/NetworkDataGridNode.ts', UIStrings);
@@ -599,6 +610,27 @@ export const _backgroundColors: Record<string, string> = {
   FromFrame: '--network-grid-from-frame-color',
 };
 
+// name/path/url are the primary cells that own the request icon, the Ask AI
+// button and the row click handlers. The first visible one is decorated, which
+// is not necessarily visible index 0 (the pinned request-number column can come
+// first).
+const PRIMARY_COLUMNS = new Set(['name', 'path', 'url']);
+
+function firstPrimaryColumn(dataGrid: DataGrid.DataGrid.DataGridImpl<unknown>|null): DataGrid.DataGrid.ColumnDescriptor|
+    undefined {
+  return dataGrid?.visibleColumnsArray.find(column => PRIMARY_COLUMNS.has(column.id));
+}
+
+function isFirstPrimaryColumn(dataGrid: DataGrid.DataGrid.DataGridImpl<unknown>|null, columnId: string): boolean {
+  const firstPrimary = firstPrimaryColumn(dataGrid);
+  // When the node is not attached to a grid yet there are no visible columns to
+  // inspect, so fall back to treating any primary column as the first one.
+  if (!firstPrimary) {
+    return PRIMARY_COLUMNS.has(columnId);
+  }
+  return firstPrimary.id === columnId;
+}
+
 export class NetworkRequestNode extends NetworkNode {
   private initiatorCell: Element|null;
   private requestInternal: SDK.NetworkRequest.NetworkRequest;
@@ -1009,6 +1041,29 @@ export class NetworkRequestNode extends NetworkNode {
     return aValue.localeCompare(bValue) || aRequest.identityCompare(bRequest);
   }
 
+  static isConsoleOriginated(request: SDK.NetworkRequest.NetworkRequest): boolean {
+    const resourceType = request.resourceType();
+    if (resourceType !== Common.ResourceType.resourceTypes.Fetch &&
+        resourceType !== Common.ResourceType.resourceTypes.XHR) {
+      return false;
+    }
+    const initiator = request.initiator();
+    if (!initiator || initiator.type !== Protocol.Network.InitiatorType.Script) {
+      return false;
+    }
+    if (initiator.url) {
+      return false;
+    }
+    if (!initiator.stack) {
+      return false;
+    }
+    return StackTrace.StackTrace.isConsoleOriginated(initiator.stack);
+  }
+
+  private isConsoleOriginated(): boolean {
+    return NetworkRequestNode.isConsoleOriginated(this.requestInternal);
+  }
+
   override showingInitiatorChainChanged(): void {
     const showInitiatorChain = this.showingInitiatorChain();
 
@@ -1317,9 +1372,8 @@ export class NetworkRequestNode extends NetworkNode {
   }
 
   private renderPrimaryCell(cell: HTMLElement, columnId: string, text?: string): void {
-    const columnIndex = (this.dataGrid as DataGrid.DataGrid.DataGridImpl<unknown>)?.indexOfVisibleColumn(columnId) | 0;
-    const isFirstCell = (columnIndex === 0);
-    if (isFirstCell) {
+    const dataGrid = this.dataGrid as DataGrid.DataGrid.DataGridImpl<unknown>| null;
+    if (isFirstPrimaryColumn(dataGrid, columnId)) {
       const leftPadding = this.leftPadding ? this.leftPadding + 'px' : '';
       cell.style.setProperty('padding-left', leftPadding);
       cell.tabIndex = -1;
@@ -1340,6 +1394,13 @@ export class NetworkRequestNode extends NetworkNode {
       // eslint-disable-next-line @devtools/no-lit-render-outside-of-view
       render(iconElement, cell);
 
+      // render Console icon if this request originated from Console
+      if (this.isConsoleOriginated()) {
+        const consoleIcon = createIcon('terminal', 'network-console-icon');
+        UI.Tooltip.Tooltip.install(consoleIcon, i18nString(UIStrings.requestOriginatedFromConsole));
+        cell.appendChild(consoleIcon);
+      }
+
       // render Ask AI button
       const aiButtonContainer = this.createAiButtonIfAvailable();
       if (aiButtonContainer) {
@@ -1590,7 +1651,8 @@ export class NetworkRequestNode extends NetworkNode {
         }
         UI.Tooltip.Tooltip.install((this.linkifiedInitiatorAnchor), '');
         cell.appendChild(this.linkifiedInitiatorAnchor);
-        this.appendSubtitle(cell, i18nString(UIStrings.script));
+        this.appendSubtitle(cell,
+                            this.isConsoleOriginated() ? i18nString(UIStrings.console) : i18nString(UIStrings.script));
         cell.classList.add('network-script-initiated');
         break;
       }
@@ -1772,7 +1834,8 @@ export class NetworkRequestNode extends NetworkNode {
 export class NetworkGroupNode extends NetworkNode {
   override createCells(element: Element): void {
     super.createCells(element);
-    const primaryColumn = (this.dataGrid as DataGrid.DataGrid.DataGridImpl<unknown>).visibleColumnsArray[0];
+    const dataGrid = this.dataGrid as DataGrid.DataGrid.DataGridImpl<unknown>;
+    const primaryColumn = firstPrimaryColumn(dataGrid) ?? dataGrid.visibleColumnsArray[0];
     const localizedTitle = `${primaryColumn.title}`;
     const localizedLevel = i18nString(UIStrings.level);
     this.nodeAccessibleText =
@@ -1780,8 +1843,9 @@ export class NetworkGroupNode extends NetworkNode {
   }
 
   override renderCell(c: Element, columnId: string): void {
-    const columnIndex = (this.dataGrid as DataGrid.DataGrid.DataGridImpl<unknown>).indexOfVisibleColumn(columnId);
-    if (columnIndex === 0) {
+    const dataGrid = this.dataGrid as DataGrid.DataGrid.DataGridImpl<unknown>;
+    const primaryColumn = firstPrimaryColumn(dataGrid) ?? dataGrid.visibleColumnsArray[0];
+    if (primaryColumn.id === columnId) {
       const cell = (c as HTMLElement);
       const leftPadding = this.leftPadding ? this.leftPadding + 'px' : '';
       cell.style.setProperty('padding-left', leftPadding);

package/front_end/panels/network/NetworkLogView.ts

@@ -40,13 +40,13 @@ import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
+import * as TextUtils from '../../core/text_utils/text_utils.js';
 import * as Protocol from '../../generated/protocol.js';
 import * as Bindings from '../../models/bindings/bindings.js';
 import * as HAR from '../../models/har/har.js';
 import * as Logs from '../../models/logs/logs.js';
 import * as NetworkTimeCalculator from '../../models/network_time_calculator/network_time_calculator.js';
 import * as Persistence from '../../models/persistence/persistence.js';
-import * as TextUtils from '../../models/text_utils/text_utils.js';
 import * as Workspace from '../../models/workspace/workspace.js';
 import * as NetworkForward from '../../panels/network/forward/forward.js';
 import * as Sources from '../../panels/sources/sources.js';

package/front_end/panels/network/NetworkLogViewColumns.ts

@@ -980,6 +980,12 @@ const DEFAULT_COLUMN_CONFIG = {
 };
 
 const DEFAULT_COLUMNS = [
+  {
+    id: 'request-number',
+    title: i18nLazyString(UIStrings.requestNumber),
+    align: DataGrid.DataGrid.Align.RIGHT,
+    sortingFunction: NetworkRequestNode.RequestNumberComparator,
+  },
   {
     id: 'name',
     title: i18nLazyString(UIStrings.name),
@@ -1004,12 +1010,6 @@ const DEFAULT_COLUMNS = [
     hideableGroup: 'path',
     sortingFunction: NetworkRequestNode.RequestURLComparator,
   },
-  {
-    id: 'request-number',
-    title: i18nLazyString(UIStrings.requestNumber),
-    align: DataGrid.DataGrid.Align.RIGHT,
-    sortingFunction: NetworkRequestNode.RequestNumberComparator,
-  },
   {
     id: 'method',
     title: i18nLazyString(UIStrings.method),

package/front_end/panels/network/NetworkPanel.ts

@@ -71,13 +71,13 @@ const UIStrings = {
    */
   search: 'Search',
   /**
-   * @description Tooltip text that appears on the setting to preserve log when hovering over the item
+   * @description Tooltip text that appears on the setting to keep log when hovering over the item.
    */
-  doNotClearLogOnPageReload: 'Do not clear log on page reload / navigation',
+  doNotClearLogOnPageReload: 'Don’t clear log on page reload / navigation',
   /**
-   * @description Text to preserve the log after refreshing
+   * @description Text to keep the log after refreshing.
    */
-  preserveLog: 'Preserve log',
+  preserveLog: 'Keep log',
   /**
    * @description Text to disable cache while DevTools is open
    */

package/front_end/panels/network/NetworkSearchScope.ts

@@ -6,8 +6,8 @@ import type * as Common from '../../core/common/common.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Platform from '../../core/platform/platform.js';
 import type * as SDK from '../../core/sdk/sdk.js';
+import * as TextUtils from '../../core/text_utils/text_utils.js';
 import type * as Logs from '../../models/logs/logs.js';
-import * as TextUtils from '../../models/text_utils/text_utils.js';
 import type * as Workspace from '../../models/workspace/workspace.js';
 import * as NetworkForward from '../../panels/network/forward/forward.js';
 import type * as Search from '../search/search.js';

package/front_end/panels/network/RequestConditionsDrawer.ts

@@ -46,7 +46,7 @@ const UIStrings = {
    * @example {Learn more} PH1
    */
   noThrottlingOrBlockingPattern:
-      `To throttle or block a network request, add a rule here manually or via the network panel's context menu. {PH1}`,
+      `To throttle or block a network request, add a rule here manually or via the network panel’s context menu. {PH1}`,
   /**
    * @description Text in Blocked URLs Pane of the Network panel
    * @example {4} PH1

package/front_end/panels/network/RequestHTMLView.ts

@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import type * as TextUtils from '../../models/text_utils/text_utils.js';
+import type * as TextUtils from '../../core/text_utils/text_utils.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import {html, nothing, render} from '../../ui/lit/lit.js';
 

package/front_end/panels/network/RequestInitiatorView.ts

@@ -12,6 +12,7 @@ import * as UI from '../../ui/legacy/legacy.js';
 import {Directives, html, type LitTemplate, nothing, render, type TemplateResult} from '../../ui/lit/lit.js';
 import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
 
+import {NetworkRequestNode} from './NetworkDataGridNode.js';
 import requestInitiatorViewStyles from './requestInitiatorView.css.js';
 import requestInitiatorViewTreeStyles from './requestInitiatorViewTree.css.js';
 
@@ -30,6 +31,10 @@ const UIStrings = {
    * @description Title of a section in Request Initiator view of the Network Panel
    */
   requestInitiatorChain: 'Request initiator chain',
+  /**
+   * @description Label shown in the initiator chain when a request was initiated from the Console.
+   */
+  console: 'Console',
 } as const;
 const str_ = i18n.i18n.registerUIStrings('panels/network/RequestInitiatorView.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
@@ -51,6 +56,7 @@ export interface ViewInput {
   initiatorGraph: Logs.NetworkLog.InitiatorGraph;
   stackTrace: StackTrace.StackTrace.StackTrace|null;
   request: SDK.NetworkRequest.NetworkRequest;
+  isConsoleOriginated: boolean;
 }
 
 export const DEFAULT_VIEW = (input: ViewInput, _output: undefined, target: HTMLElement): void => {
@@ -83,6 +89,11 @@ export const DEFAULT_VIEW = (input: ViewInput, _output: undefined, target: HTMLE
               stackTrace: input.stackTrace,
             })}
           </li>
+          ${input.isConsoleOriginated ? html`
+            <li role="treeitem" class="console-origin-label">
+              ${i18nString(UIStrings.console)}
+            </li>
+          ` : nothing}
         </ul>
       </li>
     `;
@@ -167,13 +178,21 @@ export const DEFAULT_VIEW = (input: ViewInput, _output: undefined, target: HTMLE
         ${i18nString(UIStrings.requestInitiatorChain)}
         ${hasInitiatorChain ? html`
           <ul role="group">
-            ${renderInitiatorNodes(initiators, 0, initiatorGraph.initiated, visited)}
+            ${input.isConsoleOriginated ? html`
+              <li role="treeitem" aria-expanded="true" open>
+                <span>${i18nString(UIStrings.console)}</span>
+                <ul role="group">
+                  ${renderInitiatorNodes(initiators, 0, initiatorGraph.initiated, visited)}
+                </ul>
+              </li>` :
+              renderInitiatorNodes(initiators, 0, initiatorGraph.initiated, visited)}
           </ul>` : nothing}
       </li>`;
     // clang-format on
   };
 
-  const hasInitiatorChain = input.initiatorGraph.initiators.size > 1 || input.initiatorGraph.initiated.size > 1;
+  const hasInitiatorChain =
+      input.initiatorGraph.initiators.size > 1 || input.initiatorGraph.initiated.size > 1 || input.isConsoleOriginated;
 
   // clang-format off
   render(html`
@@ -242,10 +261,13 @@ export class RequestInitiatorView extends UI.Widget.VBox {
                        .createStackTraceFromProtocolRuntime(rawStack, target);
     }
 
+    const isConsoleOriginated = NetworkRequestNode.isConsoleOriginated(this.request);
+
     const viewInput: ViewInput = {
       initiatorGraph,
       stackTrace,
       request: this.request,
+      isConsoleOriginated,
     };
 
     this.#view(viewInput, undefined, this.contentElement);

package/front_end/panels/network/RequestPayloadView.ts

@@ -37,7 +37,7 @@ import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
-import * as TextUtils from '../../models/text_utils/text_utils.js';
+import * as TextUtils from '../../core/text_utils/text_utils.js';
 import * as Buttons from '../../ui/components/buttons/buttons.js';
 import * as ObjectUI from '../../ui/legacy/components/object_ui/object_ui.js';
 // eslint-disable-next-line @devtools/es-modules-import

package/front_end/panels/network/RequestPreviewView.ts

@@ -7,7 +7,7 @@ import '../../ui/legacy/legacy.js';
 
 import * as i18n from '../../core/i18n/i18n.js';
 import type * as SDK from '../../core/sdk/sdk.js';
-import * as TextUtils from '../../models/text_utils/text_utils.js';
+import * as TextUtils from '../../core/text_utils/text_utils.js';
 import * as SourceFrame from '../../ui/legacy/components/source_frame/source_frame.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import {render} from '../../ui/lit/lit.js';

package/front_end/panels/network/RequestResponseView.ts

@@ -6,7 +6,7 @@ import * as Common from '../../core/common/common.js';
 import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import type * as SDK from '../../core/sdk/sdk.js';
-import * as TextUtils from '../../models/text_utils/text_utils.js';
+import * as TextUtils from '../../core/text_utils/text_utils.js';
 import * as SourceFrame from '../../ui/legacy/components/source_frame/source_frame.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as Lit from '../../ui/lit/lit.js';

package/front_end/panels/network/ResourceChunkView.ts

@@ -9,7 +9,7 @@ import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Platform from '../../core/platform/platform.js';
 import type * as SDK from '../../core/sdk/sdk.js';
-import * as TextUtils from '../../models/text_utils/text_utils.js';
+import * as TextUtils from '../../core/text_utils/text_utils.js';
 import * as DataGrid from '../../ui/legacy/components/data_grid/data_grid.js';
 import * as SourceFrame from '../../ui/legacy/components/source_frame/source_frame.js';
 import * as UI from '../../ui/legacy/legacy.js';

package/front_end/panels/network/ResourceDirectSocketChunkView.ts

@@ -7,7 +7,7 @@ import * as Common from '../../core/common/common.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
-import * as TextUtils from '../../models/text_utils/text_utils.js';
+import * as TextUtils from '../../core/text_utils/text_utils.js';
 import * as DataGrid from '../../ui/legacy/components/data_grid/data_grid.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';

package/front_end/panels/network/ResourceWebSocketFrameView.ts

@@ -25,7 +25,7 @@ import * as Common from '../../core/common/common.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
-import * as TextUtils from '../../models/text_utils/text_utils.js';
+import * as TextUtils from '../../core/text_utils/text_utils.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
 

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

@@ -9,10 +9,10 @@ import * as i18n from '../../../core/i18n/i18n.js';
 import * as Platform from '../../../core/platform/platform.js';
 import type {NameValue} from '../../../core/sdk/NetworkRequest.js';
 import type * as SDK from '../../../core/sdk/sdk.js';
+import * as TextUtils from '../../../core/text_utils/text_utils.js';
 import * as Protocol from '../../../generated/protocol.js';
 import * as IssuesManager from '../../../models/issues_manager/issues_manager.js';
 import * as Persistence from '../../../models/persistence/persistence.js';
-import * as TextUtils from '../../../models/text_utils/text_utils.js';
 import type * as Workspace from '../../../models/workspace/workspace.js';
 import * as NetworkForward from '../../../panels/network/forward/forward.js';
 import * as Sources from '../../../panels/sources/sources.js';

package/front_end/panels/network/forward/UIRequestLocation.ts

@@ -3,7 +3,7 @@
 // found in the LICENSE file.
 
 import type * as SDK from '../../../core/sdk/sdk.js';
-import type * as TextUtils from '../../../models/text_utils/text_utils.js';
+import type * as TextUtils from '../../../core/text_utils/text_utils.js';
 
 export const enum UIHeaderSection {
   GENERAL = 'General',

package/front_end/panels/network/network-meta.ts

@@ -110,7 +110,7 @@ const UIStrings = {
   /**
    * @description Title of a setting under the Network category that can be invoked through the Command Menu
    */
-  dontGroupNetworkLogItemsByFrame: 'Don\'t group network log items by frame',
+  dontGroupNetworkLogItemsByFrame: 'Don’t group network log items by frame',
   /**
    * @description Title of a button for clearing the network log
    */
@@ -132,13 +132,13 @@ const UIStrings = {
    * @description Title of an action in the Network panel that disables options in the UI to copy or export
    *              HAR (not translatable) with sensitive data.
    */
-  dontAllowToGenerateHarWithSensitiveData: 'Don\'t allow to generate `HAR` with sensitive data',
+  dontAllowToGenerateHarWithSensitiveData: 'Don’t allow to generate `HAR` with sensitive data',
   /**
    * @description Tooltip shown as documentation when hovering the (?) icon next to the "Allow to generate
    *              HAR with sensitive data" option in the Settings panel.
    */
   allowToGenerateHarWithSensitiveDataDocumentation:
-      'By default generated HAR logs are sanitized and don\'t include `Cookie`, `Set-Cookie`, or `Authorization` HTTP headers. When this setting is enabled, options to export/copy HAR with sensitive data are provided.',
+      'By default generated HAR logs are sanitized and don’t include `Cookie`, `Set-Cookie`, or `Authorization` HTTP headers. When this setting is enabled, options to export/copy HAR with sensitive data are provided.',
 } as const;
 const str_ = i18n.i18n.registerUIStrings('panels/network/network-meta.ts', UIStrings);
 const i18nLazyString = i18n.i18n.getLazilyComputedLocalizedString.bind(undefined, str_);

package/front_end/panels/network/networkLogView.css

@@ -262,12 +262,17 @@ td.time-column {
 }
 
 .data-grid-data-grid-node devtools-icon[name="arrow-up-down-circle"],
+.data-grid-data-grid-node devtools-icon.network-console-icon,
 .network-log-grid.data-grid.small .icon {
   width: 16px;
   height: 16px;
   vertical-align: sub;
 }
 
+.data-grid-data-grid-node devtools-icon.network-console-icon {
+  margin-right: 3px;
+}
+
 .image-network-icon-preview {
   inset: 0;
   margin: auto;

package/front_end/panels/network/requestInitiatorViewTree.css

@@ -17,6 +17,11 @@
   padding: 4px;
 }
 
+.console-origin-label {
+  color: var(--sys-color-token-subtle);
+  padding: 2px 4px 2px 20px;
+}
+
 .request-initiator-view-section-title:focus-visible {
   background-color: var(--sys-color-state-focus-highlight);
 }