chrome-devtools-frontend 1.0.920568 → 1.0.922044

package/front_end/models/extensions/ExtensionAPI.ts

@@ -149,7 +149,7 @@ export namespace PrivateAPI {
     evaluateOptions?: EvaluateOptions,
   };
   type SetSidebarPageRequest = {command: Commands.SetSidebarPage, id: string, page: string};
-  type OpenResourceRequest = {command: Commands.OpenResource, url: string, lineNumber: number};
+  type OpenResourceRequest = {command: Commands.OpenResource, url: string, lineNumber: number, columnNumber: number};
   type SetOpenResourceHandlerRequest = {command: Commands.SetOpenResourceHandler, handlerPresent: boolean};
   type ReloadRequest = {
     command: Commands.Reload,
@@ -545,7 +545,7 @@ self.injectedExtensionAPI = function(
       const id = 'extension-panel-' + extensionServer.nextObjectId();
       extensionServer.sendRequest(
           {command: PrivateAPI.Commands.CreatePanel, id, title, page},
-          callback && callback.bind(this, new (Constructor(ExtensionPanel))(id)));
+          callback && ((): unknown => callback.call(this, new (Constructor(ExtensionPanel))(id))));
     },
 
     setOpenResourceHandler: function(
@@ -576,8 +576,13 @@ self.injectedExtensionAPI = function(
       }
     },
 
-    openResource: function(url: string, lineNumber: number, callback?: (response: unknown) => unknown): void {
-      extensionServer.sendRequest({command: PrivateAPI.Commands.OpenResource, url, lineNumber}, callback);
+    openResource: function(
+        url: string, lineNumber: number, columnNumber?: number, _callback?: (response: unknown) => unknown): void {
+      const callbackArg = extractCallbackArgument(arguments);
+      // Handle older API:
+      const columnNumberArg = typeof columnNumber === 'number' ? columnNumber : 0;
+      extensionServer.sendRequest(
+          {command: PrivateAPI.Commands.OpenResource, url, lineNumber, columnNumber: columnNumberArg}, callbackArg);
     },
 
     get SearchAction(): {[key: string]: string} {

package/front_end/models/extensions/ExtensionServer.ts

@@ -493,7 +493,7 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     }
     const uiSourceCode = Workspace.Workspace.WorkspaceImpl.instance().uiSourceCodeForURL(message.url);
     if (uiSourceCode) {
-      Common.Revealer.reveal(uiSourceCode.uiLocation(message.lineNumber, 0));
+      Common.Revealer.reveal(uiSourceCode.uiLocation(message.lineNumber, message.columnNumber));
       return this.status.OK();
     }
 

package/front_end/models/issues_manager/AttributionReportingIssue.ts

@@ -104,7 +104,10 @@ export class AttributionReportingIssue extends Issue<IssueCode> {
           links: [],
         };
       case IssueCode.AttributionEventSourceTriggerDataTooLarge:
-        return null;
+        return {
+          file: 'arAttributionEventSourceTriggerDataTooLarge.md',
+          links: [],
+        };
     }
   }
 

package/front_end/models/issues_manager/SameSiteCookieIssue.ts

@@ -30,9 +30,9 @@ const UIStrings = {
    */
   anInsecure: 'an insecure',  // eslint-disable-line rulesdir/l10n_no_unused_message
   /**
-   * @description Label for a link for SameParty Issues.
+   * @description Label for a link for SameParty Issues. 'Attribute' refers to a cookie attribute.
    */
-  firstPartySetsExplained: '`First-Party Sets` explained',
+  firstPartySetsExplained: '`First-Party Sets` and the `SameParty` attribute',
 };
 const str_ = i18n.i18n.registerUIStrings('models/issues_manager/SameSiteCookieIssue.ts', UIStrings);
 const i18nLazyString = i18n.i18n.getLazilyComputedLocalizedString.bind(undefined, str_);
@@ -418,7 +418,15 @@ function sameSiteExcludeContextDowngradeSet(isSecure: boolean): LazyMarkdownIssu
 const sameSiteInvalidSameParty: LazyMarkdownIssueDescription = {
   file: 'SameSiteInvalidSameParty.md',
   links: [{
-    link: 'https://developer.chrome.com/docs/privacy-sandbox/first-party-sets/',
+    link: 'https://developer.chrome.com/blog/first-party-sets-sameparty/',
+    linkTitle: i18nLazyString(UIStrings.firstPartySetsExplained),
+  }],
+};
+
+const samePartyCrossPartyContextSet: LazyMarkdownIssueDescription = {
+  file: 'SameSiteSamePartyCrossPartyContextSet.md',
+  links: [{
+    link: 'https://developer.chrome.com/blog/first-party-sets-sameparty/',
     linkTitle: i18nLazyString(UIStrings.firstPartySetsExplained),
   }],
 };
