chrome-devtools-frontend 1.0.1380117 → 1.0.1386602

package/front_end/models/crux-manager/CrUXManager.test.ts

@@ -139,6 +139,7 @@ describeWithMockConnection('CrUXManager', () => {
         'url-DESKTOP': mockResponse(),
         'url-PHONE': mockResponse(),
         'url-TABLET': null,
+        warnings: [],
       });
 
       assert.deepStrictEqual(fetchBodies, [
@@ -223,6 +224,7 @@ describeWithMockConnection('CrUXManager', () => {
         'url-DESKTOP': null,
         'url-PHONE': null,
         'url-TABLET': null,
+        warnings: [],
       });
     });
 
@@ -304,6 +306,17 @@ describeWithMockConnection('CrUXManager', () => {
 
     beforeEach(() => {
       getFieldDataMock = sinon.stub(cruxManager, 'getFieldDataForPage');
+      getFieldDataMock.resolves({
+        'origin-ALL': mockResponse(),
+        'origin-DESKTOP': mockResponse(),
+        'origin-PHONE': mockResponse(),
+        'origin-TABLET': null,
+        'url-ALL': mockResponse(),
+        'url-DESKTOP': mockResponse(),
+        'url-PHONE': mockResponse(),
+        'url-TABLET': null,
+        warnings: [],
+      });
     });
 
     afterEach(() => {
@@ -320,8 +333,9 @@ describeWithMockConnection('CrUXManager', () => {
         isPrimaryFrame: () => false,
       } as SDK.ResourceTreeModel.ResourceTreeFrame);
 
-      await cruxManager.getFieldDataForCurrentPage();
+      const result = await cruxManager.getFieldDataForCurrentPage();
 
+      assert.deepStrictEqual(result.warnings, []);
       assert.strictEqual(getFieldDataMock.callCount, 1);
       assert.strictEqual(getFieldDataMock.firstCall.args[0], 'https://example.com/main/');
     });
@@ -331,8 +345,9 @@ describeWithMockConnection('CrUXManager', () => {
       cruxManager.getConfigSetting().set(
           {enabled: false, override: 'https://example.com/override', overrideEnabled: true});
 
-      await cruxManager.getFieldDataForCurrentPage();
+      const result = await cruxManager.getFieldDataForCurrentPage();
 
+      assert.deepStrictEqual(result.warnings, ['Field data is configured for a different URL than the current page.']);
       assert.strictEqual(getFieldDataMock.callCount, 1);
       assert.strictEqual(getFieldDataMock.firstCall.args[0], 'https://example.com/override');
     });
@@ -347,8 +362,9 @@ describeWithMockConnection('CrUXManager', () => {
         }],
       });
 
-      await cruxManager.getFieldDataForCurrentPage();
+      const result = await cruxManager.getFieldDataForCurrentPage();
 
+      assert.deepStrictEqual(result.warnings, ['Field data is configured for a different URL than the current page.']);
       assert.strictEqual(getFieldDataMock.callCount, 1);
       assert.strictEqual(getFieldDataMock.firstCall.args[0], 'https://example.com/inspected');
     });
@@ -365,8 +381,9 @@ describeWithMockConnection('CrUXManager', () => {
         }],
       });
 
-      await cruxManager.getFieldDataForCurrentPage();
+      const result = await cruxManager.getFieldDataForCurrentPage();
 
+      assert.deepStrictEqual(result.warnings, ['Field data is configured for a different URL than the current page.']);
       assert.strictEqual(getFieldDataMock.callCount, 1);
       assert.strictEqual(getFieldDataMock.firstCall.args[0], 'https://google.com');
     });
