chrome-devtools-frontend 1.0.1029149 → 1.0.1030070

package/config/gni/devtools_grd_files.gni

@@ -280,6 +280,7 @@ grd_files_release_sources = [
   "front_end/models/issues_manager/descriptions/TwaHttpError.md",
   "front_end/models/issues_manager/descriptions/TwaPageUnavailableOffline.md",
   "front_end/models/issues_manager/descriptions/arInsecureContext.md",
+  "front_end/models/issues_manager/descriptions/arInvalidEligibleHeader.md",
   "front_end/models/issues_manager/descriptions/arInvalidRegisterSourceHeader.md",
   "front_end/models/issues_manager/descriptions/arInvalidRegisterTriggerHeader.md",
   "front_end/models/issues_manager/descriptions/arPermissionPolicyDisabled.md",

package/front_end/core/i18n/locales/en-US.json

@@ -1451,6 +1451,9 @@
   "models/issues_manager/DeprecationIssue.ts | openWebDatabaseInsecureContext": {
     "message": "WebSQL in non-secure contexts is deprecated and will be removed in M107. Please use Web Storage or Indexed Database."
   },
+  "models/issues_manager/DeprecationIssue.ts | persistentQuotaType": {
+    "message": "StorageType.persistent is deprecated. Please use standardized navigator.storage instead."
+  },
   "models/issues_manager/DeprecationIssue.ts | pictureSourceSrc": {
     "message": "<source src> with a <picture> parent is invalid and therefore ignored. Please use <source srcset> instead."
   },
@@ -8792,6 +8795,9 @@
   "panels/protocol_monitor/ProtocolMonitor.ts | sendRawCDPCommand": {
     "message": "Send a raw CDP command"
   },
+  "panels/protocol_monitor/ProtocolMonitor.ts | sendRawCDPCommandExplanation": {
+    "message": "Format: 'Domain.commandName' for a command without parameters, or '{\"command\":\"Domain.commandName\", \"parameters\": {...}}' as a JSON object for a command with parameters. 'cmd'/'method' and 'args'/'params'/'arguments' are also supported as alternative keys for the JSON object."
+  },
   "panels/protocol_monitor/ProtocolMonitor.ts | session": {
     "message": "Session"
   },

package/front_end/core/i18n/locales/en-XL.json

@@ -1451,6 +1451,9 @@
   "models/issues_manager/DeprecationIssue.ts | openWebDatabaseInsecureContext": {
     "message": "Ŵéb̂ŚQ̂Ĺ îń n̂ón̂-śêćûŕê ćôńt̂éx̂t́ŝ íŝ d́êṕr̂éĉát̂éd̂ án̂d́ ŵíl̂ĺ b̂é r̂ém̂óv̂éd̂ ín̂ Ḿ107. P̂ĺêáŝé ûśê Ẃêb́ Ŝt́ôŕâǵê ór̂ Ín̂d́êx́êd́ D̂át̂áb̂áŝé."
   },
+  "models/issues_manager/DeprecationIssue.ts | persistentQuotaType": {
+    "message": "StorageType.persistent îś d̂ép̂ŕêćât́êd́. P̂ĺêáŝé ûśê śt̂án̂d́âŕd̂íẑéd̂ navigator.storage ín̂śt̂éâd́."
+  },
   "models/issues_manager/DeprecationIssue.ts | pictureSourceSrc": {
     "message": "<source src> ŵít̂h́ â <picture> ṕâŕêńt̂ íŝ ín̂v́âĺîd́ âńd̂ t́ĥér̂éf̂ór̂é îǵn̂ór̂éd̂. Ṕl̂éâśê úŝé <source srcset> îńŝt́êád̂."
   },
@@ -8792,6 +8795,9 @@
   "panels/protocol_monitor/ProtocolMonitor.ts | sendRawCDPCommand": {
     "message": "Ŝén̂d́ â ŕâẃ CDP ĉóm̂ḿâńd̂"
   },
+  "panels/protocol_monitor/ProtocolMonitor.ts | sendRawCDPCommandExplanation": {
+    "message": "F̂ór̂ḿât́: 'Domain.commandName' f̂ór̂ á ĉóm̂ḿâńd̂ ẃît́ĥóût́ p̂ár̂ám̂ét̂ér̂ś, ôŕ '{\"command\":\"Domain.commandName\", \"parameters\": {...}}' âś â J́ŜÓN̂ ób̂j́êćt̂ f́ôŕ â ćôḿm̂án̂d́ ŵít̂h́ p̂ár̂ám̂ét̂ér̂ś. 'cmd'/'method' âńd̂ 'args'/'params'/'arguments' ár̂é âĺŝó ŝúp̂ṕôŕt̂éd̂ áŝ ál̂t́êŕn̂át̂ív̂é k̂éŷś f̂ór̂ t́ĥé JSON ôb́ĵéĉt́."
+  },
   "panels/protocol_monitor/ProtocolMonitor.ts | session": {
     "message": "Ŝéŝśîón̂"
   },

package/front_end/generated/InspectorBackendCommands.js

@@ -63,7 +63,7 @@ inspectorBackend.registerEnum("Audits.HeavyAdReason", {NetworkTotalLimit: "Netwo
 inspectorBackend.registerEnum("Audits.ContentSecurityPolicyViolationType", {KInlineViolation: "kInlineViolation", KEvalViolation: "kEvalViolation", KURLViolation: "kURLViolation", KTrustedTypesSinkViolation: "kTrustedTypesSinkViolation", KTrustedTypesPolicyViolation: "kTrustedTypesPolicyViolation", KWasmEvalViolation: "kWasmEvalViolation"});
 inspectorBackend.registerEnum("Audits.SharedArrayBufferIssueType", {TransferIssue: "TransferIssue", CreationIssue: "CreationIssue"});
 inspectorBackend.registerEnum("Audits.TwaQualityEnforcementViolationType", {KHttpError: "kHttpError", KUnavailableOffline: "kUnavailableOffline", KDigitalAssetLinks: "kDigitalAssetLinks"});
-inspectorBackend.registerEnum("Audits.AttributionReportingIssueType", {PermissionPolicyDisabled: "PermissionPolicyDisabled", AttributionSourceUntrustworthyOrigin: "AttributionSourceUntrustworthyOrigin", AttributionUntrustworthyOrigin: "AttributionUntrustworthyOrigin", UntrustworthyReportingOrigin: "UntrustworthyReportingOrigin", InsecureContext: "InsecureContext", InvalidHeader: "InvalidHeader", InvalidRegisterTriggerHeader: "InvalidRegisterTriggerHeader"});
+inspectorBackend.registerEnum("Audits.AttributionReportingIssueType", {PermissionPolicyDisabled: "PermissionPolicyDisabled", UntrustworthyReportingOrigin: "UntrustworthyReportingOrigin", InsecureContext: "InsecureContext", InvalidHeader: "InvalidHeader", InvalidRegisterTriggerHeader: "InvalidRegisterTriggerHeader", InvalidEligibleHeader: "InvalidEligibleHeader"});
 inspectorBackend.registerEnum("Audits.GenericIssueErrorType", {CrossOriginPortalPostMessageError: "CrossOriginPortalPostMessageError"});
 inspectorBackend.registerEnum("Audits.DeprecationIssueType", {AuthorizationCoveredByWildcard: "AuthorizationCoveredByWildcard", CanRequestURLHTTPContainingNewline: "CanRequestURLHTTPContainingNewline", ChromeLoadTimesConnectionInfo: "ChromeLoadTimesConnectionInfo", ChromeLoadTimesFirstPaintAfterLoadTime: "ChromeLoadTimesFirstPaintAfterLoadTime", ChromeLoadTimesWasAlternateProtocolAvailable: "ChromeLoadTimesWasAlternateProtocolAvailable", CookieWithTruncatingChar: "CookieWithTruncatingChar", CrossOriginAccessBasedOnDocumentDomain: "CrossOriginAccessBasedOnDocumentDomain", CrossOriginWindowAlert: "CrossOriginWindowAlert", CrossOriginWindowConfirm: "CrossOriginWindowConfirm", CSSSelectorInternalMediaControlsOverlayCastButton: "CSSSelectorInternalMediaControlsOverlayCastButton", DeprecationExample: "DeprecationExample", DocumentDomainSettingWithoutOriginAgentClusterHeader: "DocumentDomainSettingWithoutOriginAgentClusterHeader", EventPath: "EventPath", ExpectCTHeader: "ExpectCTHeader", GeolocationInsecureOrigin: "GeolocationInsecureOrigin", GeolocationInsecureOriginDeprecatedNotRemoved: "GeolocationInsecureOriginDeprecatedNotRemoved", GetUserMediaInsecureOrigin: "GetUserMediaInsecureOrigin", HostCandidateAttributeGetter: "HostCandidateAttributeGetter", IdentityInCanMakePaymentEvent: "IdentityInCanMakePaymentEvent", InsecurePrivateNetworkSubresourceRequest: "InsecurePrivateNetworkSubresourceRequest", LegacyConstraintGoogIPv6: "LegacyConstraintGoogIPv6", LocalCSSFileExtensionRejected: "LocalCSSFileExtensionRejected", MediaSourceAbortRemove: "MediaSourceAbortRemove", MediaSourceDurationTruncatingBuffered: "MediaSourceDurationTruncatingBuffered", NavigateEventRestoreScroll: "NavigateEventRestoreScroll", NavigateEventTransitionWhile: "NavigateEventTransitionWhile", NoSysexWebMIDIWithoutPermission: "NoSysexWebMIDIWithoutPermission", NotificationInsecureOrigin: "NotificationInsecureOrigin", NotificationPermissionRequestedIframe: "NotificationPermissionRequestedIframe", ObsoleteWebRtcCipherSuite: "ObsoleteWebRtcCipherSuite", OpenWebDatabaseInsecureContext: "OpenWebDatabaseInsecureContext", OverflowVisibleOnReplacedElement: "OverflowVisibleOnReplacedElement", PersistentQuotaType: "PersistentQuotaType", PictureSourceSrc: "PictureSourceSrc", PrefixedCancelAnimationFrame: "PrefixedCancelAnimationFrame", PrefixedRequestAnimationFrame: "PrefixedRequestAnimationFrame", PrefixedStorageInfo: "PrefixedStorageInfo", PrefixedVideoDisplayingFullscreen: "PrefixedVideoDisplayingFullscreen", PrefixedVideoEnterFullscreen: "PrefixedVideoEnterFullscreen", PrefixedVideoEnterFullScreen: "PrefixedVideoEnterFullScreen", PrefixedVideoExitFullscreen: "PrefixedVideoExitFullscreen", PrefixedVideoExitFullScreen: "PrefixedVideoExitFullScreen", PrefixedVideoSupportsFullscreen: "PrefixedVideoSupportsFullscreen", RangeExpand: "RangeExpand", RequestedSubresourceWithEmbeddedCredentials: "RequestedSubresourceWithEmbeddedCredentials", RTCConstraintEnableDtlsSrtpFalse: "RTCConstraintEnableDtlsSrtpFalse", RTCConstraintEnableDtlsSrtpTrue: "RTCConstraintEnableDtlsSrtpTrue", RTCPeerConnectionComplexPlanBSdpUsingDefaultSdpSemantics: "RTCPeerConnectionComplexPlanBSdpUsingDefaultSdpSemantics", RTCPeerConnectionSdpSemanticsPlanB: "RTCPeerConnectionSdpSemanticsPlanB", RtcpMuxPolicyNegotiate: "RtcpMuxPolicyNegotiate", SharedArrayBufferConstructedWithoutIsolation: "SharedArrayBufferConstructedWithoutIsolation", TextToSpeech_DisallowedByAutoplay: "TextToSpeech_DisallowedByAutoplay", V8SharedArrayBufferConstructedInExtensionWithoutIsolation: "V8SharedArrayBufferConstructedInExtensionWithoutIsolation", XHRJSONEncodingDetection: "XHRJSONEncodingDetection", XMLHttpRequestSynchronousInNonWorkerOutsideBeforeUnload: "XMLHttpRequestSynchronousInNonWorkerOutsideBeforeUnload", XRSupportsSession: "XRSupportsSession"});
 inspectorBackend.registerEnum("Audits.ClientHintIssueReason", {MetaTagAllowListInvalidOrigin: "MetaTagAllowListInvalidOrigin", MetaTagModifiedHTML: "MetaTagModifiedHTML"});
@@ -343,9 +343,9 @@ inspectorBackend.registerCommand("IndexedDB.deleteDatabase", [{"name": "security
 inspectorBackend.registerCommand("IndexedDB.deleteObjectStoreEntries", [{"name": "securityOrigin", "type": "string", "optional": true}, {"name": "storageKey", "type": "string", "optional": true}, {"name": "databaseName", "type": "string", "optional": false}, {"name": "objectStoreName", "type": "string", "optional": false}, {"name": "keyRange", "type": "object", "optional": false}], []);
 inspectorBackend.registerCommand("IndexedDB.disable", [], []);
 inspectorBackend.registerCommand("IndexedDB.enable", [], []);
-inspectorBackend.registerCommand("IndexedDB.requestData", [{"name": "securityOrigin", "type": "string", "optional": false}, {"name": "databaseName", "type": "string", "optional": false}, {"name": "objectStoreName", "type": "string", "optional": false}, {"name": "indexName", "type": "string", "optional": false}, {"name": "skipCount", "type": "number", "optional": false}, {"name": "pageSize", "type": "number", "optional": false}, {"name": "keyRange", "type": "object", "optional": true}], ["objectStoreDataEntries", "hasMore"]);
+inspectorBackend.registerCommand("IndexedDB.requestData", [{"name": "securityOrigin", "type": "string", "optional": true}, {"name": "storageKey", "type": "string", "optional": true}, {"name": "databaseName", "type": "string", "optional": false}, {"name": "objectStoreName", "type": "string", "optional": false}, {"name": "indexName", "type": "string", "optional": false}, {"name": "skipCount", "type": "number", "optional": false}, {"name": "pageSize", "type": "number", "optional": false}, {"name": "keyRange", "type": "object", "optional": true}], ["objectStoreDataEntries", "hasMore"]);
 inspectorBackend.registerCommand("IndexedDB.getMetadata", [{"name": "securityOrigin", "type": "string", "optional": true}, {"name": "storageKey", "type": "string", "optional": true}, {"name": "databaseName", "type": "string", "optional": false}, {"name": "objectStoreName", "type": "string", "optional": false}], ["entriesCount", "keyGeneratorValue"]);
-inspectorBackend.registerCommand("IndexedDB.requestDatabase", [{"name": "securityOrigin", "type": "string", "optional": false}, {"name": "databaseName", "type": "string", "optional": false}], ["databaseWithObjectStores"]);
+inspectorBackend.registerCommand("IndexedDB.requestDatabase", [{"name": "securityOrigin", "type": "string", "optional": true}, {"name": "storageKey", "type": "string", "optional": true}, {"name": "databaseName", "type": "string", "optional": false}], ["databaseWithObjectStores"]);
 inspectorBackend.registerCommand("IndexedDB.requestDatabaseNames", [{"name": "securityOrigin", "type": "string", "optional": false}], ["databaseNames"]);
 
 // Input.

package/front_end/generated/SupportedCSSProperties.js

@@ -1302,8 +1302,7 @@ export const generatedProperties = [
   "keywords": [
    "visible",
    "auto",
-   "hidden",
-   "hidden-matchable"
+   "hidden"
   ],
   "name": "content-visibility"
  },
@@ -4082,8 +4081,7 @@ export const generatedPropertyValues = {
   "values": [
    "visible",
    "auto",
-   "hidden",
-   "hidden-matchable"
+   "hidden"
   ]
  },
  "counter-increment": {

package/front_end/generated/protocol.ts

@@ -963,12 +963,11 @@ export namespace Audits {
 
   export const enum AttributionReportingIssueType {
     PermissionPolicyDisabled = 'PermissionPolicyDisabled',
-    AttributionSourceUntrustworthyOrigin = 'AttributionSourceUntrustworthyOrigin',
-    AttributionUntrustworthyOrigin = 'AttributionUntrustworthyOrigin',
     UntrustworthyReportingOrigin = 'UntrustworthyReportingOrigin',
     InsecureContext = 'InsecureContext',
     InvalidHeader = 'InvalidHeader',
     InvalidRegisterTriggerHeader = 'InvalidRegisterTriggerHeader',
+    InvalidEligibleHeader = 'InvalidEligibleHeader',
   }
 
   /**
@@ -977,10 +976,6 @@ export namespace Audits {
    */
   export interface AttributionReportingIssueDetails {
     violationType: AttributionReportingIssueType;
-    /**
-     * TODO(apaseltiner): Remove this once it is no longer referenced by the frontend.
-     */
-    frame?: AffectedFrame;
     request?: AffectedRequest;
     violatingNodeId?: DOM.BackendNodeId;
     invalidParameter?: string;
@@ -5919,9 +5914,14 @@ export namespace IndexedDB {
 
   export interface RequestDataRequest {
     /**
+     * At least and at most one of securityOrigin, storageKey must be specified.
      * Security origin.
      */
-    securityOrigin: string;
+    securityOrigin?: string;
+    /**
+     * Storage key.
+     */
+    storageKey?: string;
     /**
      * Database name.
      */
@@ -5994,9 +5994,14 @@ export namespace IndexedDB {
 
   export interface RequestDatabaseRequest {
     /**
+     * At least and at most one of securityOrigin, storageKey must be specified.
      * Security origin.
      */
-    securityOrigin: string;
+    securityOrigin?: string;
+    /**
+     * Storage key.
+     */
+    storageKey?: string;
     /**
      * Database name.
      */

package/front_end/models/issues_manager/AttributionReportingIssue.ts

@@ -14,6 +14,7 @@ export const enum IssueCode {
   InsecureContext = 'AttributionReportingIssue::InsecureContext',
   InvalidRegisterSourceHeader = 'AttributionReportingIssue::InvalidRegisterSourceHeader',
   InvalidRegisterTriggerHeader = 'AttributionReportingIssue::InvalidRegisterTriggerHeader',
+  InvalidEligibleHeader = 'AttributionReportingIssue::InvalidEligibleHeader',
   // TODO(apaseltiner): Remove this once old issue types are removed from
   // protocol.
   Unknown = 'AttributionReportingIssue::Unknown',
@@ -31,6 +32,8 @@ function getIssueCode(details: Protocol.Audits.AttributionReportingIssueDetails)
       return IssueCode.InvalidRegisterSourceHeader;
     case Protocol.Audits.AttributionReportingIssueType.InvalidRegisterTriggerHeader:
       return IssueCode.InvalidRegisterTriggerHeader;
+    case Protocol.Audits.AttributionReportingIssueType.InvalidEligibleHeader:
+      return IssueCode.InvalidEligibleHeader;
     default:
       return IssueCode.Unknown;
   }
@@ -76,6 +79,14 @@ export class AttributionReportingIssue extends Issue<IssueCode> {
           file: 'arInvalidRegisterTriggerHeader.md',
           links: [],
         };
+      case IssueCode.InvalidEligibleHeader:
+        return {
+          file: 'arInvalidEligibleHeader.md',
+          links: [{
+            link: 'https://tools.ietf.org/id/draft-ietf-httpbis-header-structure-15.html#rfc.section.4.2.2',
+            linkTitle: 'Structured Headers RFC',
+          }],
+        };
       case IssueCode.Unknown:
         return null;
     }

package/front_end/models/issues_manager/DeprecationIssue.ts

@@ -186,6 +186,11 @@ const UIStrings = {
    */
   openWebDatabaseInsecureContext:
       'WebSQL in non-secure contexts is deprecated and will be removed in M107. Please use Web Storage or Indexed Database.',
+  /**
+   * @description Warning displayed to developers when persistent storage type is used to notify that storage type is deprecated.
+   */
+  persistentQuotaType:
+      '`StorageType.persistent` is deprecated. Please use standardized `navigator.storage` instead.',
   /**
    * @description This issue indicates that a `<source>` element with a `<picture>` parent was using an `src` attribute, which is not valid and is ignored by the browser. The `srcset` attribute should be used instead.
    */
@@ -446,6 +451,11 @@ export class DeprecationIssue extends Issue {
         feature = 5175124599767040;
         milestone = 105;
         break;
+      case Protocol.Audits.DeprecationIssueType.PersistentQuotaType:
+        messageFunction = i18nLazyString(UIStrings.persistentQuotaType);
+        feature = 5176235376246784;
+        milestone = 106;
+        break;
       case Protocol.Audits.DeprecationIssueType.PictureSourceSrc:
         messageFunction = i18nLazyString(UIStrings.pictureSourceSrc);
         break;

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

@@ -0,0 +1,19 @@
+# Ensure that the `Attribution-Reporting-Eligible` header is valid
+
+This page sent a request containing an `Attribution-Reporting-Eligible` header,
+but the header value was not a valid structured dictionary, causing any source
+or trigger registration in the response to be ignored.
+
+The header should contain a structured dictionary as follows:
+
+To allow the response to register an event source:
+`Attribution-Reporting-Eligible: event-source`
+
+To allow the response to register a trigger:
+`Attribution-Reporting-Eligible: trigger`
+
+To allow the response to register an event source or a trigger:
+`Attribution-Reporting-Eligible: event-source, trigger`
+
+To prevent the response from registering anything:
+`Attribution-Reporting-Eligible: `

package/front_end/panels/elements/StylePropertyTreeElement.ts

@@ -26,6 +26,8 @@ import {cssRuleValidatorsMap, type AuthoringHint} from './CSSRuleValidator.js';
 const FlexboxEditor = ElementsComponents.StylePropertyEditor.FlexboxEditor;
 const GridEditor = ElementsComponents.StylePropertyEditor.GridEditor;
 
+export const activeHints = new WeakMap<Element, AuthoringHint>();
+
 const UIStrings = {
   /**
   *@description Text in Color Swatch Popover Icon of the Elements panel
@@ -719,11 +721,7 @@ export class StylePropertyTreeElement extends UI.TreeOutline.TreeElement {
     const showAuthoringHint = authoringHint !== null && this.property.parsedOk;
     if (showAuthoringHint) {
       const hintIcon = UI.Icon.Icon.create('mediumicon-info', 'hint');
-      const hintPopover =
-          new UI.PopoverHelper.PopoverHelper(hintIcon, event => this.handleHintPopoverRequest(authoringHint, event));
-      hintPopover.setHasPadding(true);
-      hintPopover.setTimeout(0, 100);
-
+      activeHints.set(hintIcon, authoringHint);
       this.listItemElement.append(hintIcon);
     }
 
@@ -836,24 +834,6 @@ export class StylePropertyTreeElement extends UI.TreeOutline.TreeElement {
     return null;
   }
 
-  private handleHintPopoverRequest(authoringHint: AuthoringHint, event: Event): UI.PopoverHelper.PopoverRequest|null {
-    const link = event.composedPath()[0];
-    Platform.DCHECK(() => link instanceof Element, 'Link is not an instance of Element');
-
-    return {
-      box: (link as Element).boxInWindow(),
-      show: async(popover: UI.GlassPane.GlassPane): Promise<boolean> => {
-        const node = this.node();
-        if (!node) {
-          return false;
-        }
-        const popupElement = new ElementsComponents.CSSHintDetailsView.CSSHintDetailsView(authoringHint);
-        popover.contentElement.insertAdjacentElement('beforeend', popupElement);
-        return true;
-      },
-    };
-  }
-
   private mouseUp(event: MouseEvent): void {
     const activeTreeElement = parentMap.get(this.parentPaneInternal);
     parentMap.delete(this.parentPaneInternal);

package/front_end/panels/elements/StylesSidebarPane.ts

@@ -60,7 +60,7 @@ import {StyleEditorWidget} from './StyleEditorWidget.js';
 import {StylePropertyHighlighter} from './StylePropertyHighlighter.js';
 import stylesSidebarPaneStyles from './stylesSidebarPane.css.js';
 
-import {type StylePropertyTreeElement} from './StylePropertyTreeElement.js';
+import {activeHints, type StylePropertyTreeElement} from './StylePropertyTreeElement.js';
 import {
   StylePropertiesSection,
   BlankStylePropertiesSection,
@@ -213,6 +213,7 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
   private needsForceUpdate: boolean;
   private readonly resizeThrottler: Common.Throttler.Throttler;
   private readonly imagePreviewPopover: ImagePreviewPopover;
+  #hintPopoverHelper: UI.PopoverHelper.PopoverHelper;
   activeCSSAngle: InlineEditor.CSSAngle.CSSAngle|null;
   #urlToChangeTracker: Map<Platform.DevToolsPath.UrlString, ChangeTracker> = new Map();
   #copyChangesButton?: UI.Toolbar.ToolbarButton;
@@ -282,6 +283,35 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
     }, () => this.node());
 
     this.activeCSSAngle = null;
+
+    this.#hintPopoverHelper = new UI.PopoverHelper.PopoverHelper(this.contentElement, event => {
+      const icon = event.composedPath()[0] as Element;
+
+      if (!icon) {
+        return null;
+      }
+
+      if (!icon.matches('.hint')) {
+        return null;
+      }
+
+      const hint = activeHints.get(icon);
+
+      if (!hint) {
+        return null;
+      }
+
+      return {
+        box: icon.boxInWindow(),
+        show: async(popover: UI.GlassPane.GlassPane): Promise<boolean> => {
+          const popupElement = new ElementsComponents.CSSHintDetailsView.CSSHintDetailsView(hint);
+          popover.contentElement.appendChild(popupElement);
+          return true;
+        },
+      };
+    });
+    this.#hintPopoverHelper.setTimeout(200);
+    this.#hintPopoverHelper.setHasPadding(true);
   }
 
   swatchPopoverHelper(): InlineEditor.SwatchPopoverHelper.SwatchPopoverHelper {

package/front_end/panels/issues/AttributionReportingIssueDetailsView.ts

@@ -57,6 +57,7 @@ export class AttributionReportingIssueDetailsView extends AffectedResourcesView
     switch (issueCode) {
       case IssuesManager.AttributionReportingIssue.IssueCode.InvalidRegisterSourceHeader:
       case IssuesManager.AttributionReportingIssue.IssueCode.InvalidRegisterTriggerHeader:
+      case IssuesManager.AttributionReportingIssue.IssueCode.InvalidEligibleHeader:
         this.appendColumnTitle(header, i18nString(UIStrings.request));
         this.appendColumnTitle(header, i18nString(UIStrings.invalidHeaderValue));
         break;
@@ -92,6 +93,7 @@ export class AttributionReportingIssueDetailsView extends AffectedResourcesView
     switch (issueCode) {
       case IssuesManager.AttributionReportingIssue.IssueCode.InvalidRegisterSourceHeader:
       case IssuesManager.AttributionReportingIssue.IssueCode.InvalidRegisterTriggerHeader:
+      case IssuesManager.AttributionReportingIssue.IssueCode.InvalidEligibleHeader:
         this.#appendRequestOrEmptyCell(element, details.request);
         this.appendIssueDetailCell(element, details.invalidParameter || '');
         break;

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

@@ -6,7 +6,6 @@ import * as Common from '../../../core/common/common.js';
 import * as Host from '../../../core/host/host.js';
 import * as i18n from '../../../core/i18n/i18n.js';
 import * as Platform from '../../../core/platform/platform.js';
-import {assertNotNullOrUndefined} from '../../../core/platform/platform.js';
 import * as SDK from '../../../core/sdk/sdk.js';
 import * as Protocol from '../../../generated/protocol.js';
 import * as IssuesManager from '../../../models/issues_manager/issues_manager.js';
@@ -174,12 +173,16 @@ export class RequestHeadersView extends UI.Widget.VBox {
   wasShown(): void {
     this.#request.addEventListener(SDK.NetworkRequest.Events.RemoteAddressChanged, this.#refreshHeadersView, this);
     this.#request.addEventListener(SDK.NetworkRequest.Events.FinishedLoading, this.#refreshHeadersView, this);
+    this.#request.addEventListener(SDK.NetworkRequest.Events.RequestHeadersChanged, this.#refreshHeadersView, this);
+    this.#request.addEventListener(SDK.NetworkRequest.Events.ResponseHeadersChanged, this.#refreshHeadersView, this);
     this.#refreshHeadersView();
   }
 
   willHide(): void {
     this.#request.removeEventListener(SDK.NetworkRequest.Events.RemoteAddressChanged, this.#refreshHeadersView, this);
     this.#request.removeEventListener(SDK.NetworkRequest.Events.FinishedLoading, this.#refreshHeadersView, this);
+    this.#request.removeEventListener(SDK.NetworkRequest.Events.RequestHeadersChanged, this.#refreshHeadersView, this);
+    this.#request.removeEventListener(SDK.NetworkRequest.Events.ResponseHeadersChanged, this.#refreshHeadersView, this);
   }
 
   #refreshHeadersView(): void {
@@ -212,7 +215,9 @@ export class RequestHeadersComponent extends HTMLElement {
   }
 
   #render(): void {
-    assertNotNullOrUndefined(this.#request);
+    if (!this.#request) {
+      return;
+    }
 
     // Disabled until https://crbug.com/1079231 is fixed.
     // clang-format off
@@ -224,8 +229,10 @@ export class RequestHeadersComponent extends HTMLElement {
     // clang-format on
   }
 
-  #renderResponseHeaders(): LitHtml.TemplateResult {
-    assertNotNullOrUndefined(this.#request);
+  #renderResponseHeaders(): LitHtml.LitTemplate {
+    if (!this.#request) {
+      return LitHtml.nothing;
+    }
 
     const headersWithIssues = [];
     if (this.#request.wasBlocked()) {
@@ -299,8 +306,10 @@ export class RequestHeadersComponent extends HTMLElement {
     // clang-format on
   }
 
-  #renderRequestHeaders(): LitHtml.TemplateResult {
-    assertNotNullOrUndefined(this.#request);
+  #renderRequestHeaders(): LitHtml.LitTemplate {
+    if (!this.#request) {
+      return LitHtml.nothing;
+    }
 
     const headers = this.#request.requestHeaders().slice();
     headers.sort(function(a, b) {
@@ -337,8 +346,7 @@ export class RequestHeadersComponent extends HTMLElement {
   }
 
   #maybeRenderProvisionalHeadersWarning(): LitHtml.LitTemplate {
-    assertNotNullOrUndefined(this.#request);
-    if (this.#request.requestHeadersText() !== undefined) {
+    if (!this.#request || this.#request.requestHeadersText() !== undefined) {
       return LitHtml.nothing;
     }
 
@@ -381,7 +389,10 @@ export class RequestHeadersComponent extends HTMLElement {
             LitHtml.nothing
           }${header.name}:
         </div>
-        <div class="header-value ${header.headerValueIncorrect ? 'header-warning' : ''}">
+        <div
+          class="header-value ${header.headerValueIncorrect ? 'header-warning' : ''}"
+          @copy=${():void => Host.userMetrics.actionTaken(Host.UserMetrics.Action.NetworkPanelCopyValue)}
+        >
           ${header.value?.toString() || ''}
           ${this.#maybeRenderHeaderValueSuffix(header)}
         </div>
@@ -535,8 +546,10 @@ export class RequestHeadersComponent extends HTMLElement {
     `;
   }
 
-  #renderGeneralSection(): LitHtml.TemplateResult {
-    assertNotNullOrUndefined(this.#request);
+  #renderGeneralSection(): LitHtml.LitTemplate {
+    if (!this.#request) {
+      return LitHtml.nothing;
+    }
 
     let coloredCircleClassName = 'red-circle';
     if (this.#request.statusCode < 300 || this.#request.statusCode === 304) {
@@ -576,28 +589,43 @@ export class RequestHeadersComponent extends HTMLElement {
       >
         <div class="row">
           <div class="header-name">${i18nString(UIStrings.requestUrl)}:</div>
-          <div class="header-value">${this.#request.url()}</div>
+          <div
+            class="header-value"
+            @copy=${():void => Host.userMetrics.actionTaken(Host.UserMetrics.Action.NetworkPanelCopyValue)}
+          >${this.#request.url()}</div>
         </div>
         ${this.#request.statusCode? html`
           <div class="row">
             <div class="header-name">${i18nString(UIStrings.requestMethod)}:</div>
-            <div class="header-value">${this.#request.requestMethod}</div>
+            <div
+              class="header-value"
+              @copy=${():void => Host.userMetrics.actionTaken(Host.UserMetrics.Action.NetworkPanelCopyValue)}
+            >${this.#request.requestMethod}</div>
           </div>
           <div class="row">
             <div class="header-name">${i18nString(UIStrings.statusCode)}:</div>
-            <div class="header-value ${coloredCircleClassName} ${statusTextHasComment ? 'status-with-comment' : ''}">${statusText}</div>
+            <div
+              class="header-value ${coloredCircleClassName} ${statusTextHasComment ? 'status-with-comment' : ''}"
+              @copy=${():void => Host.userMetrics.actionTaken(Host.UserMetrics.Action.NetworkPanelCopyValue)}
+            >${statusText}</div>
           </div>
         ` : ''}
         ${this.#request.remoteAddress()? html`
           <div class="row">
             <div class="header-name">${i18nString(UIStrings.remoteAddress)}:</div>
-            <div class="header-value">${this.#request.remoteAddress()}</div>
+            <div
+              class="header-value"
+              @copy=${():void => Host.userMetrics.actionTaken(Host.UserMetrics.Action.NetworkPanelCopyValue)}
+            >${this.#request.remoteAddress()}</div>
           </div>
         ` : ''}
         ${this.#request.referrerPolicy()? html`
           <div class="row">
             <div class="header-name">${i18nString(UIStrings.referrerPolicy)}:</div>
-            <div class="header-value">${this.#request.referrerPolicy()}</div>
+            <div
+              class="header-value"
+              @copy=${():void => Host.userMetrics.actionTaken(Host.UserMetrics.Action.NetworkPanelCopyValue)}
+            >${this.#request.referrerPolicy()}</div>
           </div>
         ` : ''}
       </${Category.litTagName}>

package/front_end/panels/protocol_monitor/ProtocolMonitor.ts

@@ -82,6 +82,11 @@ const UIStrings = {
   *@description A placeholder for an input in Protocol Monitor. The input accepts commands that are sent to the backend on Enter. CDP stands for Chrome DevTools Protocol.
   */
   sendRawCDPCommand: 'Send a raw `CDP` command',
+  /**
+   * @description A tooltip text for the input in the Protocol Monitor panel. The tooltip describes what format is expected.
+   */
+  sendRawCDPCommandExplanation:
+      'Format: `\'Domain.commandName\'` for a command without parameters, or `\'{"command":"Domain.commandName", "parameters": {...}}\'` as a JSON object for a command with parameters. `\'cmd\'`/`\'method\'` and `\'args\'`/`\'params\'`/`\'arguments\'` are also supported as alternative keys for the `JSON` object.',
 };
 const str_ = i18n.i18n.registerUIStrings('panels/protocol_monitor/ProtocolMonitor.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
@@ -120,6 +125,8 @@ export class ProtocolMonitorImpl extends UI.Widget.VBox {
   private messages: LogMessage[] = [];
   private isRecording: boolean = false;
 
+  #historyAutocompleteDataProvider = new HistoryAutocompleteDataProvider();
+
   constructor() {
     super(true);
     this.started = false;
@@ -287,31 +294,35 @@ export class ProtocolMonitorImpl extends UI.Widget.VBox {
     });
     topToolbar.appendToolbarItem(this.textFilterUI);
 
-    const onSend = (): void => {
-      const value = input.value();
-      // If input cannot be parsed as json, we assume it's the command name
-      // for a command without parameters. Otherwise, we expect an object
-      // with "command" and "parameters" attributes.
-      let json = null;
-      try {
-        json = JSON.parse(value);
-      } catch (err) {
-      }
-      const command = json ? json.command : value;
-      const parameters = json ? json.parameters : null;
-      const test = ProtocolClient.InspectorBackend.test;
-      // TODO: TS thinks that properties are read-only because
-      // in TS test is defined as a namespace.
-      // @ts-ignore
-      test.sendRawMessage(command, parameters, () => {});
-    };
-    const input = new UI.Toolbar.ToolbarInput(i18nString(UIStrings.sendRawCDPCommand), '', 1, .2, '', undefined, false);
-    input.addEventListener(UI.Toolbar.ToolbarInput.Event.EnterPressed, onSend);
     const bottomToolbar = new UI.Toolbar.Toolbar('protocol-monitor-bottom-toolbar', this.contentElement);
-    bottomToolbar.appendToolbarItem(input);
+    bottomToolbar.appendToolbarItem(this.#createCommandInput());
   }
 
-  static instance(opts = {forceNew: null}): ProtocolMonitorImpl {
+  #createCommandInput(): UI.Toolbar.ToolbarInput {
+    const placeholder = i18nString(UIStrings.sendRawCDPCommand);
+    const accessiblePlaceholder = placeholder;
+    const growFactor = 1;
+    const shrinkFactor = 0.2;
+    const tooltip = i18nString(UIStrings.sendRawCDPCommandExplanation);
+    const input = new UI.Toolbar.ToolbarInput(
+        placeholder, accessiblePlaceholder, growFactor, shrinkFactor, tooltip,
+        this.#historyAutocompleteDataProvider.buildTextPromptCompletions, false);
+    input.addEventListener(UI.Toolbar.ToolbarInput.Event.EnterPressed, () => this.#onCommandSend(input));
+    return input;
+  }
+
+  #onCommandSend(input: UI.Toolbar.ToolbarInput): void {
+    const value = input.value();
+    const {command, parameters} = parseCommandInput(value);
+    const test = ProtocolClient.InspectorBackend.test;
+    // TODO: TS thinks that properties are read-only because
+    // in TS test is defined as a namespace.
+    // @ts-ignore
+    test.sendRawMessage(command, parameters, () => {});
+    this.#historyAutocompleteDataProvider.addEntry(value);
+  }
+
+  static instance(opts: {forceNew: null|boolean} = {forceNew: null}): ProtocolMonitorImpl {
     const {forceNew} = opts;
     if (!protocolMonitorImplInstance || forceNew) {
       protocolMonitorImplInstance = new ProtocolMonitorImpl();
@@ -481,6 +492,39 @@ export class ProtocolMonitorImpl extends UI.Widget.VBox {
   }
 }
 
+export class HistoryAutocompleteDataProvider {
+  #maxHistorySize = 200;
+  #commandHistory = new Set<string>();
+
+  constructor(maxHistorySize?: number) {
+    if (maxHistorySize !== undefined) {
+      this.#maxHistorySize = maxHistorySize;
+    }
+  }
+
+  buildTextPromptCompletions =
+      async(expression: string, prefix: string, force?: boolean): Promise<UI.SuggestBox.Suggestions> => {
+    if (!prefix && !force && expression) {
+      return [];
+    }
+    const newestToOldest = [...this.#commandHistory].reverse();
+    return newestToOldest.filter(cmd => cmd.startsWith(prefix)).map(text => ({
+                                                                      text,
+                                                                    }));
+  };
+
+  addEntry(value: string): void {
+    if (this.#commandHistory.has(value)) {
+      this.#commandHistory.delete(value);
+    }
+    this.#commandHistory.add(value);
+    if (this.#commandHistory.size > this.#maxHistorySize) {
+      const earliestEntry = this.#commandHistory.values().next().value;
+      this.#commandHistory.delete(earliestEntry);
+    }
+  }
+}
+
 export class InfoWidget extends UI.Widget.VBox {
   private readonly tabbedPane: UI.TabbedPane.TabbedPane;
   constructor() {
@@ -518,3 +562,17 @@ export class InfoWidget extends UI.Widget.VBox {
     this.tabbedPane.changeTabView('response', SourceFrame.JSONView.JSONView.createViewSync(responseParsed));
   }
 }
+
+export function parseCommandInput(input: string): {command: string, parameters: unknown} {
+  // If input cannot be parsed as json, we assume it's the command name
+  // for a command without parameters. Otherwise, we expect an object
+  // with "command"/"method"/"cmd" and "parameters"/"params"/"args"/"arguments" attributes.
+  let json = null;
+  try {
+    json = JSON.parse(input);
+  } catch (err) {
+  }
+  const command = json ? json.command || json.method || json.cmd : input;
+  const parameters = json ? json.parameters || json.params || json.args || json.arguments : null;
+  return {command, parameters};
+}

package/front_end/ui/legacy/SplitWidget.ts

@@ -532,6 +532,7 @@ export class SplitWidget extends Common.ObjectWrapper.eventMixin<EventTypes, typ
     // This order of things is important.
     // 1. Resize main element early and force layout.
     this.contentElement.style.setProperty(animatedMarginPropertyName, marginFrom);
+    this.contentElement.style.setProperty('overflow', 'hidden');
     if (!reverse) {
       suppressUnused(this.mainElement.offsetWidth);
       suppressUnused(this.sidebarElementInternal.offsetWidth);
@@ -579,6 +580,7 @@ export class SplitWidget extends Common.ObjectWrapper.eventMixin<EventTypes, typ
     this.contentElement.style.removeProperty('margin-bottom');
     this.contentElement.style.removeProperty('margin-left');
     this.contentElement.style.removeProperty('transition');
+    this.contentElement.style.removeProperty('overflow');
 
     if (this.animationFrameHandle) {
       this.contentElement.window().cancelAnimationFrame(this.animationFrameHandle);

package/front_end/ui/legacy/TextPrompt.ts

@@ -89,7 +89,7 @@ export class TextPrompt extends Common.ObjectWrapper.ObjectWrapper<EventTypes> i
   }
 
   initialize(
-      completions: (this: null, arg1: string, arg2: string, arg3?: boolean|undefined) => Promise<Suggestion[]>,
+      completions: (this: null, expression: string, filter: string, force?: boolean|undefined) => Promise<Suggestion[]>,
       stopCharacters?: string, usesSuggestionBuilder?: boolean): void {
     this.loadCompletions = completions;
     this.completionStopCharacters = stopCharacters || ' =:[({;,!+-*/&|^<>.';

package/package.json

@@ -55,5 +55,5 @@
     "unittest": "scripts/test/run_unittests.py --no-text-coverage",
     "watch": "vpython third_party/node/node.py --output scripts/watch_build.js"
   },
-  "version": "1.0.1029149"
+  "version": "1.0.1030070"
 }