chrome-devtools-frontend 1.0.1581708 → 1.0.1582745

package/front_end/core/sdk/RemoteObject.ts

@@ -66,6 +66,11 @@ export abstract class RemoteObject {
     return matches ? parseInt(matches[1], 10) : 0;
   }
 
+  static isEmptyArray(object: RemoteObject|Protocol.Runtime.RemoteObject|Protocol.Runtime.ObjectPreview): boolean {
+    const matches = object.description?.match(descriptionLengthParenRegex);
+    return Boolean(matches?.[1] === '0');
+  }
+
   static unserializableDescription(object: unknown): string|null {
     if (typeof object === 'number') {
       const description = String(object);
@@ -582,7 +587,8 @@ export class RemoteObjectImpl extends RemoteObject {
 
   override isLinearMemoryInspectable(): boolean {
     return this.type === 'object' && this.subtype !== undefined &&
-        ['webassemblymemory', 'typedarray', 'dataview', 'arraybuffer'].includes(this.subtype);
+        ['webassemblymemory', 'typedarray', 'dataview', 'arraybuffer'].includes(this.subtype) &&
+        !RemoteObject.isEmptyArray(this);
   }
 }
 

package/front_end/entrypoint_template.html

@@ -14,7 +14,11 @@
     }
   }
 </style>
-<meta http-equiv="Content-Security-Policy" content="object-src 'none'; script-src 'self' https://chrome-devtools-frontend.appspot.com">
+<meta
+  http-equiv="Content-Security-Policy"
+  content="default-src 'self' devtools: data:; style-src 'self' 'unsafe-inline' devtools:; object-src 'none'; script-src
+  'self' https://chrome-devtools-frontend.appspot.com; img-src 'self' data:; frame-src * data:; connect-src data:
+  https://chromeuxreport.googleapis.com 'self' devtools:;">
 <meta name="referrer" content="no-referrer">
 <script type="module" src="./entrypoints/%ENTRYPOINT_NAME%/%ENTRYPOINT_NAME%.js"></script>
 <link href="./application_tokens.css" rel="stylesheet">

package/front_end/entrypoints/greendev_floaty/FloatyEntrypoint.ts

@@ -254,6 +254,10 @@ class GreenDevFloaty {
     return messages;
   }
 