@@ -451,4 +459,5 @@ const issueDescriptions: Map<string, LazyMarkdownIssueDescription> = new Map([
   ['SameSiteCookieIssue::ExcludeContextDowngrade::SetCookie::Secure', sameSiteExcludeContextDowngradeSet(true)],
   ['SameSiteCookieIssue::ExcludeContextDowngrade::SetCookie::Insecure', sameSiteExcludeContextDowngradeSet(false)],
   ['SameSiteCookieIssue::ExcludeInvalidSameParty::SetCookie', sameSiteInvalidSameParty],
+  ['SameSiteCookieIssue::ExcludeSamePartyCrossPartyContext::SetCookie', samePartyCrossPartyContextSet],
 ]);

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

@@ -0,0 +1,10 @@
+# Make sure a cookie is using the SameParty attribute correctly
+
+Setting cross-site cookies with the `SameParty` attribute is only possible if
+both domains are a part of the same First-Party Set.
+
+To allow setting cross-site cookies, try one of the following:
+* If the domains satisfy the First-Party Set criteria, add them to the same First-Party Set.
+* If the domains don't satisfy the First-Party Set criteria, remove the `SameParty` attribute and specify `SameSite=None`.
+
+If you don't have the option to do any of the above, cookies are not intended to be set in cross-site contexts.

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

@@ -0,0 +1,4 @@
+# Ensure the event source trigger data doesn't exceed the 1-bit limit
+
+The `event-source-trigger-data` query parameter of an attribution redirect was truncated to the lowest 1 bit, because it was exceeding the limit.
+Replace the `event-source-trigger-data` parameter with an integer that respects the 1-bit limit, that is a number between 0 and 1.

package/front_end/models/timeline_model/TimelineModel.ts

