chrome-devtools-frontend 1.0.1646286 → 1.0.1646714

package/SECURITY.md

@@ -18,7 +18,7 @@ Chrome DevTools is a privileged web app running in a sandboxed renderer process,
 * Triggering Chrome memory corruption exploits.
 
 ### Outside Threat Model
-* **Social Engineering:** Convincing developers to paste payloads into the Console or connect to malicious remote debugging ports.
+* **Social Engineering:** Convincing developers to paste payloads into the Console, download and open a compromised file, or connect to malicious remote debugging ports, etc.
 * **Legitimate Data Exposure:** Displaying local user data, cookies, tokens, or auth headers within UI panels.
 * **Local Data Persistence:** Saving user-initiated traces, heaps, profiles, or logs to disk.
 * **Correctness & Availability:** Stale, misleading, or missing UI information (classified as functional bugs).

package/front_end/generated/InspectorBackendCommands.ts

@@ -798,7 +798,7 @@ inspectorBackend.registerEnum("Network.ServiceWorkerRouterSource", {Network: "ne
 inspectorBackend.registerEnum("Network.InitiatorType", {Parser: "parser", Script: "script", Preload: "preload", SignedExchange: "SignedExchange", Preflight: "preflight", FedCM: "FedCM", Other: "other"});
 inspectorBackend.registerEnum("Network.SetCookieBlockedReason", {SecureOnly: "SecureOnly", SameSiteStrict: "SameSiteStrict", SameSiteLax: "SameSiteLax", SameSiteUnspecifiedTreatedAsLax: "SameSiteUnspecifiedTreatedAsLax", SameSiteNoneInsecure: "SameSiteNoneInsecure", UserPreferences: "UserPreferences", ThirdPartyPhaseout: "ThirdPartyPhaseout", ThirdPartyBlockedInFirstPartySet: "ThirdPartyBlockedInFirstPartySet", SyntaxError: "SyntaxError", SchemeNotSupported: "SchemeNotSupported", OverwriteSecure: "OverwriteSecure", InvalidDomain: "InvalidDomain", InvalidPrefix: "InvalidPrefix", UnknownError: "UnknownError", SchemefulSameSiteStrict: "SchemefulSameSiteStrict", SchemefulSameSiteLax: "SchemefulSameSiteLax", SchemefulSameSiteUnspecifiedTreatedAsLax: "SchemefulSameSiteUnspecifiedTreatedAsLax", NameValuePairExceedsMaxSize: "NameValuePairExceedsMaxSize", DisallowedCharacter: "DisallowedCharacter", NoCookieContent: "NoCookieContent"});
 inspectorBackend.registerEnum("Network.CookieBlockedReason", {SecureOnly: "SecureOnly", NotOnPath: "NotOnPath", DomainMismatch: "DomainMismatch", SameSiteStrict: "SameSiteStrict", SameSiteLax: "SameSiteLax", SameSiteUnspecifiedTreatedAsLax: "SameSiteUnspecifiedTreatedAsLax", SameSiteNoneInsecure: "SameSiteNoneInsecure", UserPreferences: "UserPreferences", ThirdPartyPhaseout: "ThirdPartyPhaseout", ThirdPartyBlockedInFirstPartySet: "ThirdPartyBlockedInFirstPartySet", UnknownError: "UnknownError", SchemefulSameSiteStrict: "SchemefulSameSiteStrict", SchemefulSameSiteLax: "SchemefulSameSiteLax", SchemefulSameSiteUnspecifiedTreatedAsLax: "SchemefulSameSiteUnspecifiedTreatedAsLax", NameValuePairExceedsMaxSize: "NameValuePairExceedsMaxSize", PortMismatch: "PortMismatch", SchemeMismatch: "SchemeMismatch", AnonymousContext: "AnonymousContext"});
-inspectorBackend.registerEnum("Network.CookieExemptionReason", {None: "None", UserSetting: "UserSetting", EnterprisePolicy: "EnterprisePolicy", StorageAccess: "StorageAccess", TopLevelStorageAccess: "TopLevelStorageAccess", Scheme: "Scheme", SameSiteNoneCookiesInSandbox: "SameSiteNoneCookiesInSandbox"});
+inspectorBackend.registerEnum("Network.CookieExemptionReason", {None: "None", UserSetting: "UserSetting", TPCDMetadata: "TPCDMetadata", TPCDDeprecationTrial: "TPCDDeprecationTrial", TopLevelTPCDDeprecationTrial: "TopLevelTPCDDeprecationTrial", TPCDHeuristics: "TPCDHeuristics", EnterprisePolicy: "EnterprisePolicy", StorageAccess: "StorageAccess", TopLevelStorageAccess: "TopLevelStorageAccess", Scheme: "Scheme", SameSiteNoneCookiesInSandbox: "SameSiteNoneCookiesInSandbox"});
 inspectorBackend.registerEnum("Network.AuthChallengeSource", {Server: "Server", Proxy: "Proxy"});
 inspectorBackend.registerEnum("Network.AuthChallengeResponseResponse", {Default: "Default", CancelAuth: "CancelAuth", ProvideCredentials: "ProvideCredentials"});
 inspectorBackend.registerEnum("Network.InterceptionStage", {Request: "Request", HeadersReceived: "HeadersReceived"});

package/front_end/generated/SupportedCSSProperties.js

@@ -259,6 +259,20 @@ export const generatedProperties = [
   "name": "align-items"
  },
  {
+  "keywords": [
+   "auto",
+   "normal",
+   "stretch",
+   "baseline",
+   "center",
+   "start",
+   "end",
+   "self-start",
+   "self-end",
+   "flex-start",
+   "flex-end",
+   "anchor-center"
+  ],
   "name": "align-self"
  },
  {
@@ -1251,6 +1265,13 @@ export const generatedProperties = [
   "name": "border-end-start-radius"
  },
  {
+  "keywords": [
+   "none",
+   "repeat",
+   "stretch",
+   "space",
+   "round"
+  ],
   "longhands": [
    "border-image-source",
    "border-image-slice",
@@ -1894,6 +1915,9 @@ export const generatedProperties = [
   "name": "contain"
  },
  {
+  "keywords": [
+   "none"
+  ],
   "name": "contain-intrinsic-block-size"
  },
  {
@@ -1903,6 +1927,9 @@ export const generatedProperties = [
   "name": "contain-intrinsic-height"
  },
  {
+  "keywords": [
+   "none"
+  ],
   "name": "contain-intrinsic-inline-size"
  },
  {
@@ -3160,6 +3187,22 @@ export const generatedProperties = [
   "name": "justify-items"
  },
  {
+  "keywords": [
+   "auto",
+   "normal",
+   "stretch",
+   "baseline",
+   "center",
+   "start",
+   "end",
+   "self-start",
+   "self-end",
+   "flex-start",
+   "flex-end",
+   "left",
+   "right",
+   "anchor-center"
+  ],
   "name": "justify-self"
  },
  {
@@ -3468,12 +3511,33 @@ export const generatedProperties = [
   "name": "min-block-size"
  },
  {
+  "keywords": [
+   "auto",
+   "min-content",
+   "max-content",
+   "fit-content",
+   "stretch"
+  ],
   "name": "min-height"
  },
  {
+  "keywords": [
+   "auto",
+   "min-content",
+   "max-content",
+   "fit-content",
+   "stretch"
+  ],
   "name": "min-inline-size"
  },
  {
+  "keywords": [
+   "auto",
+   "min-content",
+   "max-content",
+   "fit-content",
+   "stretch"
+  ],
   "name": "min-width"
  },
  {
@@ -3584,6 +3648,21 @@ export const generatedProperties = [
   "name": "orphans"
  },
  {
+  "keywords": [
+   "auto",
+   "none",
+   "inset",
+   "groove",
+   "ridge",
+   "outset",
+   "dotted",
+   "dashed",
+   "solid",
+   "double",
+   "medium",
+   "thick",
+   "thin"
+  ],
   "longhands": [
    "outline-color",
    "outline-style",
@@ -3697,6 +3776,11 @@ export const generatedProperties = [
   "name": "override-colors"
  },
  {
+  "keywords": [
+   "auto",
+   "none",
+   "contain"
+  ],
   "longhands": [
    "overscroll-behavior-x",
    "overscroll-behavior-y"
@@ -3792,6 +3876,13 @@ export const generatedProperties = [
   "name": "page-break-after"
  },
  {
+  "keywords": [
+   "auto",
+   "left",
+   "right",
+   "always",
+   "avoid"
+  ],
   "longhands": [
    "break-before"
   ],
@@ -5393,6 +5484,22 @@ export const generatedPropertyValues = {
    "currentcolor"
   ]
  },
+ "align-self": {
+  "values": [
+   "auto",
+   "normal",
+   "stretch",
+   "baseline",
+   "center",
+   "start",
+   "end",
+   "self-start",
+   "self-end",
+   "flex-start",
+   "flex-end",
+   "anchor-center"
+  ]
+ },
  "alignment-baseline": {
   "values": [
    "auto",
@@ -5626,6 +5733,15 @@ export const generatedPropertyValues = {
    "collapse"
   ]
  },
+ "border-image": {
+  "values": [
+   "none",
+   "repeat",
+   "stretch",
+   "space",
+   "round"
+  ]
+ },
  "border-image-repeat": {
   "values": [
    "stretch",
@@ -5995,11 +6111,21 @@ export const generatedPropertyValues = {
    "block-size"
   ]
  },
+ "contain-intrinsic-block-size": {
+  "values": [
+   "none"
+  ]
+ },
  "contain-intrinsic-height": {
   "values": [
    "none"
   ]
  },
+ "contain-intrinsic-inline-size": {
+  "values": [
+   "none"
+  ]
+ },
  "contain-intrinsic-width": {
   "values": [
    "none"
@@ -6689,6 +6815,24 @@ export const generatedPropertyValues = {
    "isolate"
   ]
  },
+ "justify-self": {
+  "values": [
+   "auto",
+   "normal",
+   "stretch",
+   "baseline",
+   "center",
+   "start",
+   "end",
+   "self-start",
+   "self-end",
+   "flex-start",
+   "flex-end",
+   "left",
+   "right",
+   "anchor-center"
+  ]
+ },
  "left": {
   "values": [
    "auto"
@@ -6854,6 +6998,33 @@ export const generatedPropertyValues = {
    "none"
   ]
  },
+ "min-height": {
+  "values": [
+   "auto",
+   "min-content",
+   "max-content",
+   "fit-content",
+   "stretch"
+  ]
+ },
+ "min-inline-size": {
+  "values": [
+   "auto",
+   "min-content",
+   "max-content",
+   "fit-content",
+   "stretch"
+  ]
+ },
+ "min-width": {
+  "values": [
+   "auto",
+   "min-content",
+   "max-content",
+   "fit-content",
+   "stretch"
+  ]
+ },
  "mix-blend-mode": {
   "values": [
    "normal",
@@ -6917,6 +7088,23 @@ export const generatedPropertyValues = {
    "none"
   ]
  },
+ "outline": {
+  "values": [
+   "auto",
+   "none",
+   "inset",
+   "groove",
+   "ridge",
+   "outset",
+   "dotted",
+   "dashed",
+   "solid",
+   "double",
+   "medium",
+   "thick",
+   "thin"
+  ]
+ },
  "outline-color": {
   "values": [
    "currentcolor"
@@ -6990,6 +7178,13 @@ export const generatedPropertyValues = {
    "auto"
   ]
  },
+ "overscroll-behavior": {
+  "values": [
+   "auto",
+   "none",
+   "contain"
+  ]
+ },
  "overscroll-behavior-x": {
   "values": [
    "auto",
@@ -7011,6 +7206,15 @@ export const generatedPropertyValues = {
    "auto"
   ]
  },
+ "page-break-before": {
+  "values": [
+   "auto",
+   "left",
+   "right",
+   "always",
+   "avoid"
+  ]
+ },
  "page-margin-safety": {
   "values": [
    "none",

package/front_end/generated/protocol.ts

@@ -11136,6 +11136,10 @@ export namespace Network {
   export const enum CookieExemptionReason {
     None = 'None',
     UserSetting = 'UserSetting',
+    TPCDMetadata = 'TPCDMetadata',
+    TPCDDeprecationTrial = 'TPCDDeprecationTrial',
+    TopLevelTPCDDeprecationTrial = 'TopLevelTPCDDeprecationTrial',
+    TPCDHeuristics = 'TPCDHeuristics',
     EnterprisePolicy = 'EnterprisePolicy',
     StorageAccess = 'StorageAccess',
     TopLevelStorageAccess = 'TopLevelStorageAccess',

package/front_end/models/ai_assistance/AiAgent2.ts

@@ -26,6 +26,7 @@ import {ToolRegistry} from './tools/ToolRegistry.js';
 
 const SKILL_DISPLAY_NAMES: Record<SkillName, string> = {
   styling: 'CSS and styling',
+  network: 'Network requests',
 };
 
 const preamble = `You are the most advanced unified AI assistant integrated into Chrome DevTools.
@@ -61,7 +62,6 @@ export class AiAgent2 extends AiAgent<unknown> {
   readonly clientFeature = Host.AidaClient.ClientFeature.CHROME_DEVTOOLS_V2_AGENT;
   readonly userTier = 'TESTERS';
 
-  #skillsInjected = false;
   #changes = new ChangeManager();
   #execJs: typeof executeJsCode;
   readonly #allowedOrigin?: () => AllowedOriginResult;
@@ -78,9 +78,12 @@ export class AiAgent2 extends AiAgent<unknown> {
     this.#execJs = opts.execJs ?? executeJsCode;
     this.#allowedOrigin = opts.allowedOrigin;
     this.#declaredTools.add('learnSkills');
-    const skillsList = Object.keys(SKILLS).join(', ');
     this.declareFunction<{skills: SkillName[]}>('learnSkills', {
-      description: `Load skills to help with the task. Available skills: ${skillsList}.`,
+      description: () => {
+        const unloadedSkills = Object.keys(SKILLS).filter(name => !this.#activeSkills.has(name as SkillName));
+        return `Loads the specified skills to gain access to their specialized tools. Call this if the user's query relates to an available skill that is not yet loaded. Available skills: ${
+            unloadedSkills.join(', ')}.`;
+      },
       parameters: {
         type: Host.AidaClient.ParametersTypes.OBJECT,
         description: 'Parameters for learning skills',
@@ -130,16 +133,18 @@ QUERY: ${query}`;
       }
     }
 
-    if (this.#skillsInjected) {
+    const unloadedSkills =
+        Object.entries(this.getSkills()).filter(([name]) => !this.#activeSkills.has(name as SkillName));
+    if (unloadedSkills.length === 0) {
       return enhancedQuery;
     }
-    this.#skillsInjected = true;
-    const skillsManifest =
-        Object.entries(this.getSkills()).map(([name, skill]) => `- ${name}: ${skill.description}`).join('\n');
-    return `Available skills:
+
+    const skillsManifest = unloadedSkills.map(([name, skill]) => `- ${name}: ${skill.description}`).join('\n');
+    return `Available skills that are not yet loaded:
 ${skillsManifest}
 
-You must call \`learnSkills\` to load a skill before you can use it.
+You must call \`learnSkills\` to load a skill before you can use its tools.
+If the user's request requires a skill that is not currently loaded, you MUST call \`learnSkills\` to load that skill first, instead of attempting to solve the query using tools from other skills.
 
 User query: ${enhancedQuery}`;
   }

package/front_end/models/ai_assistance/agents/AiAgent.ts

@@ -410,7 +410,7 @@ export interface FunctionDeclaration<Args extends Record<string, unknown>, Retur
    * Description of function, this is send to the LLM
    * to explain what will the function do.
    */
-  description: string;
+  description: string|(() => string);
   /**
    * JSON schema like representation of the parameters
    * the function needs to be called with.
@@ -582,7 +582,7 @@ export abstract class AiAgent<T> {
     for (const [name, definition] of this.#functionDeclarations.entries()) {
       declarations.push({
         name,
-        description: definition.description,
+        description: typeof definition.description === 'function' ? definition.description() : definition.description,
         parameters: definition.parameters,
       });
     }

package/front_end/models/ai_assistance/agents/StorageAgent.ts

@@ -14,6 +14,7 @@ import {
   AiAgent,
   type ContextResponse,
   ConversationContext,
+  type ConversationSuggestions,
   type RequestOptions,
   ResponseType,
 } from './AiAgent.js';
@@ -97,6 +98,50 @@ export class StorageContext extends ConversationContext<StorageItem> {
     }
     return `Storage: ${this.getOrigin()}`;
   }
+
+  override async getSuggestions(): Promise<ConversationSuggestions|undefined> {
+    if (this.#item instanceof CookieItem) {
+      if (this.#item.name) {
+        return [
+          {
+            title: 'Why is this cookie set?',
+            jslogContext: 'storage-cookie',
+          },
+          {
+            title: 'Explain the value of this cookie',
+            jslogContext: 'storage-cookie',
+          },
+        ];
+      }
+      return [
+        {
+          title: 'Explain the cookies set by this page',
+          jslogContext: 'storage-cookie',
+        },
+      ];
+    }
+    if (this.#item instanceof DOMStorageItem) {
+      if (this.#item.key) {
+        return [
+          {
+            title: 'What is the purpose of this storage entry?',
+            jslogContext: 'storage-domstorage',
+          },
+          {
+            title: 'Explain the value of this storage entry',
+            jslogContext: 'storage-domstorage',
+          },
+        ];
+      }
+      return [
+        {
+          title: 'Explain these storage items',
+          jslogContext: 'storage-domstorage',
+        },
+      ];
+    }
+    return undefined;
+  }
 }
 
 // Maximum character length of values allowed.

package/front_end/models/ai_assistance/ai_assistance.ts

@@ -42,7 +42,9 @@ import * as AIQueries from './performance/AIQueries.js';
 import * as PerformanceAnnotations from './PerformanceAnnotations.js';
 import * as StorageItem from './StorageItem.js';
 import * as ExecuteJavaScript from './tools/ExecuteJavaScript.js';
+import * as GetNetworkRequestDetails from './tools/GetNetworkRequestDetails.js';
 import * as GetStyles from './tools/GetStyles.js';
+import * as ListNetworkRequests from './tools/ListNetworkRequests.js';
 import * as Tool from './tools/Tool.js';
 import * as ToolRegistry from './tools/ToolRegistry.js';
 
@@ -70,12 +72,14 @@ export {
   FileAgent,
   FileContext,
   FileFormatter,
+  GetNetworkRequestDetails,
   GetStyles,
   GreenDevAgent,
   GreenDevAgentAntigravityCliSocketClient,
   GreenDevAgentGeminiCliSocketClient,
   Injected,
   LighthouseFormatter,
+  ListNetworkRequests,
   NetworkAgent,
   NetworkRequestFormatter,
   PatchAgent,

package/front_end/models/ai_assistance/skills/Skill.ts

@@ -3,7 +3,7 @@
 // found in the LICENSE file.
 
 // This will become a union type as we add more skills (e.g. 'styling' | 'network').
-export type SkillName = 'styling';
+export type SkillName = 'styling'|'network';
 
 export interface Skill {
   name: SkillName;

package/front_end/models/ai_assistance/skills/SkillRegistry.ts

@@ -2,9 +2,11 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import {skill as networkSkill} from './network.skill.js';
 import type {Skill, SkillName} from './Skill.js';
 import {skill as stylingSkill} from './styling.skill.js';
 
 export const SKILLS: Record<SkillName, Skill> = {
   styling: stylingSkill,
+  network: networkSkill,
 };

package/front_end/models/ai_assistance/skills/network.md

@@ -0,0 +1,16 @@
+---
+name: network
+description: Analyzing network traffic, network requests, HTTP/HTTPS headers, status codes, payload details, timing/performance, and request sizes.
+allowed-tools:
+  - listNetworkRequests
+  - getNetworkRequestDetails
+---
+You are the most advanced network request debugging assistant integrated into Chrome DevTools.
+Provide a comprehensive analysis of network requests, focusing on areas crucial for a software engineer. Your analysis should include:
+* Briefly explain the purpose of the request based on the URL, method, and any relevant headers or payload.
+* Analyze timing information to identify potential bottlenecks or areas for optimization.
+* Highlight potential issues indicated by the status code.
+
+# Considerations
+* If the response payload or request payload contains sensitive data, redact or generalize it in your analysis to ensure privacy.
+* Tailor your explanations and suggestions to the specific context of the request and the technologies involved (if discernible from the provided details).

package/front_end/models/ai_assistance/skills/styling.md

@@ -1,6 +1,6 @@
 ---
 name: styling
-description: Helping with CSS and styling
+description: CSS, styling, layouts, positioning, computed styles, DOM tree structure, and page styles.
 allowed-tools:
   - executeJavaScript
   - getStyles

package/front_end/models/ai_assistance/tools/GetNetworkRequestDetails.ts

@@ -0,0 +1,118 @@
+// 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 Host from '../../../core/host/host.js';
+import * as i18n from '../../../core/i18n/i18n.js';
+import * as Logs from '../../logs/logs.js';
+import * as NetworkTimeCalculator from '../../network_time_calculator/network_time_calculator.js';
+import type {FunctionCallHandlerResult} from '../agents/AiAgent.js';
+import {isOpaqueOrigin} from '../AiOrigins.js';
+import {getRequestContextOrigin} from '../contexts/RequestContext.js';
+import {NetworkRequestFormatter} from '../data_formatters/NetworkRequestFormatter.js';
+
+import {
+  type BaseToolCapability,
+  type OriginLockCapability,
+  type Tool,
+  type ToolArgs,
+  ToolName,
+} from './Tool.js';
+const UIStringsNotTranslate = {
+  gettingNetworkRequestDetails: 'Getting network request details',
+} as const;
+
+const lockedString = i18n.i18n.lockedString;
+
+export interface GetNetworkRequestDetailsArgs extends ToolArgs {
+  id: string;
+}
+
+/**
+ * A tool that retrieves detailed information about a specific network request.
+ * The details include request/response headers, status code, timings, and the response body.
+ */
+export class GetNetworkRequestDetailsTool implements
+    Tool<GetNetworkRequestDetailsArgs, unknown, BaseToolCapability&OriginLockCapability> {
+  readonly name = ToolName.GET_NETWORK_REQUEST_DETAILS;
+  readonly description =
+      'Retrieves the full headers, timing, status, and body details of a specific network request by ID.';
+
+  readonly parameters: Host.AidaClient.FunctionObjectParam<keyof GetNetworkRequestDetailsArgs> = {
+    type: Host.AidaClient.ParametersTypes.OBJECT,
+    description: 'Arguments for retrieving detailed information about a specific network request.',
+    nullable: false,
+    properties: {
+      id: {
+        type: Host.AidaClient.ParametersTypes.STRING,
+        description: 'The id of the network request to inspect.',
+        nullable: false,
+      },
+    },
+    required: ['id'],
+  };
+
+  displayInfoFromArgs(args: GetNetworkRequestDetailsArgs): {
+    title: string,
+    action: string,
+  } {
+    return {
+      title: lockedString(UIStringsNotTranslate.gettingNetworkRequestDetails),
+      action: `getNetworkRequestDetails(${args.id})`,
+    };
+  }
+
+  /**
+   * Handles the request to retrieve details for a network request by its ID.
+   * Filters by the conversation's established origin to prevent cross-origin data exposure.
+   */
+  async handler(
+      args: GetNetworkRequestDetailsArgs,
+      context: BaseToolCapability&OriginLockCapability,
+      ): Promise<FunctionCallHandlerResult<unknown>> {
+    // A conversation is locked to an origin once the first query is made.
+    // We only allow inspecting requests matching the conversation's established origin.
+    const origin = context.getEstablishedOrigin();
+
+    // Opaque origins are never allowed to be used as context.
+    if (origin && isOpaqueOrigin(origin)) {
+      return {
+        error: 'Opaque origin not allowed',
+      };
+    }
+
+    const request = Logs.NetworkLog.NetworkLog.instance().requests().find(req => {
+      if (req.requestId() !== args.id) {
+        return false;
+      }
+
+      // To prevent cross-origin prompt injection attacks, HAR-imported requests
+      // are assigned a virtual origin (e.g., `imported-har://${domain}`) rather than
+      // sharing the origin of live pages.
+      const requestOrigin = getRequestContextOrigin(req);
+
+      // If the conversation is locked to an origin, only allow accessing requests from that origin.
+      return !origin || requestOrigin === origin;
+    });
+
+    if (!request) {
+      return {
+        error: 'No request found',
+      };
+    }
+
+    const calculator = new NetworkTimeCalculator.NetworkTransferTimeCalculator();
+    const formatter = new NetworkRequestFormatter(request, calculator);
+    const formattedDetails = await formatter.formatNetworkRequest();
+
+    return {
+      result: formattedDetails,
+      widgets: [{
+        name: 'NETWORK_REQUEST_GENERAL_HEADERS',
+        data: {
+          request,
+        },
+      }],
+    };
+  }
+}