+  #formatError(errorMessage: string): string {
+    return `Error: '${errorMessage}' - Protip: to use AI features you need to be signed in.`;
+  }
+
   runConversation = async(): Promise<void> => {
     if (!this.#textField || !this.#node) {
       return;
@@ -276,7 +280,7 @@ class GreenDevFloaty {
       nodeDescription: document.querySelector('.green-dev-floaty-dialog-node-description')?.textContent,
     });
 
-    const {content: aiContent} = this.#addMessageInternal('Thinking...', false);
+    const aiContent = this.#addMessageInternal('Thinking...', false);
     this.#syncChannel.postMessage({
       type: 'new-message',
       text: 'Thinking...',
@@ -297,9 +301,9 @@ class GreenDevFloaty {
                 {type: 'update-last-message', text: result.text, sessionId: this.#backendNodeId});
             break;
           case ResponseType.ERROR:
-            aiContent.textContent = `Error: ${result.error}`;
+            aiContent.textContent = this.#formatError(result.error);
             this.#syncChannel.postMessage(
-                {type: 'update-last-message', text: `Error: ${result.error}`, sessionId: this.#backendNodeId});
+                {type: 'update-last-message', text: this.#formatError(result.error), sessionId: this.#backendNodeId});
             break;
           case ResponseType.SIDE_EFFECT:
             result.confirm(true);
@@ -316,7 +320,7 @@ class GreenDevFloaty {
     }
   };
 
-  #addMessageInternal(text: string, isUser: boolean): {content: HTMLDivElement, details?: HTMLDivElement} {
+  #addMessageInternal(text: string, isUser: boolean): HTMLDivElement {
     const messageElement = document.createElement('div');
     messageElement.className = `message ${isUser ? 'user-message' : 'ai-message'}`;
 
@@ -325,30 +329,11 @@ class GreenDevFloaty {
     content.textContent = text;
     messageElement.appendChild(content);
 
-    let details: HTMLDivElement|undefined;
-    if (!isUser) {
-      details = document.createElement('div');
-      details.className = 'message-details';
-      details.style.display = 'none';
-      messageElement.appendChild(details);
-
-      const toggle = document.createElement('div');
-      toggle.className = 'message-details-toggle';
-      toggle.textContent = 'Show details';
-      toggle.onclick = () => {
-        if (details) {
-          const isHidden = details.style.display === 'none';
-          details.style.display = isHidden ? 'block' : 'none';
-          toggle.textContent = isHidden ? 'Hide details' : 'Show details';
-        }
-      };
-      messageElement.appendChild(toggle);
-    }
     if (this.#chatContainer) {
       this.#chatContainer.appendChild(messageElement);
       this.#chatContainer.scrollTop = this.#chatContainer.scrollHeight;
     }
-    return {content, details};
+    return content;
   }
 }
 

package/front_end/entrypoints/greendev_floaty/floaty.css

@@ -251,7 +251,7 @@ html, body {
 }
 
 .green-dev-floaty-disclaimer {
-  font-size: 16px;
+  font-size: 15px;
   color: #666;
   text-align: center;
   margin-top: 8px;

package/front_end/entrypoints/greendev_floaty/greendev_floaty.ts

@@ -186,7 +186,7 @@ class GreenDevFloaty {
             aiContent.textContent = result.text;
             break;
           case ResponseType.ERROR:
-            aiContent.textContent = `Error: ${result.error}`;
+            aiContent.textContent = `Error: '${result.error}' - Protip: to use AI features you need to be signed in.`;
             break;
           case ResponseType.THOUGHT:
             if (aiDetails) {

package/front_end/generated/InspectorBackendCommands.ts

@@ -84,7 +84,7 @@ inspectorBackend.registerEnum("Audits.UnencodedDigestError", {MalformedDictionar
 inspectorBackend.registerEnum("Audits.ConnectionAllowlistError", {InvalidHeader: "InvalidHeader", MoreThanOneList: "MoreThanOneList", ItemNotInnerList: "ItemNotInnerList", InvalidAllowlistItemType: "InvalidAllowlistItemType", ReportingEndpointNotToken: "ReportingEndpointNotToken", InvalidUrlPattern: "InvalidUrlPattern"});
 inspectorBackend.registerEnum("Audits.GenericIssueErrorType", {FormLabelForNameError: "FormLabelForNameError", FormDuplicateIdForInputError: "FormDuplicateIdForInputError", FormInputWithNoLabelError: "FormInputWithNoLabelError", FormAutocompleteAttributeEmptyError: "FormAutocompleteAttributeEmptyError", FormEmptyIdAndNameAttributesForInputError: "FormEmptyIdAndNameAttributesForInputError", FormAriaLabelledByToNonExistingIdError: "FormAriaLabelledByToNonExistingIdError", FormInputAssignedAutocompleteValueToIdOrNameAttributeError: "FormInputAssignedAutocompleteValueToIdOrNameAttributeError", FormLabelHasNeitherForNorNestedInputError: "FormLabelHasNeitherForNorNestedInputError", FormLabelForMatchesNonExistingIdError: "FormLabelForMatchesNonExistingIdError", FormInputHasWrongButWellIntendedAutocompleteValueError: "FormInputHasWrongButWellIntendedAutocompleteValueError", ResponseWasBlockedByORB: "ResponseWasBlockedByORB", NavigationEntryMarkedSkippable: "NavigationEntryMarkedSkippable", AutofillAndManualTextPolicyControlledFeaturesInfo: "AutofillAndManualTextPolicyControlledFeaturesInfo", AutofillPolicyControlledFeatureInfo: "AutofillPolicyControlledFeatureInfo", ManualTextPolicyControlledFeatureInfo: "ManualTextPolicyControlledFeatureInfo"});
 inspectorBackend.registerEnum("Audits.ClientHintIssueReason", {MetaTagAllowListInvalidOrigin: "MetaTagAllowListInvalidOrigin", MetaTagModifiedHTML: "MetaTagModifiedHTML"});
-inspectorBackend.registerEnum("Audits.FederatedAuthRequestIssueReason", {ShouldEmbargo: "ShouldEmbargo", TooManyRequests: "TooManyRequests", WellKnownHttpNotFound: "WellKnownHttpNotFound", WellKnownNoResponse: "WellKnownNoResponse", WellKnownInvalidResponse: "WellKnownInvalidResponse", WellKnownListEmpty: "WellKnownListEmpty", WellKnownInvalidContentType: "WellKnownInvalidContentType", ConfigNotInWellKnown: "ConfigNotInWellKnown", WellKnownTooBig: "WellKnownTooBig", ConfigHttpNotFound: "ConfigHttpNotFound", ConfigNoResponse: "ConfigNoResponse", ConfigInvalidResponse: "ConfigInvalidResponse", ConfigInvalidContentType: "ConfigInvalidContentType", ClientMetadataHttpNotFound: "ClientMetadataHttpNotFound", ClientMetadataNoResponse: "ClientMetadataNoResponse", ClientMetadataInvalidResponse: "ClientMetadataInvalidResponse", ClientMetadataInvalidContentType: "ClientMetadataInvalidContentType", IdpNotPotentiallyTrustworthy: "IdpNotPotentiallyTrustworthy", DisabledInSettings: "DisabledInSettings", DisabledInFlags: "DisabledInFlags", ErrorFetchingSignin: "ErrorFetchingSignin", InvalidSigninResponse: "InvalidSigninResponse", AccountsHttpNotFound: "AccountsHttpNotFound", AccountsNoResponse: "AccountsNoResponse", AccountsInvalidResponse: "AccountsInvalidResponse", AccountsListEmpty: "AccountsListEmpty", AccountsInvalidContentType: "AccountsInvalidContentType", IdTokenHttpNotFound: "IdTokenHttpNotFound", IdTokenNoResponse: "IdTokenNoResponse", IdTokenInvalidResponse: "IdTokenInvalidResponse", IdTokenIdpErrorResponse: "IdTokenIdpErrorResponse", IdTokenCrossSiteIdpErrorResponse: "IdTokenCrossSiteIdpErrorResponse", IdTokenInvalidRequest: "IdTokenInvalidRequest", IdTokenInvalidContentType: "IdTokenInvalidContentType", ErrorIdToken: "ErrorIdToken", Canceled: "Canceled", RpPageNotVisible: "RpPageNotVisible", SilentMediationFailure: "SilentMediationFailure", ThirdPartyCookiesBlocked: "ThirdPartyCookiesBlocked", NotSignedInWithIdp: "NotSignedInWithIdp", MissingTransientUserActivation: "MissingTransientUserActivation", ReplacedByActiveMode: "ReplacedByActiveMode", InvalidFieldsSpecified: "InvalidFieldsSpecified", RelyingPartyOriginIsOpaque: "RelyingPartyOriginIsOpaque", TypeNotMatching: "TypeNotMatching", UiDismissedNoEmbargo: "UiDismissedNoEmbargo", CorsError: "CorsError", SuppressedBySegmentationPlatform: "SuppressedBySegmentationPlatform"});
+inspectorBackend.registerEnum("Audits.FederatedAuthRequestIssueReason", {ShouldEmbargo: "ShouldEmbargo", TooManyRequests: "TooManyRequests", WellKnownHttpNotFound: "WellKnownHttpNotFound", WellKnownNoResponse: "WellKnownNoResponse", WellKnownInvalidResponse: "WellKnownInvalidResponse", WellKnownListEmpty: "WellKnownListEmpty", WellKnownInvalidContentType: "WellKnownInvalidContentType", ConfigNotInWellKnown: "ConfigNotInWellKnown", WellKnownTooBig: "WellKnownTooBig", ConfigHttpNotFound: "ConfigHttpNotFound", ConfigNoResponse: "ConfigNoResponse", ConfigInvalidResponse: "ConfigInvalidResponse", ConfigInvalidContentType: "ConfigInvalidContentType", IdpNotPotentiallyTrustworthy: "IdpNotPotentiallyTrustworthy", DisabledInSettings: "DisabledInSettings", DisabledInFlags: "DisabledInFlags", ErrorFetchingSignin: "ErrorFetchingSignin", InvalidSigninResponse: "InvalidSigninResponse", AccountsHttpNotFound: "AccountsHttpNotFound", AccountsNoResponse: "AccountsNoResponse", AccountsInvalidResponse: "AccountsInvalidResponse", AccountsListEmpty: "AccountsListEmpty", AccountsInvalidContentType: "AccountsInvalidContentType", IdTokenHttpNotFound: "IdTokenHttpNotFound", IdTokenNoResponse: "IdTokenNoResponse", IdTokenInvalidResponse: "IdTokenInvalidResponse", IdTokenIdpErrorResponse: "IdTokenIdpErrorResponse", IdTokenCrossSiteIdpErrorResponse: "IdTokenCrossSiteIdpErrorResponse", IdTokenInvalidRequest: "IdTokenInvalidRequest", IdTokenInvalidContentType: "IdTokenInvalidContentType", ErrorIdToken: "ErrorIdToken", Canceled: "Canceled", RpPageNotVisible: "RpPageNotVisible", SilentMediationFailure: "SilentMediationFailure", NotSignedInWithIdp: "NotSignedInWithIdp", MissingTransientUserActivation: "MissingTransientUserActivation", ReplacedByActiveMode: "ReplacedByActiveMode", RelyingPartyOriginIsOpaque: "RelyingPartyOriginIsOpaque", TypeNotMatching: "TypeNotMatching", UiDismissedNoEmbargo: "UiDismissedNoEmbargo", CorsError: "CorsError", SuppressedBySegmentationPlatform: "SuppressedBySegmentationPlatform"});
 inspectorBackend.registerEnum("Audits.FederatedAuthUserInfoRequestIssueReason", {NotSameOrigin: "NotSameOrigin", NotIframe: "NotIframe", NotPotentiallyTrustworthy: "NotPotentiallyTrustworthy", NoAPIPermission: "NoApiPermission", NotSignedInWithIdp: "NotSignedInWithIdp", NoAccountSharingPermission: "NoAccountSharingPermission", InvalidConfigOrWellKnown: "InvalidConfigOrWellKnown", InvalidAccountsResponse: "InvalidAccountsResponse", NoReturningUserFromFetchedAccounts: "NoReturningUserFromFetchedAccounts"});
 inspectorBackend.registerEnum("Audits.PartitioningBlobURLInfo", {BlockedCrossPartitionFetching: "BlockedCrossPartitionFetching", EnforceNoopenerForNavigation: "EnforceNoopenerForNavigation"});
 inspectorBackend.registerEnum("Audits.ElementAccessibilityIssueReason", {DisallowedSelectChild: "DisallowedSelectChild", DisallowedOptGroupChild: "DisallowedOptGroupChild", NonPhrasingContentOptionChild: "NonPhrasingContentOptionChild", InteractiveContentOptionChild: "InteractiveContentOptionChild", InteractiveContentLegendChild: "InteractiveContentLegendChild", InteractiveContentSummaryDescendant: "InteractiveContentSummaryDescendant"});

package/front_end/generated/SupportedCSSProperties.js

@@ -4552,6 +4552,7 @@ export const generatedProperties = [
    "uppercase",
    "lowercase",
    "full-width",
+   "full-size-kana",
    "none",
    "math-auto"
   ],
@@ -7048,6 +7049,7 @@ export const generatedPropertyValues = {
    "uppercase",
    "lowercase",
    "full-width",
+   "full-size-kana",
    "none",
    "math-auto"
   ]

package/front_end/generated/protocol.ts

@@ -1292,10 +1292,6 @@ export namespace Audits {
     ConfigNoResponse = 'ConfigNoResponse',
     ConfigInvalidResponse = 'ConfigInvalidResponse',
     ConfigInvalidContentType = 'ConfigInvalidContentType',
-    ClientMetadataHttpNotFound = 'ClientMetadataHttpNotFound',
-    ClientMetadataNoResponse = 'ClientMetadataNoResponse',
-    ClientMetadataInvalidResponse = 'ClientMetadataInvalidResponse',
-    ClientMetadataInvalidContentType = 'ClientMetadataInvalidContentType',
     IdpNotPotentiallyTrustworthy = 'IdpNotPotentiallyTrustworthy',
     DisabledInSettings = 'DisabledInSettings',
     DisabledInFlags = 'DisabledInFlags',
@@ -1317,11 +1313,9 @@ export namespace Audits {
     Canceled = 'Canceled',
     RpPageNotVisible = 'RpPageNotVisible',
     SilentMediationFailure = 'SilentMediationFailure',
-    ThirdPartyCookiesBlocked = 'ThirdPartyCookiesBlocked',
     NotSignedInWithIdp = 'NotSignedInWithIdp',
     MissingTransientUserActivation = 'MissingTransientUserActivation',
     ReplacedByActiveMode = 'ReplacedByActiveMode',
-    InvalidFieldsSpecified = 'InvalidFieldsSpecified',
     RelyingPartyOriginIsOpaque = 'RelyingPartyOriginIsOpaque',
     TypeNotMatching = 'TypeNotMatching',
     UiDismissedNoEmbargo = 'UiDismissedNoEmbargo',

package/front_end/models/ai_assistance/agents/ContextSelectionAgent.snapshot.txt

@@ -31,7 +31,7 @@ Content:
   "function_declarations": [
     {
       "name": "listNetworkRequests",
-      "description": "Gives a list of network requests including URL, status code, and duration in ms",
+      "description": "Gives a list of network requests including URL, status code, and duration in ms.",
       "parameters": {
         "type": 6,
         "description": "",
@@ -42,7 +42,7 @@ Content:
     },
     {
       "name": "selectNetworkRequest",
-      "description": "From the list of selected request select one to debug",
+      "description": "Selects a specific network request to further provide information about. Use this when asked about network requests issues.",
       "parameters": {
         "type": 6,
         "description": "",
@@ -72,7 +72,7 @@ Content:
     },
     {
       "name": "selectSourceFile",
-      "description": "Returns a list of all files in the project.",
+      "description": "Selects a source file. Use this when asked about files on the page.",
       "parameters": {
         "type": 6,
         "description": "",
@@ -83,7 +83,7 @@ Content:
         "properties": {
           "name": {
             "type": 1,
-            "description": "The name of the file",
+            "description": "The name of the file you want to select.",
             "nullable": false
           }
         }
@@ -91,7 +91,7 @@ Content:
     },
     {
       "name": "performanceRecordAndReload",
-      "description": "Start a new performance recording and reload the page.",
+      "description": "Records a new performance trace, to help debug performance issue.",
       "parameters": {
         "type": 6,
         "description": "",
@@ -102,7 +102,7 @@ Content:
     },
     {
       "name": "inspectDom",
-      "description": "Prompts user to select a DOM element from the page.",
+      "description": "Prompts user to select a DOM element from the page. Use this when you don't know which element is selected.",
       "parameters": {
         "type": 6,
         "description": "",

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

@@ -32,7 +32,7 @@ You aim to help developers of all levels, prioritizing teaching web concepts as
 
 # Considerations
 * Determine what the question the domain of the question is - styling, network, sources, performance or other part of DevTools.
-* When possible proactively try to gather additional data and select context that they user may find relevant to the question they are asking utilizing the function calls available to you.
+* Proactively try to gather additional data. If a select specific data can be selected, select one.
 * Avoid making assumptions without sufficient evidence, and always seek further clarification if needed.
 * Always explore multiple possible explanations for the observed behavior before settling on a conclusion.
 * When presenting solutions, clearly distinguish between the primary cause and contributing factors.
@@ -85,7 +85,7 @@ export class ContextSelectionAgent extends AiAgent<never> {
     this.#onInspectElement = opts.onInspectElement;
 
     this.declareFunction<Record<string, never>>('listNetworkRequests', {
-      description: `Gives a list of network requests including URL, status code, and duration in ms`,
+      description: `Gives a list of network requests including URL, status code, and duration in ms.`,
       parameters: {
         type: Host.AidaClient.ParametersTypes.OBJECT,
         description: '',
@@ -116,6 +116,12 @@ export class ContextSelectionAgent extends AiAgent<never> {
           });
         }
 
+        if (requests.length === 0) {
+          return {
+            error: 'No requests recorded by DevTools',
+          };
+        }
+
         return {
           result: requests,
         };
@@ -123,7 +129,8 @@ export class ContextSelectionAgent extends AiAgent<never> {
     });
 
     this.declareFunction<{url: string}>('selectNetworkRequest', {
-      description: `From the list of selected request select one to debug`,
+      description:
+          `Selects a specific network request to further provide information about. Use this when asked about network requests issues.`,
       parameters: {
         type: Host.AidaClient.ParametersTypes.OBJECT,
         description: '',
@@ -191,7 +198,7 @@ export class ContextSelectionAgent extends AiAgent<never> {
     });
 
     this.declareFunction<{name: string}>('selectSourceFile', {
-      description: `Returns a list of all files in the project.`,
+      description: `Selects a source file. Use this when asked about files on the page.`,
       parameters: {
         type: Host.AidaClient.ParametersTypes.OBJECT,
         description: '',
@@ -200,14 +207,14 @@ export class ContextSelectionAgent extends AiAgent<never> {
         properties: {
           name: {
             type: Host.AidaClient.ParametersTypes.STRING,
-            description: 'The name of the file',
+            description: 'The name of the file you want to select.',
             nullable: false,
           },
         },
       },
       displayInfoFromArgs: args => {
         return {
-          title: lockedString('Getting source file'),
+          title: lockedString('Getting source file…'),
           action: `selectSourceFile(${args.name})`,
         };
       },
@@ -225,7 +232,7 @@ export class ContextSelectionAgent extends AiAgent<never> {
     });
 
     this.declareFunction('performanceRecordAndReload', {
-      description: 'Start a new performance recording and reload the page.',
+      description: 'Records a new performance trace, to help debug performance issue.',
       parameters: {
         type: Host.AidaClient.ParametersTypes.OBJECT,
         description: '',
@@ -254,7 +261,8 @@ export class ContextSelectionAgent extends AiAgent<never> {
     });
 
     this.declareFunction<Record<string, never>>('inspectDom', {
-      description: `Prompts user to select a DOM element from the page.`,
+      description:
+          `Prompts user to select a DOM element from the page. Use this when you don't know which element is selected.`,
       parameters: {
         type: Host.AidaClient.ParametersTypes.OBJECT,
         description: '',
@@ -264,7 +272,7 @@ export class ContextSelectionAgent extends AiAgent<never> {
       },
       displayInfoFromArgs: () => {
         return {
-          title: lockedString('Please select an element on the page...'),
+          title: lockedString('Please select an element on the page…'),
           action: 'selectElement()',
         };
       },

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

@@ -80,10 +80,6 @@ const UIStringsNotTranslate = {
    * @description Title text for request timing details.
    */
   timing: 'Timing',
-  /**
-   * @description Prefix text for response status.
-   */
-  responseStatus: 'Response Status',
   /**
    * @description Title text for request initiator chain.
    */
@@ -178,8 +174,8 @@ async function createContextDetailsForNetworkAgent(
 
   const responseContextDetail: ContextDetail = {
     title: lockedString(UIStringsNotTranslate.response),
-    text: lockedString(UIStringsNotTranslate.responseStatus) + ': ' + request.statusCode + ' ' + request.statusText +
-        `\n\n${formatter.formatResponseHeaders()}` + responseBodyString,
+    text: formatter.formatResponseHeaders() + responseBodyString +
+        `\n\n${formatter.formatStatus()}${formatter.formatFailureReasons()}`,
   };
   const timingContextDetail: ContextDetail = {
     title: lockedString(UIStringsNotTranslate.timing),

package/front_end/models/ai_assistance/data_formatters/NetworkRequestFormatter.ts

@@ -3,6 +3,7 @@
 // found in the LICENSE file.
 
 import type * as SDK from '../../../core/sdk/sdk.js';
+import type * as Protocol from '../../../generated/protocol.js';
 import * as Annotations from '../../annotations/annotations.js';
 import * as Logs from '../../logs/logs.js';
 import * as NetworkTimeCalculator from '../../network_time_calculator/network_time_calculator.js';
@@ -75,6 +76,51 @@ export class NetworkRequestFormatter {
     return '<redacted cross-origin initiator URL>';
   }
 
+  static formatStatus(status: {
+    statusCode: number,
+    statusText: string,
+    failed: boolean,
+    canceled: boolean,
+    preserved: boolean,
+    finished: boolean,
+  }): string {
+    let responseStatus = '';
+    if (status.statusCode) {
+      responseStatus = `Response status: ${status.statusCode} ${status.statusText}\n`;
+    }
+    const flags = [];
+    flags.push(status.finished ? 'finished' : 'pending');
+    if (status.failed) {
+      flags.push('failed');
+    }
+    if (status.canceled) {
+      flags.push('canceled');
+    }
+    if (status.preserved) {
+      flags.push('preserved');
+    }
+    const requestStatus = flags.length > 0 ? `Network request status: ${flags.join(', ')}\n` : '';
+    return `${responseStatus}${requestStatus}`;
+  }
+
+  static formatFailureReasons(reasons: {
+    blockedReason?: Protocol.Network.BlockedReason,
+    corsErrorStatus?: Protocol.Network.CorsErrorStatus,
+    localizedFailDescription?: string|null,
+  }): string {
+    const lines = [];
+    if (reasons.blockedReason) {
+      lines.push(`Blocked reason: ${reasons.blockedReason}`);
+    }
+    if (reasons.corsErrorStatus) {
+      lines.push(`CORS error: ${reasons.corsErrorStatus.corsError} ${reasons.corsErrorStatus.failedParameter}`);
+    }
+    if (reasons.localizedFailDescription) {
+      lines.push(`Fail description: ${reasons.localizedFailDescription}`);
+    }
+    return lines.length > 0 ? `${lines.join('\n')}\n` : '';
+  }
+
   constructor(
       request: SDK.NetworkRequest.NetworkRequest, calculator: NetworkTimeCalculator.NetworkTransferTimeCalculator) {
     this.#request = request;
@@ -111,13 +157,31 @@ ${this.formatRequestHeaders()}
 
 ${this.formatResponseHeaders()}${responseBody}
 
-Response status: ${this.#request.statusCode} ${this.#request.statusText}
-
+${this.formatStatus()}${this.formatFailureReasons()}
 Request timing:\n${this.formatNetworkRequestTiming()}
 
 Request initiator chain:\n${this.formatRequestInitiatorChain()}`;
   }
 
+  formatStatus(): string {
+    return NetworkRequestFormatter.formatStatus({
+      statusCode: this.#request.statusCode,
+      statusText: this.#request.statusText,
+      failed: this.#request.failed,
+      canceled: this.#request.canceled,
+      preserved: this.#request.preserved,
+      finished: this.#request.finished,
+    });
+  }
+
+  formatFailureReasons(): string {
+    return NetworkRequestFormatter.formatFailureReasons({
+      blockedReason: this.#request.blockedReason(),
+      corsErrorStatus: this.#request.corsErrorStatus(),
+      localizedFailDescription: this.#request.localizedFailDescription,
+    });
+  }
+
   /**
    * Note: nothing here should include information from origins other than
    * the request's origin.

package/front_end/models/greendev/Prototypes.ts

@@ -9,8 +9,6 @@ let instance: Prototypes|null = null;
 
 export interface GreenDevSettings {
   inDevToolsFloaty: Common.Settings.Setting<boolean>;
-  inlineWidgets: Common.Settings.Setting<boolean>;
-  artifactViewer: Common.Settings.Setting<boolean>;
   aiAnnotations: Common.Settings.Setting<boolean>;
   copyToGemini: Common.Settings.Setting<boolean>;
 }
@@ -41,21 +39,14 @@ export class Prototypes {
     const inDevToolsFloaty =
         settings.createSetting('greendev-in-devtools-floaty-enabled', false, Common.Settings.SettingStorageType.LOCAL);
 
-    const inlineWidgets =
-        settings.createSetting('greendev-inline-widgets-enabled', false, Common.Settings.SettingStorageType.LOCAL);
-
     const aiAnnotations = settings.createSetting(
         'greendev-ai-annotations-enabled',
         false,
         Common.Settings.SettingStorageType.LOCAL,
     );
-
-    const artifactViewer =
-        settings.createSetting('greendev-artifact-viewer-enabled', false, Common.Settings.SettingStorageType.LOCAL);
-
     const copyToGemini =
         settings.createSetting('greendev-copy-to-gemini-enabled', false, Common.Settings.SettingStorageType.LOCAL);
 
-    return {inDevToolsFloaty, inlineWidgets, aiAnnotations, artifactViewer, copyToGemini};
+    return {inDevToolsFloaty, aiAnnotations, copyToGemini};
   }
 }

package/front_end/models/issues_manager/ConnectionAllowlistIssue.ts

@@ -0,0 +1,75 @@
+// 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 SDK from '../../core/sdk/sdk.js';
+import * as Protocol from '../../generated/protocol.js';
+
+import {Issue, IssueCategory, IssueKind} from './Issue.js';
+import {
+  type LazyMarkdownIssueDescription,
+  type MarkdownIssueDescription,
+  resolveLazyDescription,
+} from './MarkdownIssueDescription.js';
+
+const UIStrings = {
+  /**
+   *@description Title for Connection-Allowlist specification url
+   */
+  connectionAllowlistHeader: 'Connection-Allowlist specification',
+} as const;
+const str_ = i18n.i18n.registerUIStrings('models/issues_manager/ConnectionAllowlistIssue.ts', UIStrings);
+const i18nLazyString = i18n.i18n.getLazilyComputedLocalizedString.bind(undefined, str_);
+
+export class ConnectionAllowlistIssue extends Issue<Protocol.Audits.ConnectionAllowlistIssueDetails> {
+  constructor(
+      issueDetails: Protocol.Audits.ConnectionAllowlistIssueDetails, issuesModel: SDK.IssuesModel.IssuesModel|null) {
+    super(
+        {
+          code: `${Protocol.Audits.InspectorIssueCode.ConnectionAllowlistIssue}::${issueDetails.error}`,
+          umaCode: `${Protocol.Audits.InspectorIssueCode.ConnectionAllowlistIssue}::${issueDetails.error}`,
+        },
+        issueDetails, issuesModel);
+  }
+
+  override primaryKey(): string {
+    return JSON.stringify(this.details());
+  }
+
+  override getDescription(): MarkdownIssueDescription|null {
+    const description: LazyMarkdownIssueDescription = {
+      file: `connectionAllowlist${this.details().error}.md`,
+      links: [
+        {
+          link: 'https://wicg.github.io/private-network-access/#connection-allowlist',
+          linkTitle: i18nLazyString(UIStrings.connectionAllowlistHeader),
+        },
+      ],
+    };
+    return resolveLazyDescription(description);
+  }
+
+  override getCategory(): IssueCategory {
+    return IssueCategory.OTHER;
+  }
+
+  override getKind(): IssueKind {
+    return IssueKind.PAGE_ERROR;
+  }
+
+  override requests(): Iterable<Protocol.Audits.AffectedRequest> {
+    return this.details().request ? [this.details().request] : [];
+  }
+
+  static fromInspectorIssue(
+      issuesModel: SDK.IssuesModel.IssuesModel|null,
+      inspectorIssue: Protocol.Audits.InspectorIssue): ConnectionAllowlistIssue[] {
+    const details = inspectorIssue.details.connectionAllowlistIssueDetails;
+    if (!details) {
+      console.warn('Connection-Allowlist issue without details received.');
+      return [];
+    }
+    return [new ConnectionAllowlistIssue(details, issuesModel)];
+  }
+}

package/front_end/models/issues_manager/FederatedAuthRequestIssue.ts

@@ -109,36 +109,6 @@ const issueDescriptions = new Map<Protocol.Audits.FederatedAuthRequestIssueReaso
       }],
     },
   ],
-  [
-    Protocol.Audits.FederatedAuthRequestIssueReason.ClientMetadataHttpNotFound,
-    {
-      file: 'federatedAuthRequestClientMetadataHttpNotFound.md',
-      links: [{
-        link: 'https://fedidcg.github.io/FedCM/',
-        linkTitle: i18nLazyString(UIStrings.fedCm),
-      }],
-    },
-  ],
-  [
-    Protocol.Audits.FederatedAuthRequestIssueReason.ClientMetadataNoResponse,
-    {
-      file: 'federatedAuthRequestClientMetadataNoResponse.md',
-      links: [{
-        link: 'https://fedidcg.github.io/FedCM/',
-        linkTitle: i18nLazyString(UIStrings.fedCm),
-      }],
-    },
-  ],
-  [
-    Protocol.Audits.FederatedAuthRequestIssueReason.ClientMetadataInvalidResponse,
-    {
-      file: 'federatedAuthRequestClientMetadataInvalidResponse.md',
-      links: [{
-        link: 'https://fedidcg.github.io/FedCM/',
-        linkTitle: i18nLazyString(UIStrings.fedCm),
-      }],
-    },
-  ],
   [
     Protocol.Audits.FederatedAuthRequestIssueReason.ErrorFetchingSignin,
     {

package/front_end/models/issues_manager/IssuesManager.ts

@@ -9,6 +9,7 @@ import * as Protocol from '../../generated/protocol.js';
 import {AttributionReportingIssue} from './AttributionReportingIssue.js';
 import {BounceTrackingIssue} from './BounceTrackingIssue.js';
 import {ClientHintIssue} from './ClientHintIssue.js';
+import {ConnectionAllowlistIssue} from './ConnectionAllowlistIssue.js';
 import {ContentSecurityPolicyIssue} from './ContentSecurityPolicyIssue.js';
 import {CookieDeprecationMetadataIssue} from './CookieDeprecationMetadataIssue.js';
 import {CookieIssue} from './CookieIssue.js';
@@ -144,6 +145,10 @@ const issueCodeHandlers = new Map<
     Protocol.Audits.InspectorIssueCode.UnencodedDigestIssue,
     UnencodedDigestIssue.fromInspectorIssue,
   ],
+  [
+    Protocol.Audits.InspectorIssueCode.ConnectionAllowlistIssue,
+    ConnectionAllowlistIssue.fromInspectorIssue,
+  ],
   [
     Protocol.Audits.InspectorIssueCode.PermissionElementIssue,
     PermissionElementIssue.fromInspectorIssue,

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

@@ -0,0 +1,12 @@
+# An item in the `Connection-Allowlist` header is invalid.
+
+Each item in the `Connection-Allowlist`'s header's [Inner List](sfInnerList)
+must be a [String](sfString) representing a [URL Pattern](urlPatternSpec), or
+the [Token](sfToken) `response-origin`.
+
+For example, the following header allows connections to (only)
+`https://example.com/` and the origin from which the response was delivered:
+
+```
+Connection-Allowlist: ("https://example.com" response-origin)
+```

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

@@ -0,0 +1,12 @@
+# The `Connection-Allowlist` header is not formatted as a Structured Field List.
+
+Responses' `Connection-Allowlist` header should be formatted as a [List](sfList)
+containing a single [Inner List](sfInnerList) that declares the allowed set of
+[URL Patterns](urlPatternSpec) for a given context.
+
+For example, the following header allows connections to (only)
+`https://example.com/`:
+
+```
+Connection-Allowlist: ("https://example.com")
+```

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

@@ -0,0 +1,8 @@
+# An item in the `Connection-Allowlist` header is not a valid URL pattern.
+
+Each item in the `Connection-Allowlist` header must be a valid
+[URL Pattern](urlPatternSpec) that can be used to match against the request's
+origin.
+
+Note that our current implementation does not allow regular expressions to be
+used as part of the pattern.