chrome-devtools-frontend 1.0.1473514 → 1.0.1506453

package/front_end/models/extensions/ExtensionServer.test.ts

@@ -8,6 +8,7 @@ import * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import * as Protocol from '../../generated/protocol.js';
 import {createTarget, expectConsoleLogs} from '../../testing/EnvironmentHelpers.js';
+import {spyCall} from '../../testing/ExpectStubCall.js';
 import {
   describeWithDevtoolsExtension,
   getExtensionOrigin,
@@ -15,6 +16,7 @@ import {
 import {MockProtocolBackend} from '../../testing/MockScopeChain.js';
 import {addChildFrame, FRAME_URL, getMainFrame} from '../../testing/ResourceTreeHelpers.js';
 import {encodeSourceMap} from '../../testing/SourceMapEncoder.js';
+import * as Components from '../../ui/legacy/components/utils/utils.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as Bindings from '../bindings/bindings.js';
 import * as Extensions from '../extensions/extensions.js';
@@ -95,11 +97,23 @@ describeWithDevtoolsExtension('Extensions', {}, context => {
       const targetManager = target.targetManager();
       const resourceMapping =
           new Bindings.ResourceMapping.ResourceMapping(targetManager, Workspace.Workspace.WorkspaceImpl.instance());
-      Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance(
-          {forceNew: true, resourceMapping, targetManager});
+      const ignoreListManager = Workspace.IgnoreListManager.IgnoreListManager.instance({forceNew: true});
+      Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance({
+        forceNew: true,
+        resourceMapping,
+        targetManager,
+        ignoreListManager,
+      });
     });
 
     describe('setFunctionRangesForScript', () => {
+      expectConsoleLogs({
+        error: [
+          'Extension server error: Invalid argument command: expected a source map script resource for url: https://example.com/',
+          'Extension server error: Invalid argument command: expected valid scriptUrl and non-empty NamedFunctionRanges'
+        ],
+      });
+
       const validFunctionRanges = [{start: {line: 0, column: 0}, end: {line: 10, column: 1}, name: 'foo'}];
       it('correctly calls DebuggerWorkspaceBindings.setFunctionRanges via Resource.setFunctionRangesForScript API',
          async () => {
@@ -169,10 +183,64 @@ describeWithDevtoolsExtension('Extensions', {}, context => {
   });
 });
 
+describeWithDevtoolsExtension('Extensions', {}, context => {
+  beforeEach(() => {
+    createTarget().setInspectedURL(urlString`http://example.com`);
+  });
+
+  it('can register and unregister a global open resource handler', async () => {
+    const registerLinkHandlerSpy = spyCall(Components.Linkifier.Linkifier, 'registerLinkHandler');
+    const unregisterLinkHandlerSpy = spyCall(Components.Linkifier.Linkifier, 'unregisterLinkHandler');
+
+    // Register without a specific scheme (global handler).
+    context.chrome.devtools?.panels.setOpenResourceHandler(() => {});
+
+    const registration = await (await registerLinkHandlerSpy).args[0];
+    assert.strictEqual(registration.title, 'TestExtension');
+    assert.isUndefined(registration.scheme);
+    assert.isFunction(registration.handler);
+    assert.isFunction(registration.shouldHandleOpenResource);
+
+    // Now unregister the extension.
+    context.chrome.devtools?.panels.setOpenResourceHandler();
+
+    const unregistration = await (await unregisterLinkHandlerSpy).args[0];
+    assert.strictEqual(unregistration.title, 'TestExtension');
+    assert.isUndefined(unregistration.scheme);
+    assert.isFunction(unregistration.handler);
+    assert.isFunction(unregistration.shouldHandleOpenResource);
+  });
+
+  it('can register and unregister a scheme specific open resource handler', async () => {
+    const registerLinkHandlerSpy = spyCall(Components.Linkifier.Linkifier, 'registerLinkHandler');
+    const unregisterLinkHandlerSpy = spyCall(Components.Linkifier.Linkifier, 'unregisterLinkHandler');
+
+    context.chrome.devtools?.panels.setOpenResourceHandler(() => {}, 'foo-extension:');
+
+    const registration = await (await registerLinkHandlerSpy).args[0];
+    assert.strictEqual(registration.title, 'TestExtension');
+    assert.strictEqual(registration.scheme, 'foo-extension:');
+    assert.isFunction(registration.handler);
+    assert.isFunction(registration.shouldHandleOpenResource);
+
+    // Now unregister the extension.
+    context.chrome.devtools?.panels.setOpenResourceHandler();
+
+    const unregistration = await (await unregisterLinkHandlerSpy).args[0];
+    assert.strictEqual(unregistration.title, 'TestExtension');
+    assert.isUndefined(unregistration.scheme);
+    assert.isFunction(unregistration.handler);
+    assert.isFunction(unregistration.shouldHandleOpenResource);
+  });
+});
+
 describeWithDevtoolsExtension('Extensions', {}, context => {
   expectConsoleLogs({
     warn: ['evaluate: the main frame is not yet available'],
-    error: ['Extension server error: Object not found: <top>'],
+    error: [
+      'Extension server error: Object not found: <top>',
+      'Extension server error: Operation failed: https://example.com/ has no execution context'
+    ],
   });
   beforeEach(() => {
     createTarget().setInspectedURL(urlString`http://example.com`);
@@ -619,15 +687,14 @@ describeWithDevtoolsExtension('Runtime hosts policy', {hostsPolicy}, context =>
   });
 
   async function createUISourceCode(
-      project: Bindings.ContentProviderBasedProject.ContentProviderBasedProject, url: Platform.DevToolsPath.UrlString) {
+      project: Bindings.ContentProviderBasedProject.ContentProviderBasedProject, url: Platform.DevToolsPath.UrlString,
+      contentType = Common.ResourceType.resourceTypes.Document) {
     const mimeType = 'text/html';
     const dataProvider = () =>
         Promise.resolve(new TextUtils.ContentData.ContentData('content', /* isBase64 */ false, mimeType));
     project.addUISourceCodeWithProvider(
-        new Workspace.UISourceCode.UISourceCode(project, url, Common.ResourceType.resourceTypes.Document),
-        new TextUtils.StaticContentProvider.StaticContentProvider(
-            url, Common.ResourceType.resourceTypes.Document, dataProvider),
-        null, mimeType);
+        new Workspace.UISourceCode.UISourceCode(project, url, contentType),
+        new TextUtils.StaticContentProvider.StaticContentProvider(url, contentType, dataProvider), null, mimeType);
     await project.uiSourceCodeForURL(url)?.requestContentData();
   }
 
@@ -658,6 +725,32 @@ describeWithDevtoolsExtension('Runtime hosts policy', {hostsPolicy}, context =>
     ]);
   });
 
+  it('allows arbitrary schemes in sourceURL comments, as long as the inspected target is allowed', async () => {
+    const target = createTarget({id: 'target' as Protocol.Target.TargetID});
+    target.setInspectedURL(allowedUrl);
+
+    const script = sinon.createStubInstance(SDK.Script.Script, {target, contentURL: blockedUrl});
+    script.hasSourceURL = true;
+    const workspaceBinding = sinon.createStubInstance(Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding);
+    workspaceBinding.scriptsForUISourceCode.callsFake(uiSourceCode => {
+      if (uiSourceCode.contentURL() === blockedUrl) {
+        return [script];
+      }
+      return [];
+    });
+    sinon.stub(Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding, 'instance').returns(workspaceBinding);
+    const project = new Bindings.ContentProviderBasedProject.ContentProviderBasedProject(
+        Workspace.Workspace.WorkspaceImpl.instance(), target.id(), Workspace.Workspace.projectTypes.Network, '',
+        false /* isServiceProject */);
+    await createUISourceCode(project, blockedUrl, Common.ResourceType.resourceTypes.Script);
+    await createUISourceCode(project, allowedUrl, Common.ResourceType.resourceTypes.Script);
+
+    assert.exists(context.chrome.devtools);
+    const resources =
+        await new Promise<Chrome.DevTools.Resource[]>(r => context.chrome.devtools?.inspectedWindow.getResources(r));
+    assert.deepEqual(resources.map(r => r.url), [blockedUrl, allowedUrl]);
+  });
+
   function createRequest(
       networkManager: SDK.NetworkManager.NetworkManager, frameId: Protocol.Page.FrameId,
       requestId: Protocol.Network.RequestId, url: Platform.DevToolsPath.UrlString): void {
@@ -831,8 +924,13 @@ describeWithDevtoolsExtension('Wasm extension API', {}, context => {
     const targetManager = target.targetManager();
     const resourceMapping =
         new Bindings.ResourceMapping.ResourceMapping(targetManager, Workspace.Workspace.WorkspaceImpl.instance());
-    Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance(
-        {forceNew: true, resourceMapping, targetManager});
+    const ignoreListManager = Workspace.IgnoreListManager.IgnoreListManager.instance({forceNew: true});
+    Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance({
+      forceNew: true,
+      resourceMapping,
+      targetManager,
+      ignoreListManager,
+    });
 
     const callFrame = sinon.createStubInstance(SDK.DebuggerModel.CallFrame);
     callFrame.debuggerModel = new SDK.DebuggerModel.DebuggerModel(target);
@@ -960,9 +1058,13 @@ for (const allowFileAccess of [true, false]) {
           const workspace = Workspace.Workspace.WorkspaceImpl.instance();
           const resourceMapping = new Bindings.ResourceMapping.ResourceMapping(targetManager, workspace);
           target.setInspectedURL(urlString`http://example.com`);
-          const debuggerWorkspaceBinding = Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance(
-              {forceNew: true, targetManager, resourceMapping});
-          Bindings.IgnoreListManager.IgnoreListManager.instance({forceNew: true, debuggerWorkspaceBinding});
+          const ignoreListManager = Workspace.IgnoreListManager.IgnoreListManager.instance({forceNew: true});
+          Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance({
+            forceNew: true,
+            resourceMapping,
+            targetManager,
+            ignoreListManager,
+          });
         });
 
         it('passes allowFileAccess to the LanguageExtensionEndpoint', async () => {
@@ -1023,10 +1125,14 @@ describeWithDevtoolsExtension('validate attachSourceMapURL ', {}, context => {
     const targetManager = target.targetManager();
     const workspace = Workspace.Workspace.WorkspaceImpl.instance();
     const resourceMapping = new Bindings.ResourceMapping.ResourceMapping(targetManager, workspace);
-    const debuggerWorkspaceBinding = Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance(
-        {forceNew: false, resourceMapping, targetManager});
+    const ignoreListManager = Workspace.IgnoreListManager.IgnoreListManager.instance({forceNew: true});
+    const debuggerWorkspaceBinding = Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance({
+      forceNew: true,
+      resourceMapping,
+      targetManager,
+      ignoreListManager,
+    });
     const backend = new MockProtocolBackend();
-    Bindings.IgnoreListManager.IgnoreListManager.instance({forceNew: false, debuggerWorkspaceBinding});
 
     // Before any script is registered, there shouldn't be any uiSourceCodes.
     assert.isNull(Workspace.Workspace.WorkspaceImpl.instance().uiSourceCodeForURL(scriptInfo.url));

package/front_end/models/extensions/ExtensionServer.ts

@@ -106,6 +106,7 @@ export class HostsPolicy {
 }
 
 class RegisteredExtension {
+  openResourceScheme: null|string = null;
   constructor(readonly name: string, readonly hostsPolicy: HostsPolicy, readonly allowFileAccess: boolean) {
   }
 
@@ -118,6 +119,10 @@ class RegisteredExtension {
       return false;
     }
 
+    if (this.openResourceScheme && inspectedURL.startsWith(this.openResourceScheme)) {
+      return true;
+    }
+
     if (!ExtensionServer.canInspectURL(inspectedURL)) {
       return false;
     }
@@ -458,14 +463,11 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     if (!scriptUrl || !ranges?.length) {
       return this.status.E_BADARG('command', 'expected valid scriptUrl and non-empty NamedFunctionRanges');
     }
-    if (!this.extensionAllowedOnURL(scriptUrl as Platform.DevToolsPath.UrlString, port)) {
-      return this.status.E_FAILED('Permission denied');
-    }
-    const uiSourceCode =
-        Workspace.Workspace.WorkspaceImpl.instance().uiSourceCodeForURL(scriptUrl as Platform.DevToolsPath.UrlString);
-    if (!uiSourceCode) {
-      return this.status.E_NOTFOUND(scriptUrl);
+    const resource = this.lookupAllowedUISourceCode(scriptUrl as Platform.DevToolsPath.UrlString, port);
+    if ('error' in resource) {
+      return resource.error;
     }
+    const {uiSourceCode} = resource;
     if (!uiSourceCode.contentType().isScript() || !uiSourceCode.contentType().isFromSourceMap()) {
       return this.status.E_BADARG('command', `expected a source map script resource for url: ${scriptUrl}`);
     }
@@ -817,11 +819,23 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     if (!extension) {
       throw new Error('Received a message from an unregistered extension');
     }
+    if (message.urlScheme) {
+      extension.openResourceScheme = message.urlScheme;
+    }
+    const extensionOrigin = this.getExtensionOrigin(port);
     const {name} = extension;
+    const registration = {
+      title: name,
+      origin: extensionOrigin,
+      scheme: message.urlScheme,
+      handler: this.handleOpenURL.bind(this, port),
+      shouldHandleOpenResource: (url: Platform.DevToolsPath.UrlString, schemes: Set<string>) =>
+          Components.Linkifier.Linkifier.shouldHandleOpenResource(extension.openResourceScheme, url, schemes),
+    };
     if (message.handlerPresent) {
-      Components.Linkifier.Linkifier.registerLinkHandler(name, this.handleOpenURL.bind(this, port));
+      Components.Linkifier.Linkifier.registerLinkHandler(registration);
     } else {
-      Components.Linkifier.Linkifier.unregisterLinkHandler(name);
+      Components.Linkifier.Linkifier.unregisterLinkHandler(registration);
     }
     return undefined;
   }
@@ -846,10 +860,26 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
   }
 
   private handleOpenURL(
-      port: MessagePort, contentProvider: TextUtils.ContentProvider.ContentProvider, lineNumber: number): void {
-    if (this.extensionAllowedOnURL(contentProvider.contentURL(), port)) {
-      port.postMessage(
-          {command: 'open-resource', resource: this.makeResource(contentProvider), lineNumber: lineNumber + 1});
+      port: MessagePort, contentProviderOrUrl: TextUtils.ContentProvider.ContentProvider|string, lineNumber?: number,
+      columnNumber?: number): void {
+    let resource: {url: string, type: string};
+    let isAllowed: boolean;
+    if (typeof contentProviderOrUrl !== 'string') {
+      resource = this.makeResource(contentProviderOrUrl);
+      isAllowed = this.extensionAllowedOnContentProvider(contentProviderOrUrl, port);
+    } else {
+      const url = contentProviderOrUrl as Platform.DevToolsPath.UrlString;
+      resource = {url, type: Common.ResourceType.resourceTypes.Other.name()};
+      isAllowed = this.extensionAllowedOnURL(url, port);
+    }
+
+    if (isAllowed) {
+      port.postMessage({
+        command: 'open-resource',
+        resource,
+        lineNumber: lineNumber ? lineNumber + 1 : undefined,
+        columnNumber: columnNumber ? columnNumber + 1 : undefined,
+      });
     }
   }
 
@@ -859,6 +889,58 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     return Boolean(extension?.isAllowedOnTarget(url));
   }
 
+  /**
+   * Slightly more permissive as {@link extensionAllowedOnURL}: This method also permits
+   * UISourceCodes that originate from a {@link SDK.Script.Script} with a sourceURL magic comment as
+   * long as the corresponding target is permitted.
+   */
+  private extensionAllowedOnContentProvider(
+      contentProvider: TextUtils.ContentProvider.ContentProvider, port: MessagePort): boolean {
+    if (!(contentProvider instanceof Workspace.UISourceCode.UISourceCode)) {
+      return this.extensionAllowedOnURL(contentProvider.contentURL(), port);
+    }
+
+    if (contentProvider.contentType() !== Common.ResourceType.resourceTypes.Script) {
+      // We only check sourceURL magic comments for scripts (excluding ones coming from source maps).
+      return this.extensionAllowedOnURL(contentProvider.contentURL(), port);
+    }
+
+    const scripts =
+        Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance().scriptsForUISourceCode(contentProvider);
+    if (scripts.length === 0) {
+      return this.extensionAllowedOnURL(contentProvider.contentURL(), port);
+    }
+
+    return scripts.every(script => {
+      if (script.hasSourceURL) {
+        return this.extensionAllowedOnTarget(script.target(), port);
+      }
+      return this.extensionAllowedOnURL(script.contentURL(), port);
+    });
+  }
+
+  /**
+   * This method prefers returning 'Permission denied' errors if restricted resources are not found,
+   * rather then NOTFOUND. This prevents extensions from being able to fish for restricted resources.
+   */
+  private lookupAllowedUISourceCode(url: Platform.DevToolsPath.UrlString, port: MessagePort):
+      {uiSourceCode: Workspace.UISourceCode.UISourceCode}|{
+    error: Record,
+  }
+  {
+    const uiSourceCode = Workspace.Workspace.WorkspaceImpl.instance().uiSourceCodeForURL(url);
+    if (!uiSourceCode && !this.extensionAllowedOnURL(url, port)) {
+      return {error: this.status.E_FAILED('Permission denied')};
+    }
+    if (!uiSourceCode) {
+      return {error: this.status.E_NOTFOUND(url)};
+    }
+    if (!this.extensionAllowedOnContentProvider(uiSourceCode, port)) {
+      return {error: this.status.E_FAILED('Permission denied')};
+    }
+    return {uiSourceCode};
+  }
+
   private extensionAllowedOnTarget(target: SDK.Target.Target, port: MessagePort): boolean {
     return this.extensionAllowedOnURL(target.inspectedURL(), port);
   }
@@ -948,7 +1030,7 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     function pushResourceData(
         this: ExtensionServer, contentProvider: TextUtils.ContentProvider.ContentProvider): boolean {
       if (!resources.has(contentProvider.contentURL()) &&
-          this.extensionAllowedOnURL(contentProvider.contentURL(), port)) {
+          this.extensionAllowedOnContentProvider(contentProvider, port)) {
         resources.set(contentProvider.contentURL(), this.makeResource(contentProvider));
       }
       return false;
@@ -971,7 +1053,7 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
   private async getResourceContent(
       contentProvider: TextUtils.ContentProvider.ContentProvider, message: PrivateAPI.ExtensionServerRequestMessage,
       port: MessagePort): Promise<void> {
-    if (!this.extensionAllowedOnURL(contentProvider.contentURL(), port)) {
+    if (!this.extensionAllowedOnContentProvider(contentProvider, port)) {
       this.dispatchCallback(message.requestId, port, this.status.E_FAILED('Permission denied'));
       return undefined;
     }
@@ -1021,20 +1103,16 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
       return this.status.E_FAILED('Expected a source map URL but got null');
     }
 
-    const url = message.contentUrl as Platform.DevToolsPath.UrlString;
-    if (!this.extensionAllowedOnURL(url, port)) {
-      return this.status.E_FAILED('Permission denied');
-    }
-    const contentProvider = Workspace.Workspace.WorkspaceImpl.instance().uiSourceCodeForURL(url);
-    if (!contentProvider) {
-      return this.status.E_NOTFOUND(url);
+    const resource = this.lookupAllowedUISourceCode(message.contentUrl as Platform.DevToolsPath.UrlString, port);
+    if ('error' in resource) {
+      return resource.error;
     }
 
     const debuggerBindingsInstance = Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance();
-    const scriptFiles = debuggerBindingsInstance.scriptsForUISourceCode(contentProvider);
+    const scriptFiles = debuggerBindingsInstance.scriptsForUISourceCode(resource.uiSourceCode);
     if (scriptFiles.length > 0) {
       for (const script of scriptFiles) {
-        const resourceFile = debuggerBindingsInstance.scriptFile(contentProvider, script.debuggerModel);
+        const resourceFile = debuggerBindingsInstance.scriptFile(resource.uiSourceCode, script.debuggerModel);
         resourceFile?.addSourceMapURL(message.sourceMapURL as Platform.DevToolsPath.UrlString);
       }
     }
@@ -1052,13 +1130,13 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
       const response = error ? this.status.E_FAILED(error) : this.status.OK();
       this.dispatchCallback(requestId, port, response);
     }
-    if (!this.extensionAllowedOnURL(url as Platform.DevToolsPath.UrlString, port)) {
-      return this.status.E_FAILED('Permission denied');
-    }
 
-    const uiSourceCode =
-        Workspace.Workspace.WorkspaceImpl.instance().uiSourceCodeForURL(url as Platform.DevToolsPath.UrlString);
-    if (!uiSourceCode?.contentType().isDocumentOrScriptOrStyleSheet()) {
+    const resource = this.lookupAllowedUISourceCode(url as Platform.DevToolsPath.UrlString, port);
+    if ('error' in resource) {
+      return resource.error;
+    }
+    const {uiSourceCode} = resource;
+    if (!uiSourceCode.contentType().isDocumentOrScriptOrStyleSheet()) {
       const resource = SDK.ResourceTreeModel.ResourceTreeModel.resourceForURL(url as Platform.DevToolsPath.UrlString);
       if (!resource) {
         return this.status.E_NOTFOUND(url);
@@ -1545,7 +1623,12 @@ class ExtensionServerPanelView extends UI.View.SimpleView {
   private readonly panel: UI.Panel.Panel;
 
   constructor(name: string, title: Platform.UIString.LocalizedString, panel: UI.Panel.Panel) {
-    super(title);
+    // The `viewId` here is to satisfy the `SimpleView` constructor needs, but isn't actually
+    // used anywhere, since we override the `viewId()` method below.  Ideally we'd pass the
+    // `name` as `viewId` to the constructor, but that doesn't work, since the `name` is not
+    // necessarily in Kebab case.
+    const viewId = Platform.StringUtilities.toKebabCase(title);
+    super({title, viewId});
     this.name = name;
     this.panel = panel;
   }

package/front_end/models/extensions/ExtensionView.ts

@@ -51,7 +51,7 @@ const DEFAULT_VIEW = (input: ViewInput, output: ViewOutput, target: HTMLElement)
     ${ref(element => {output.iframe = element as HTMLIFrameElement; })}
     src=${input.src}
     class=${input.className}
-    @load=${input.onLoad}></iframe>`, target, {host: input});
+    @load=${input.onLoad}></iframe>`, target);
   // clang-format on
 };
 

package/front_end/models/extensions/LanguageExtensionEndpoint.ts

@@ -85,7 +85,8 @@ export class LanguageExtensionEndpoint implements Bindings.DebuggerLanguagePlugi
     };
   }
 
-  /** Notify the plugin about a new script
+  /**
+   * Notify the plugin about a new script
    */
   addRawModule(rawModuleId: string, symbolsURL: string, rawModule: Chrome.DevTools.RawModule): Promise<string[]> {
     if (!this.canAccessURL(symbolsURL) || !this.canAccessURL(rawModule.url)) {
@@ -102,7 +103,8 @@ export class LanguageExtensionEndpoint implements Bindings.DebuggerLanguagePlugi
     return this.endpoint.sendRequest(PrivateAPI.LanguageExtensionPluginCommands.RemoveRawModule, {rawModuleId});
   }
 
-  /** Find locations in raw modules from a location in a source file
+  /**
+   * Find locations in raw modules from a location in a source file
    */
   sourceLocationToRawLocation(sourceLocation: Chrome.DevTools.SourceLocation):
       Promise<Chrome.DevTools.RawLocationRange[]> {
@@ -110,7 +112,8 @@ export class LanguageExtensionEndpoint implements Bindings.DebuggerLanguagePlugi
         PrivateAPI.LanguageExtensionPluginCommands.SourceLocationToRawLocation, {sourceLocation});
   }
 
-  /** Find locations in source files from a location in a raw module
+  /**
+   * Find locations in source files from a location in a raw module
    */
   rawLocationToSourceLocation(rawLocation: Chrome.DevTools.RawLocation): Promise<Chrome.DevTools.SourceLocation[]> {
     return this.endpoint.sendRequest(
@@ -121,13 +124,15 @@ export class LanguageExtensionEndpoint implements Bindings.DebuggerLanguagePlugi
     return this.endpoint.sendRequest(PrivateAPI.LanguageExtensionPluginCommands.GetScopeInfo, {type});
   }
 
-  /** List all variables in lexical scope at a given location in a raw module
+  /**
+   * List all variables in lexical scope at a given location in a raw module
    */
   listVariablesInScope(rawLocation: Chrome.DevTools.RawLocation): Promise<Chrome.DevTools.Variable[]> {
     return this.endpoint.sendRequest(PrivateAPI.LanguageExtensionPluginCommands.ListVariablesInScope, {rawLocation});
   }
 
-  /** List all function names (including inlined frames) at location
+  /**
+   * List all function names (including inlined frames) at location
    */
   getFunctionInfo(rawLocation: Chrome.DevTools.RawLocation): Promise<{
     frames: Chrome.DevTools.FunctionInfo[],
@@ -135,7 +140,8 @@ export class LanguageExtensionEndpoint implements Bindings.DebuggerLanguagePlugi
     return this.endpoint.sendRequest(PrivateAPI.LanguageExtensionPluginCommands.GetFunctionInfo, {rawLocation});
   }
 
-  /** Find locations in raw modules corresponding to the inline function
+  /**
+   * Find locations in raw modules corresponding to the inline function
    *  that rawLocation is in.
    */
   getInlinedFunctionRanges(rawLocation: Chrome.DevTools.RawLocation): Promise<Chrome.DevTools.RawLocationRange[]> {
@@ -143,7 +149,8 @@ export class LanguageExtensionEndpoint implements Bindings.DebuggerLanguagePlugi
         PrivateAPI.LanguageExtensionPluginCommands.GetInlinedFunctionRanges, {rawLocation});
   }
 
-  /** Find locations in raw modules corresponding to inline functions
+  /**
+   * Find locations in raw modules corresponding to inline functions
    *  called by the function or inline frame that rawLocation is in.
    */
   getInlinedCalleesRanges(rawLocation: Chrome.DevTools.RawLocation): Promise<Chrome.DevTools.RawLocationRange[]> {

package/front_end/models/har/HARFormat.ts

@@ -263,7 +263,7 @@ class HARResponse extends HARBase {
   }
 }
 
-class HARCookie extends HARBase {
+export class HARCookie extends HARBase {
   name: string;
   value: string;
   path: string|undefined;

package/front_end/models/har/Importer.test.ts

@@ -79,6 +79,12 @@ const exampleLog = new HAR.HARFormat.HARLog({
         ],
         headersSize: -1,
         bodySize: 109,
+        cookies: [
+          {
+            name: 'Foo',
+            value: 'bar',
+          },
+        ],
       },
       response: {
         status: 200,
@@ -90,6 +96,12 @@ const exampleLog = new HAR.HARFormat.HARLog({
           mimeType: 'application/json',
           text: 'console.log(\'hello world\');',
         },
+        cookies: [
+          {
+            name: 'MyAwesomeCookie',
+            value: 'Secret!',
+          },
+        ],
         redirectURL: '',
         headersSize: -1,
         bodySize: -1,
@@ -159,6 +171,12 @@ const exampleLog = new HAR.HARFormat.HARLog({
         ],
         headersSize: -1,
         bodySize: 109,
+        cookies: [
+          {
+            name: 'Foo',
+            value: 'bar',
+          },
+        ],
       },
       response: {
         status: 200,
@@ -170,6 +188,12 @@ const exampleLog = new HAR.HARFormat.HARLog({
           mimeType: 'text/plain',
           text: '<html>Hello, World!</html>',
         },
+        cookies: [
+          {
+            name: 'MyAwesomeCookie',
+            value: 'Secret!',
+          },
+        ],
         redirectURL: '',
         headersSize: -1,
         bodySize: -1,
@@ -310,4 +334,20 @@ describe('HAR Importer', () => {
       assert.strictEqual(request.connectionId, '1');
     }
   });
+
+  it('Parses the request cookies correctly', () => {
+    for (const request of requests) {
+      assert.lengthOf(request.includedRequestCookies(), 1);
+      assert.strictEqual(request.includedRequestCookies()[0].cookie.name(), 'Foo');
+      assert.strictEqual(request.includedRequestCookies()[0].cookie.value(), 'bar');
+    }
+  });
+
+  it('Parses the response cookies correctly', () => {
+    for (const request of requests) {
+      assert.lengthOf(request.responseCookies, 1);
+      assert.strictEqual(request.responseCookies[0].name(), 'MyAwesomeCookie');
+      assert.strictEqual(request.responseCookies[0].value(), 'Secret!');
+    }
+  });
 });

package/front_end/models/har/Importer.ts

@@ -8,7 +8,7 @@ import * as SDK from '../../core/sdk/sdk.js';
 import * as Protocol from '../../generated/protocol.js';
 import * as TextUtils from '../text_utils/text_utils.js';
 
-import type {HAREntry, HARLog, HARPage, HARTimings} from './HARFormat.js';
+import type {HARCookie, HAREntry, HARLog, HARPage, HARTimings} from './HARFormat.js';
 
 export class Importer {
   static requestsFromHARLog(log: HARLog): SDK.NetworkRequest.NetworkRequest[] {
@@ -62,6 +62,26 @@ export class Importer {
     return pageLoad;
   }
 
+  static fillCookieFromHARCookie(type: SDK.Cookie.Type, harCookie: HARCookie): SDK.Cookie.Cookie {
+    const cookie = new SDK.Cookie.Cookie(harCookie.name, harCookie.value, type);
+    if (harCookie.path) {
+      cookie.addAttribute(SDK.Cookie.Attribute.PATH, harCookie.path);
+    }
+    if (harCookie.domain) {
+      cookie.addAttribute(SDK.Cookie.Attribute.DOMAIN, harCookie.domain);
+    }
+    if (harCookie.expires) {
+      cookie.addAttribute(SDK.Cookie.Attribute.EXPIRES, harCookie.expires.getTime());
+    }
+    if (harCookie.httpOnly) {
+      cookie.addAttribute(SDK.Cookie.Attribute.HTTP_ONLY);
+    }
+    if (harCookie.secure) {
+      cookie.addAttribute(SDK.Cookie.Attribute.SECURE);
+    }
+    return cookie;
+  }
+
   static fillRequestFromHAREntry(
       request: SDK.NetworkRequest.NetworkRequest, entry: HAREntry, pageLoad: SDK.PageLoad.PageLoad|undefined): void {
     // Request data.
@@ -124,6 +144,20 @@ export class Importer {
     request.setRemoteAddress(entry.serverIPAddress || '', Number(entry.connection) || 80);
     request.setResourceType(Importer.getResourceType(request, entry, pageLoad));
 
+    // Request cookies.
+    const includedRequestCookies = entry.request.cookies.map(
+        cookie => ({
+          cookie: this.fillCookieFromHARCookie(SDK.Cookie.Type.REQUEST, cookie),
+          exemptionReason: undefined,
+        }),
+    );
+    request.setIncludedRequestCookies(includedRequestCookies);
+
+    // Response cookies.
+    const responseCookies =
+        entry.response.cookies.map(this.fillCookieFromHARCookie.bind(this, SDK.Cookie.Type.RESPONSE));
+    request.responseCookies = responseCookies;
+
     const priority = entry.customAsString('priority');
     // @ts-expect-error This accesses the globalThis['Protocol'] where the enum is an actual JS object and not just a TS const enum.
     if (priority && Protocol.Network.ResourcePriority.hasOwnProperty(priority)) {