@@ -374,8 +391,9 @@ describeWithMockConnection('CrUXManager', () => {
     it('should use inspected URL if main document is unavailable', async () => {
       target.setInspectedURL('https://example.com/inspected' as Platform.DevToolsPath.UrlString);
 
-      await cruxManager.getFieldDataForCurrentPage();
+      const result = await cruxManager.getFieldDataForCurrentPage();
 
+      assert.deepStrictEqual(result.warnings, []);
       assert.strictEqual(getFieldDataMock.callCount, 1);
       assert.strictEqual(getFieldDataMock.firstCall.args[0], 'https://example.com/inspected');
     });
@@ -389,8 +407,9 @@ describeWithMockConnection('CrUXManager', () => {
 
       target.setInspectedURL('https://example.com/awaitInspected' as Platform.DevToolsPath.UrlString);
 
-      await finishPromise;
+      const result = await finishPromise;
 
+      assert.deepStrictEqual(result.warnings, []);
       assert.strictEqual(getFieldDataMock.callCount, 1);
       assert.strictEqual(getFieldDataMock.firstCall.args[0], 'https://example.com/awaitInspected');
     });

package/front_end/models/crux-manager/CrUXManager.ts

@@ -3,8 +3,19 @@
 // found in the LICENSE file.
 
 import * as Common from '../../core/common/common.js';
+import * as i18n from '../../core/i18n/i18n.js';
 import * as SDK from '../../core/sdk/sdk.js';
 
+const UIStrings = {
+  /**
+   * @description Warning message indicating that the user will see real user data for a URL which is different from the URL they are currently looking at.
+   */
+  fieldOverrideWarning: 'Field data is configured for a different URL than the current page.',
+};
+
+const str_ = i18n.i18n.registerUIStrings('models/crux-manager/CrUXManager.ts', UIStrings);
+const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
+
 // This key is expected to be visible in the frontend.
 // b/349721878
 const CRUX_API_KEY = 'AIzaSyCCSOx25vrb5z0tbedCB3_JRzzbVW6Uwgw';
@@ -67,6 +78,8 @@ export interface CrUXResponse {
 
 export type PageResult = {
   [K in`${PageScope}-${DeviceScope}`]: CrUXResponse|null;
+}&{
+  warnings: string[],
 };
 
 export interface OriginMapping {
@@ -161,6 +174,7 @@ export class CrUXManager extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
       'url-DESKTOP': null,
       'url-PHONE': null,
       'url-TABLET': null,
+      warnings: [],
     };
 
     try {
@@ -212,10 +226,15 @@ export class CrUXManager extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
    * the main document URL cannot be found.
    */
   async getFieldDataForCurrentPage(): Promise<PageResult> {
-    const pageUrl = this.#configSetting.get().overrideEnabled ?
-        this.#configSetting.get().override || '' :
-        this.#getMappedUrl(this.#mainDocumentUrl || await this.#getInspectedURL());
-    return this.getFieldDataForPage(pageUrl);
+    const currentUrl = this.#mainDocumentUrl || await this.#getInspectedURL();
+    const urlForCrux = this.#configSetting.get().overrideEnabled ? this.#configSetting.get().override || '' :
+                                                                   this.#getMappedUrl(currentUrl);
+
+    const result = await this.getFieldDataForPage(urlForCrux);
+    if (currentUrl !== urlForCrux) {
+      result.warnings.push(i18nString(UIStrings.fieldOverrideWarning));
+    }
+    return result;
   }
 
   async #getInspectedURL(): Promise<string> {

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

@@ -704,6 +704,20 @@ describe('ExtensionServer', () => {
       assert.isTrue(Extensions.ExtensionServer.ExtensionServer.canInspectURL(url), url);
     }
   });
+
+  it('cannot inspect non-HTTP URL schemes', () => {
+    const blockedUrls = [
+      'devtools://devtools/bundled/front_end/devtools_app.html',
+      'devtools://devtools/anything',
+      'chrome://extensions',
+      'chrome-untrusted://extensions',
+      'chrome-error://crash',
+      'chrome-search://foo/bar',
+    ];
+    for (const url of blockedUrls as Platform.DevToolsPath.UrlString[]) {
+      assert.isFalse(Extensions.ExtensionServer.ExtensionServer.canInspectURL(url), url);
+    }
+  });
 });
 
 function assertIsStatus<T>(value: T|

package/front_end/models/extensions/ExtensionServer.ts

@@ -56,6 +56,7 @@ import {RecorderExtensionEndpoint} from './RecorderExtensionEndpoint.js';
 import {RecorderPluginManager} from './RecorderPluginManager.js';
 
 const extensionOrigins: WeakMap<MessagePort, Platform.DevToolsPath.UrlString> = new WeakMap();
+const kPermittedSchemes = ['http:', 'https:', 'file:', 'data:', 'chrome-extension:', 'about:'];
 
 declare global {
   interface Window {
@@ -63,8 +64,6 @@ declare global {
   }
 }
 
-const kAllowedOrigins = [].map(url => (new URL(url)).origin);
-
 let extensionServerInstance: ExtensionServer|null;
 
 export class HostsPolicy {
@@ -1406,19 +1405,8 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     } catch (exception) {
       return false;
     }
-    if (kAllowedOrigins.includes(parsedURL.origin)) {
-      return true;
-    }
-    if (parsedURL.protocol === 'chrome:' || parsedURL.protocol === 'devtools:' ||
-        parsedURL.protocol === 'chrome-untrusted:' || parsedURL.protocol === 'chrome-error:' ||
-        parsedURL.protocol === 'chrome-search:') {
-      return false;
-    }
-    if (parsedURL.protocol.startsWith('http') && parsedURL.hostname.match(/^chrome\.google\.com\.?$/) &&
-        parsedURL.pathname.startsWith('/webstore')) {
-      return false;
-    }
-    if (parsedURL.protocol.startsWith('http') && parsedURL.hostname.match(/^chromewebstore\.google\.com\.?$/)) {
+
+    if (!kPermittedSchemes.includes(parsedURL.protocol)) {
       return false;
     }
 
@@ -1428,9 +1416,34 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
       return false;
     }
 
+    if (this.#isUrlFromChromeWebStore(parsedURL)) {
+      return false;
+    }
+
     return true;
   }
 
+  /**
+   * Tests whether a given URL is from the Chrome web store to prevent the extension server from
+   * being injected. This is treated as separate from the `getOriginsForbiddenForExtensions` API because
+   * DevTools might not be being run from a native origin and we still want to lock down this specific
+   * origin from DevTools extensions.
+   *
+   * @param parsedURL The URL to check
+   * @returns `true` if the URL corresponds to the Chrome web store; otherwise `false`
+   */
+  static #isUrlFromChromeWebStore(parsedURL: URL): boolean {
+    if (parsedURL.protocol.startsWith('http') && parsedURL.hostname.match(/^chrome\.google\.com\.?$/) &&
+        parsedURL.pathname.startsWith('/webstore')) {
+      return true;
+    }
+    if (parsedURL.protocol.startsWith('http') && parsedURL.hostname.match(/^chromewebstore\.google\.com\.?$/)) {
+      return true;
+    }
+
+    return false;
+  }
+
   private disableExtensions(): void {
     this.extensionsEnabled = false;
   }

package/front_end/models/issues_manager/CookieIssue.ts

@@ -8,6 +8,7 @@ import * as i18n from '../../core/i18n/i18n.js';
 import type * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import * as Protocol from '../../generated/protocol.js';
+import * as ThirdPartyWeb from '../../third_party/third-party-web/third-party-web.js';
 
 import {Issue, IssueCategory, IssueKind} from './Issue.js';
 import {
@@ -67,6 +68,23 @@ export const enum CookieIssueSubCategory {
   THIRD_PARTY_PHASEOUT_COOKIE = 'ThirdPartyPhaseoutCookie',
 }
 
+// Enum to show cookie status from the security panel's third-party cookie report tool
+export const enum CookieStatus {
+  BLOCKED = 0,
+  ALLOWED = 1,
+  ALLOWED_BY_GRACE_PERIOD = 2,
+  ALLOWED_BY_HEURISTICS = 3,
+}
+
+export interface CookieReportInfo {
+  name: string;
+  domain: string;
+  type?: string;
+  platform?: string;
+  status: CookieStatus;
+  recommendation?: string;
+}
+
 export class CookieIssue extends Issue {
   #issueDetails: Protocol.Audits.CookieIssueDetails;
 
@@ -77,7 +95,7 @@ export class CookieIssue extends Issue {
     this.#issueDetails = issueDetails;
   }
 
-  #cookieId(): string {
+  cookieId(): string {
     if (this.#issueDetails.cookie) {
       const {domain, path, name} = this.#issueDetails.cookie;
       const cookieId = `${domain};${path};${name}`;
@@ -88,7 +106,7 @@ export class CookieIssue extends Issue {
 
   primaryKey(): string {
     const requestId = this.#issueDetails.request ? this.#issueDetails.request.requestId : 'no-request';
-    return `${this.code()}-(${this.#cookieId()})-(${requestId})`;
+    return `${this.code()}-(${this.cookieId()})-(${requestId})`;
   }
 
   /**
@@ -197,6 +215,14 @@ export class CookieIssue extends Issue {
         reason === Protocol.Audits.CookieWarningReason.WarnSameSiteLaxCrossDowngradeStrict) {
       return [Protocol.Audits.InspectorIssueCode.CookieIssue, 'WarnCrossDowngrade', operation, secure].join('::');
     }
+
+    if (reason === Protocol.Audits.CookieExclusionReason.ExcludePortMismatch) {
+      return [Protocol.Audits.InspectorIssueCode.CookieIssue, 'ExcludePortMismatch'].join('::');
+    }
+
+    if (reason === Protocol.Audits.CookieExclusionReason.ExcludeSchemeMismatch) {
+      return [Protocol.Audits.InspectorIssueCode.CookieIssue, 'ExcludeSchemeMismatch'].join('::');
+    }
     return [Protocol.Audits.InspectorIssueCode.CookieIssue, reason, operation].join('::');
   }
 
@@ -245,6 +271,45 @@ export class CookieIssue extends Issue {
     return IssueKind.BREAKING_CHANGE;
   }
 
+  makeCookieReportEntry(): CookieReportInfo|undefined {
+    const status = CookieIssue.getCookieStatus(this.#issueDetails);
+    if (this.#issueDetails.cookie && this.#issueDetails.cookieUrl && status !== undefined) {
+      const entity = ThirdPartyWeb.ThirdPartyWeb.getEntity(this.#issueDetails.cookieUrl);
+      return {
+        name: this.#issueDetails.cookie.name,
+        domain: this.#issueDetails.cookie.domain,
+        type: entity?.category,
+        platform: entity?.name,
+        status,
+      };
+    }
+
+    return;
+  }
+
+  static getCookieStatus(cookieIssueDetails: Protocol.Audits.CookieIssueDetails): CookieStatus|undefined {
+    if (cookieIssueDetails.cookieExclusionReasons.includes(
+            Protocol.Audits.CookieExclusionReason.ExcludeThirdPartyPhaseout)) {
+      return CookieStatus.BLOCKED;
+    }
+
+    if (cookieIssueDetails.cookieWarningReasons.includes(
+            Protocol.Audits.CookieWarningReason.WarnDeprecationTrialMetadata)) {
+      return CookieStatus.ALLOWED_BY_GRACE_PERIOD;
+    }
+
+    if (cookieIssueDetails.cookieWarningReasons.includes(
+            Protocol.Audits.CookieWarningReason.WarnThirdPartyCookieHeuristic)) {
+      return CookieStatus.ALLOWED_BY_HEURISTICS;
+    }
+
+    if (cookieIssueDetails.cookieWarningReasons.includes(Protocol.Audits.CookieWarningReason.WarnThirdPartyPhaseout)) {
+      return CookieStatus.ALLOWED;
+    }
+
+    return;
+  }
+
   static fromInspectorIssue(issuesModel: SDK.IssuesModel.IssuesModel, inspectorIssue: Protocol.Audits.InspectorIssue):
       CookieIssue[] {
     const cookieIssueDetails = inspectorIssue.details.cookieIssueDetails;
@@ -542,6 +607,16 @@ const cookieCrossSiteRedirectDowngrade: LazyMarkdownIssueDescription = {
   }],
 };
 
+const ExcludePortMismatch: LazyMarkdownIssueDescription = {
+  file: 'cookieExcludePortMismatch.md',
+  links: [],
+};
+
+const ExcludeSchemeMismatch: LazyMarkdownIssueDescription = {
+  file: 'cookieExcludeSchemeMismatch.md',
+  links: [],
+};
+
 // This description will be used by cookie issues that need to be added to the
 // issueManager, but aren't intended to be surfaced in the issues pane. This
 // is why they are using a placeholder description
@@ -600,4 +675,6 @@ const issueDescriptions: Map<string, LazyMarkdownIssueDescription> = new Map([
   ['CookieIssue::ExcludeThirdPartyPhaseout::ReadCookie', cookieExcludeThirdPartyPhaseoutRead],
   ['CookieIssue::ExcludeThirdPartyPhaseout::SetCookie', cookieExcludeThirdPartyPhaseoutSet],
   ['CookieIssue::CrossSiteRedirectDowngradeChangesInclusion', cookieCrossSiteRedirectDowngrade],
+  ['CookieIssue::ExcludePortMismatch', ExcludePortMismatch],
+  ['CookieIssue::ExcludeSchemeMismatch', ExcludeSchemeMismatch],
 ]);

package/front_end/models/issues_manager/IssuesManager.ts

@@ -129,7 +129,7 @@ const issueCodeHandlers = new Map<
  * Each issue reported by the backend can result in multiple `Issue` instances.
  * Handlers are simple functions hard-coded into a map.
  */
-function createIssuesFromProtocolIssue(
+export function createIssuesFromProtocolIssue(
     issuesModel: SDK.IssuesModel.IssuesModel, inspectorIssue: Protocol.Audits.InspectorIssue): Issue[] {
   const handler = issueCodeHandlers.get(inspectorIssue.code);
   if (handler) {

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

@@ -0,0 +1,8 @@
+# Cookie was not sent due to port mismatch
+
+Cookies can only be accessed by origins that share the same port as the origin
+that initially set the cookie.
+
+If this cookie is required for the request, the cookie will need to be set by an
+origin with the same port as the request. Alternatively, you can utilize the
+Domain attribute, which allows access to a cookie with a mismatched port.

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

@@ -0,0 +1,7 @@
+# Cookie was not sent due to scheme mismatch
+
+The cookie can only be accessed by origins that share the same scheme as
+the origin that initially set it.
+
+If this cookie is required for the request, the cookie will need to be set
+by an origin with the same scheme as the request.

package/front_end/models/javascript_metadata/NativeFunctions.js

@@ -322,6 +322,11 @@ export const NativeFunctions = [
     signatures: [["thisArg","...args"]],
     receivers: ["CallableFunction","NewableFunction"]
   },
+  {
+    name: "bind",
+    signatures: [["innerFunction","?thisArg","...args"]],
+    receivers: ["Performance"]
+  },
   {
     name: "charAt",
     signatures: [["pos"]]
@@ -812,6 +817,11 @@ export const NativeFunctions = [
     name: "push",
     signatures: [["...items"]]
   },
+  {
+    name: "reverse",
+    signatures: [["input","?options"]],
+    receivers: ["MLGraphBuilder"]
+  },
   {
     name: "sort",
     signatures: [["?compareFn"]],
@@ -6506,10 +6516,6 @@ export const NativeFunctions = [
     name: "setHTML",
     signatures: [["html","?options"]]
   },
-  {
-    name: "getInnerHTML",
-    signatures: [["?options"]]
-  },
   {
     name: "scrollIntoViewIfNeeded",
     signatures: [["?centerIfNeeded"]]
@@ -7727,6 +7733,10 @@ export const NativeFunctions = [
     name: "takePhoto",
     signatures: [["?photoSettings"]]
   },
+  {
+    name: "getAllRecords",
+    signatures: [["?options"]]
+  },
   {
     name: "only",
     signatures: [["value"]]

package/front_end/models/persistence/EditFileSystemView.ts

@@ -96,7 +96,7 @@ export class EditFileSystemView extends UI.Widget.VBox implements UI.ListWidget.
     ];
 
     const excludedFoldersHeader = this.contentElement.createChild('div', 'excluded-folder-header');
-    excludedFoldersHeader.createChild('span').textContent = i18nString(UIStrings.url);
+    excludedFoldersHeader.createChild('span', 'url-header').textContent = i18nString(UIStrings.url);
     excludedFoldersHeader.createChild('span', 'excluded-folder-url').textContent = fileSystemPath;
 
     const excludeSubFoldersText = this.contentElement.createChild('span', 'exclude-subfolders-text');
@@ -128,7 +128,7 @@ export class EditFileSystemView extends UI.Widget.VBox implements UI.ListWidget.
     return IsolatedFileSystemManager.instance().fileSystem(this.fileSystemPath) as PlatformFileSystem;
   }
 
-  private update(): void {
+  override update(): void {
     if (this.muteUpdate) {
       return;
     }

package/front_end/models/persistence/editFileSystemView.css

@@ -7,14 +7,17 @@
 .excluded-folder-header {
   display: flex;
   flex-direction: column;
-  height: var(--sys-size-16);
+  min-height: var(--sys-size-16);
   border-bottom: var(--sys-size-1) solid var(--sys-color-divider);
   padding: var(--sys-size-5) var(--sys-size-6);
 
+  & > .url-header {
+    height: var(--sys-size-9);
+  }
+
   & > .excluded-folder-url {
     color: var(--sys-color-on-surface-subtle);
-    overflow: hidden;
-    text-overflow: ellipsis;
+    overflow-wrap: break-word;
   }
 }
 

package/front_end/models/persistence/workspaceSettingsTab.css

@@ -32,12 +32,12 @@ label {
 }
 
 .add-button-container {
-  max-width: var(--sys-size-37);
+  max-width: var(--sys-size-35);
   margin-left: var(--sys-size-8);
   width: 100%;
 
   & .add-folder {
     min-width: var(--sys-size-31);
-    max-width: var(--sys-size-37);
+    max-width: var(--sys-size-35);
   }
 }

package/front_end/models/trace/extras/Metadata.test.ts

@@ -13,11 +13,12 @@ describeWithEnvironment('Trace Metadata', () => {
     sinon.stub(cpuThrottlingManager, 'getHardwareConcurrency').returns(Promise.resolve(1));
     sinon.stub(cpuThrottlingManager, 'cpuThrottlingRate').returns(2);
     const networkManager = SDK.NetworkManager.MultitargetNetworkManager.instance({forceNew: true});
+    sinon.stub(networkManager, 'isThrottling').returns(true);
     sinon.stub(networkManager, 'networkConditions').returns({
       title: 'Slow 3G',
       download: 1,
-      upload: 1,
-      latency: 1,
+      upload: 2,
+      latency: 3,
     });
     const metadata = await Trace.Extras.Metadata.forNewRecording(/* isCpuProfile= */ false);
     assert.deepEqual(metadata, {
@@ -25,7 +26,17 @@ describeWithEnvironment('Trace Metadata', () => {
       startTime: undefined,
       cpuThrottling: 2,
       networkThrottling: 'Slow 3G',
+      networkThrottlingConditions: {
+        download: 1,
+        latency: 3,
+        upload: 2,
+        packetLoss: undefined,
+        packetQueueLength: undefined,
+        packetReordering: undefined,
+        targetLatency: undefined,
+      },
       dataOrigin: Trace.Types.File.DataOrigin.TRACE_EVENTS,
+      emulatedDeviceTitle: undefined,
       hardwareConcurrency: 1,
     });
   });
@@ -36,6 +47,7 @@ describeWithEnvironment('Trace Metadata', () => {
     sinon.stub(cpuThrottlingManager, 'getHardwareConcurrency').returns(Promise.resolve(1));
     sinon.stub(cpuThrottlingManager, 'cpuThrottlingRate').returns(2);
     const networkManager = SDK.NetworkManager.MultitargetNetworkManager.instance({forceNew: true});
+    sinon.stub(networkManager, 'isThrottling').returns(true);
     sinon.stub(networkManager, 'networkConditions').returns({
       title: () => 'Slow 3G',
       download: 1,
@@ -48,6 +60,16 @@ describeWithEnvironment('Trace Metadata', () => {
       startTime: undefined,
       cpuThrottling: 2,
       networkThrottling: 'Slow 3G',
+      networkThrottlingConditions: {
+        download: 1,
+        latency: 1,
+        upload: 1,
+        packetLoss: undefined,
+        packetQueueLength: undefined,
+        packetReordering: undefined,
+        targetLatency: undefined,
+      },
+      emulatedDeviceTitle: undefined,
       dataOrigin: Trace.Types.File.DataOrigin.TRACE_EVENTS,
       hardwareConcurrency: 1,
     });
@@ -59,6 +81,7 @@ describeWithEnvironment('Trace Metadata', () => {
     const getHardwareConcurrencyStub = sinon.stub(cpuThrottlingManager, 'getHardwareConcurrency');
     sinon.stub(cpuThrottlingManager, 'cpuThrottlingRate').returns(2);
     const networkManager = SDK.NetworkManager.MultitargetNetworkManager.instance({forceNew: true});
+    sinon.stub(networkManager, 'isThrottling').returns(true);
     sinon.stub(networkManager, 'networkConditions').returns({
       title: () => 'Slow 3G',
       download: 1,
@@ -71,7 +94,17 @@ describeWithEnvironment('Trace Metadata', () => {
       startTime: undefined,
       cpuThrottling: 2,
       networkThrottling: 'Slow 3G',
+      networkThrottlingConditions: {
+        download: 1,
+        latency: 1,
+        upload: 1,
+        packetLoss: undefined,
+        packetQueueLength: undefined,
+        packetReordering: undefined,
+        targetLatency: undefined,
+      },
       dataOrigin: Trace.Types.File.DataOrigin.TRACE_EVENTS,
+      emulatedDeviceTitle: undefined,
       hardwareConcurrency: undefined,
     });
     assert.strictEqual(getHardwareConcurrencyStub.callCount, 0);

package/front_end/models/trace/extras/Metadata.ts

@@ -5,7 +5,8 @@
 import * as SDK from '../../../core/sdk/sdk.js';
 import * as Types from '../types/types.js';
 
-export async function forNewRecording(isCpuProfile: boolean, recordStartTime?: number): Promise<Types.File.MetaData> {
+export async function forNewRecording(
+    isCpuProfile: boolean, recordStartTime?: number, emulatedDeviceTitle?: string): Promise<Types.File.MetaData> {
   try {
     if (isCpuProfile) {
       // For CPU profile, only specify data origin
@@ -36,15 +37,33 @@ export async function forNewRecording(isCpuProfile: boolean, recordStartTime?: n
     const hardwareConcurrency =
         cpuThrottlingManager.hasPrimaryPageTargetSet() ? await getConcurrencyOrTimeout() : undefined;
     const cpuThrottling = SDK.CPUThrottlingManager.CPUThrottlingManager.instance().cpuThrottlingRate();
-    const networkConditions = SDK.NetworkManager.MultitargetNetworkManager.instance().networkConditions();
-    const networkTitle =
-        typeof networkConditions.title === 'function' ? networkConditions.title() : networkConditions.title;
+    const networkConditions = SDK.NetworkManager.MultitargetNetworkManager.instance().isThrottling() ?
+        SDK.NetworkManager.MultitargetNetworkManager.instance().networkConditions() :
+        undefined;
+
+    let networkThrottlingConditions;
+    let networkTitle;
+    if (networkConditions) {
+      networkThrottlingConditions = {
+        download: networkConditions.download,
+        upload: networkConditions.upload,
+        latency: networkConditions.latency,
+        packetLoss: networkConditions.packetLoss,
+        packetQueueLength: networkConditions.packetQueueLength,
+        packetReordering: networkConditions.packetReordering,
+        targetLatency: networkConditions.targetLatency,
+      };
+      networkTitle =
+          typeof networkConditions.title === 'function' ? networkConditions.title() : networkConditions.title;
+    }
 
     return {
       source: 'DevTools',
       startTime: recordStartTime ? new Date(recordStartTime).toJSON() : undefined,  // ISO-8601 timestamp
-      cpuThrottling,
+      emulatedDeviceTitle,
+      cpuThrottling: cpuThrottling !== 1 ? cpuThrottling : undefined,
       networkThrottling: networkTitle,
+      networkThrottlingConditions,
       hardwareConcurrency,
       dataOrigin: Types.File.DataOrigin.TRACE_EVENTS,
     };