@@ -1075,7 +1075,11 @@ export class TimelineModelImpl {
 
       case RecordType.Paint: {
         this.invalidationTracker.didPaint = true;
-        timelineData.backendNodeIds.push(eventData['nodeId']);
+        // With CompositeAfterPaint enabled, paint events are no longer
+        // associated with a Node, and nodeId will not be present.
+        if ('nodeId' in eventData) {
+          timelineData.backendNodeIds.push(eventData['nodeId']);
+        }
         // Only keep layer paint events, skip paints for subframes that get painted to the same layer as parent.
         if (!eventData['layerId']) {
           break;

package/front_end/panels/application/ApplicationPanelSidebar.ts

@@ -692,8 +692,8 @@ export class ApplicationPanelSidebar extends UI.Widget.VBox implements SDK.Targe
     this.panel.showView(view);
   }
 
-  private async updateDatabaseTables(event: Common.EventTarget.EventTargetEvent): Promise<void> {
-    const database = (event.data as DatabaseModelDatabase);
+  private async updateDatabaseTables(event: Common.EventTarget.EventTargetEvent<DatabaseModelDatabase>): Promise<void> {
+    const database = event.data;
 
     if (!database) {
       return;

package/front_end/panels/application/DatabaseQueryView.ts

@@ -27,6 +27,7 @@
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
+import * as Common from '../../core/common/common.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as DataGrid from '../../ui/legacy/components/data_grid/data_grid.js';
 import * as UI from '../../ui/legacy/legacy.js';
@@ -46,7 +47,8 @@ const UIStrings = {
 };
 const str_ = i18n.i18n.registerUIStrings('panels/application/DatabaseQueryView.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
-export class DatabaseQueryView extends UI.Widget.VBox {
+export class DatabaseQueryView extends Common.ObjectWrapper.eventMixin<EventTypes, typeof UI.Widget.VBox>(
+    UI.Widget.VBox) {
   database: Database;
   private queryWrapper: HTMLElement;
   private readonly promptContainer: HTMLElement;
@@ -316,6 +318,10 @@ export enum Events {
   SchemaUpdated = 'SchemaUpdated',
 }
 
+export type EventTypes = {
+  [Events.SchemaUpdated]: Database,
+};
+
 export const SQL_BUILT_INS = [
   'SELECT ',
   'FROM ',

package/front_end/panels/changes/ChangesSidebar.ts

@@ -22,7 +22,8 @@ const UIStrings = {
 const str_ = i18n.i18n.registerUIStrings('panels/changes/ChangesSidebar.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 
-export class ChangesSidebar extends UI.Widget.Widget {
+export class ChangesSidebar extends Common.ObjectWrapper.eventMixin<EventTypes, typeof UI.Widget.Widget>(
+    UI.Widget.Widget) {
   private treeoutline: UI.TreeOutline.TreeOutlineInShadow;
   private readonly treeElements: Map<Workspace.UISourceCode.UISourceCode, UISourceCodeTreeElement>;
   private readonly workspaceDiff: WorkspaceDiff.WorkspaceDiff.WorkspaceDiffImpl;
@@ -110,6 +111,10 @@ export const enum Events {
   SelectedUISourceCodeChanged = 'SelectedUISourceCodeChanged',
 }
 
+export type EventTypes = {
+  [Events.SelectedUISourceCodeChanged]: void,
+};
+
 export class UISourceCodeTreeElement extends UI.TreeOutline.TreeElement {
   uiSourceCode: Workspace.UISourceCode.UISourceCode;
   private readonly eventListeners: Common.EventTarget.EventDescriptor[];

package/front_end/panels/console/ConsolePrompt.ts

@@ -22,7 +22,8 @@ const UIStrings = {
 };
 const str_ = i18n.i18n.registerUIStrings('panels/console/ConsolePrompt.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
-export class ConsolePrompt extends UI.Widget.Widget {
+export class ConsolePrompt extends Common.ObjectWrapper.eventMixin<EventTypes, typeof UI.Widget.Widget>(
+    UI.Widget.Widget) {
   private addCompletionsFromHistory: boolean;
   private historyInternal: ConsoleHistoryManager;
   private initialText: string;
@@ -455,3 +456,7 @@ export class ConsoleHistoryManager {
 export const enum Events {
   TextChanged = 'TextChanged',
 }
+
+export type EventTypes = {
+  [Events.TextChanged]: void,
+};

package/front_end/panels/css_overview/CSSOverviewCompletedView.ts

@@ -300,8 +300,8 @@ export class CSSOverviewCompletedView extends UI.Panel.PanelWithSidebar {
     // TODO(paullewis): update the links in the panels in case source has been .
   }
 
-  private sideBarItemSelected(event: Common.EventTarget.EventTargetEvent): void {
-    const data = (event.data as string);
+  private sideBarItemSelected(event: Common.EventTarget.EventTargetEvent<string>): void {
+    const {data} = event;
     const section = (this.fragment as UI.Fragment.Fragment).$(data);
     if (!section) {
       return;

package/front_end/panels/css_overview/CSSOverviewSidebarPanel.ts

@@ -2,6 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import * as Common from '../../core/common/common.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
@@ -16,7 +17,8 @@ const UIStrings = {
 const str_ = i18n.i18n.registerUIStrings('panels/css_overview/CSSOverviewSidebarPanel.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 
-export class CSSOverviewSidebarPanel extends UI.Widget.VBox {
+export class CSSOverviewSidebarPanel extends Common.ObjectWrapper.eventMixin<EventTypes, typeof UI.Widget.VBox>(
+    UI.Widget.VBox) {
   // eslint-disable-next-line @typescript-eslint/naming-convention
   static get ITEM_CLASS_NAME(): string {
     return 'overview-sidebar-panel-item';
@@ -97,3 +99,8 @@ export const enum SidebarEvents {
   ItemSelected = 'ItemSelected',
   Reset = 'Reset',
 }
+
+export type EventTypes = {
+  [SidebarEvents.ItemSelected]: string,
+  [SidebarEvents.Reset]: void,
+};

package/front_end/panels/elements/ElementsPanel.ts

@@ -56,6 +56,7 @@ import {ElementsTreeOutline} from './ElementsTreeOutline.js';
 import type {MarkerDecorator} from './MarkerDecorator.js';
 import {MetricsSidebarPane} from './MetricsSidebarPane.js';
 import {Events as StylesSidebarPaneEvents, StylesSidebarPane} from './StylesSidebarPane.js';
+import type {StylesUpdateCompletedEvent} from './StylesSidebarPane.js';
 
 const UIStrings = {
   /**
@@ -124,6 +125,18 @@ const UIStrings = {
   * @example {::after, ::before} PH1
   */
   elementStateS: 'Element state: {PH1}',
+  /**
+  * @description Accessible name for side panel toolbar.
+  */
+  sidePanelToolbar: 'Side panel toolbar',
+  /**
+  * @description Accessible name for side panel contents.
+  */
+  sidePanelContent: 'Side panel content',
+  /**
+  * @description Accessible name for the DOM tree explorer view.
+  */
+  domTreeExplorer: 'DOM tree explorer',
 };
 
 const str_ = i18n.i18n.registerUIStrings('panels/elements/ElementsPanel.ts', UIStrings);
@@ -205,6 +218,9 @@ export class ElementsPanel extends UI.Panel.Panel implements UI.SearchableView.S
     stackElement.appendChild(this.contentElementInternal);
     stackElement.appendChild(crumbsContainer);
 
+    UI.ARIAUtils.markAsMain(this.contentElementInternal);
+    UI.ARIAUtils.setAccessibleName(this.contentElementInternal, i18nString(UIStrings.domTreeExplorer));
+
     this.splitWidget.setMainWidget(this.searchableViewInternal);
     this.splitMode = null;
 
@@ -957,7 +973,7 @@ export class ElementsPanel extends UI.Panel.Panel implements UI.SearchableView.S
 
     let skippedInitialTabSelectedEvent = false;
 
-    const toggleMetricsWidget = (event: Common.EventTarget.EventTargetEvent): void => {
+    const toggleMetricsWidget = (event: Common.EventTarget.EventTargetEvent<StylesUpdateCompletedEvent>): void => {
       this.metricsWidget.toggleVisibility(event.data.hasMatchedStyles);
     };
 
@@ -987,6 +1003,14 @@ export class ElementsPanel extends UI.Panel.Panel implements UI.SearchableView.S
       this.splitWidget.installResizer(tabbedPane.headerElement());
     }
 
+    const headerElement = tabbedPane.headerElement();
+    UI.ARIAUtils.markAsNavigation(headerElement);
+    UI.ARIAUtils.setAccessibleName(headerElement, i18nString(UIStrings.sidePanelToolbar));
+
+    const contentElement = tabbedPane.tabbedPaneContentElement();
+    UI.ARIAUtils.markAsComplementary(contentElement);
+    UI.ARIAUtils.setAccessibleName(contentElement, i18nString(UIStrings.sidePanelContent));
+
     const stylesView = new UI.View.SimpleView(i18nString(UIStrings.styles));
     this.sidebarPaneView.appendView(stylesView);
     stylesView.element.classList.add('flex-auto');

package/front_end/panels/elements/StylesSidebarPane.ts

@@ -192,7 +192,8 @@ let _stylesSidebarPaneInstance: StylesSidebarPane;
 const STYLE_TAG = '<' +
     'style>';
 
-export class StylesSidebarPane extends ElementsSidebarPane {
+export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventTypes, typeof ElementsSidebarPane>(
+    ElementsSidebarPane) {
   private currentToolbarPane: UI.Widget.Widget|null;
   private animatedToolbarPane: UI.Widget.Widget|null;
   private pendingWidget: UI.Widget.Widget|null;
@@ -800,7 +801,7 @@ export class StylesSidebarPane extends ElementsSidebarPane {
     // Record the elements tool load time after the sidepane has loaded.
     Host.userMetrics.panelLoaded('elements', 'DevTools.Launch.Elements');
 
-    this.dispatchEventToListeners(Events.StylesUpdateCompleted, {hasStyle: true});
+    this.dispatchEventToListeners(Events.StylesUpdateCompleted, {hasMatchedStyles: false});
   }
 
   private nodeStylesUpdatedForTest(_node: SDK.DOMModel.DOMNode, _rebuild: boolean): void {
@@ -1060,6 +1061,15 @@ export const enum Events {
   StylesUpdateCompleted = 'StylesUpdateCompleted',
 }
 
+export interface StylesUpdateCompletedEvent {
+  hasMatchedStyles: boolean;
+}
+
+export type EventTypes = {
+  [Events.InitialUpdateCompleted]: void,
+  [Events.StylesUpdateCompleted]: StylesUpdateCompletedEvent,
+};
+
 // TODO(crbug.com/1172300) Ignored during the jsdoc to ts migration
 // eslint-disable-next-line @typescript-eslint/naming-convention
 export const _maxLinkLength = 23;

package/front_end/panels/elements/components/ElementsBreadcrumbs.ts

@@ -2,9 +2,11 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import * as i18n from '../../../core/i18n/i18n.js';
 import * as ComponentHelpers from '../../../ui/components/helpers/helpers.js';
 import * as Coordinator from '../../../ui/components/render_coordinator/render_coordinator.js';
 import * as LitHtml from '../../../ui/lit-html/lit-html.js';
+
 import elementsBreadcrumbsStyles from './elementsBreadcrumbs.css.js';
 
 import type {UserScrollPosition} from './ElementsBreadcrumbsUtils.js';
@@ -15,6 +17,16 @@ import type {DOMNode} from './Helper.js';
 import {NodeText} from './NodeText.js';
 import type {NodeTextData} from './NodeText.js';
 
+const UIStrings = {
+  /**
+  * @description Accessible name for DOM tree breadcrumb navigation.
+  */
+  breadcrumbs: 'DOM tree breadcrumbs',
+};
+
+const str_ = i18n.i18n.registerUIStrings('panels/elements/components/ElementsBreadcrumbs.ts', UIStrings);
+const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
+
 export class NodeSelectedEvent extends Event {
   static readonly eventName = 'breadcrumbsnodeselected';
   legacyDomNode: SDK.DOMModel.DOMNode;
@@ -264,7 +276,7 @@ export class ElementsBreadcrumbs extends HTMLElement {
       // Disabled until https://crbug.com/1079231 is fixed.
       // clang-format off
       LitHtml.render(LitHtml.html`
-        <nav class="crumbs">
+        <nav class="crumbs" aria-label="${i18nString(UIStrings.breadcrumbs)}">
           ${this.renderOverflowButton('left', this.userScrollPosition === 'start')}
 
           <div class="crumbs-window" @scroll=${this.onCrumbsWindowScroll}>

package/front_end/panels/elements/layoutPane.css

@@ -54,6 +54,7 @@
   display: flex;
   flex-direction: row;
   align-items: center;
+  min-width: 40px;
 }
 
 .checkbox-settings .checkbox-label {

package/front_end/panels/emulation/AdvancedApp.ts

@@ -7,21 +7,11 @@ import * as Host from '../../core/host/host.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
 import {DeviceModeWrapper} from './DeviceModeWrapper.js';
+import type {Bounds} from './InspectedPagePlaceholder.js';
 import {Events, InspectedPagePlaceholder} from './InspectedPagePlaceholder.js';
 
 let appInstance: AdvancedApp;
 
-interface Event {
-  data: {
-    to: UI.DockController.DockState,
-    from: UI.DockController.DockState|undefined,
-    x: number,
-    y: number,
-    width: number,
-    height: number,
-  };
-}
-
 export class AdvancedApp implements Common.App.App {
   private rootSplitWidget!: UI.SplitWidget.SplitWidget;
   private deviceModeView!: DeviceModeWrapper;
@@ -170,7 +160,7 @@ export class AdvancedApp implements Common.App.App {
     return UI.DockController.DockController.instance().dockSide() !== UI.DockController.DockState.UNDOCKED;
   }
 
-  private onSetInspectedPageBounds(event: Event): void {
+  private onSetInspectedPageBounds(event: Common.EventTarget.EventTargetEvent<Bounds>): void {
     if (this.changingDockSide) {
       return;
     }

package/front_end/panels/emulation/InspectedPagePlaceholder.ts

@@ -2,11 +2,13 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import * as Common from '../../core/common/common.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
 let inspectedPagePlaceholderInstance: InspectedPagePlaceholder;
 
-export class InspectedPagePlaceholder extends UI.Widget.Widget {
+export class InspectedPagePlaceholder extends Common.ObjectWrapper.eventMixin<EventTypes, typeof UI.Widget.Widget>(
+    UI.Widget.Widget) {
   private updateId?: number;
   constructor() {
     super(true);
@@ -81,3 +83,14 @@ export class InspectedPagePlaceholder extends UI.Widget.Widget {
 export const enum Events {
   Update = 'Update',
 }
+
+export interface Bounds {
+  x: number;
+  y: number;
+  height: number;
+  width: number;
+}
+
+export type EventTypes = {
+  [Events.Update]: Bounds,
+};