chrome-devtools-frontend 1.0.1669021 → 1.0.1672557

package/front_end/panels/settings/emulation/devicesSettingsTab.css

@@ -9,6 +9,19 @@
   padding-right: 0;
 }
 
+.device-group-container {
+  margin-bottom: 8px;
+}
+
+.device-group-title {
+  font-weight: 600;
+  color: var(--sys-color-on-surface-subtle);
+  font-size: 11px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  margin: 12px 0 4px;
+}
+
 .list {
   &:has(div) {
     border: none;
@@ -69,6 +82,11 @@
   margin-bottom: 5px;
 }
 
+.devices-edit-safe-area-group {
+  display: flex;
+  flex-direction: column;
+}
+
 .devices-edit-fields b {
   margin-top: 8px;
   margin-bottom: 0;

package/front_end/panels/settings/settings-meta.ts

@@ -253,7 +253,6 @@ Common.Revealer.registerRevealer({
     return [
       Common.Settings.Setting,
       Root.Runtime.Experiment,
-      Root.Runtime.HostExperiment,
     ];
   },
   async loadRevealer() {

package/front_end/panels/sources/CategorizedBreakpointL10n.ts

@@ -137,8 +137,6 @@ const LOCALIZED_INSTRUMENTATION_NAMES:
           i18nLazyString(UIStrings.scriptFirstStatement),
       [SDK.EventBreakpointsModel.InstrumentationNames.SCRIPT_BLOCKED_BY_CSP]:
           i18nLazyString(UIStrings.scriptBlockedByContentSecurity),
-      [SDK.EventBreakpointsModel.InstrumentationNames.SHARED_STORAGE_WORKLET_SCRIPT_FIRST_STATEMENT]:
-          i18nLazyString(UIStrings.scriptFirstStatement),
       [SDK.EventBreakpointsModel.InstrumentationNames.REQUEST_ANIMATION_FRAME]:
           i18nLazyString(UIStrings.requestAnimationFrame),
       [SDK.EventBreakpointsModel.InstrumentationNames.CANCEL_ANIMATION_FRAME]:

package/front_end/panels/sources/DebuggerPausedMessage.ts

@@ -182,11 +182,17 @@ const DEFAULT_VIEW = (input: ViewInput|null, _output: undefined, target: Documen
 type View = typeof DEFAULT_VIEW;
 
 export class DebuggerPausedMessage extends UI.Widget.Widget<ShadowRoot> {
+  static override readonly INJECT = [SDK.EventBreakpointsModel.EventBreakpointsManager] as const;
+
   #viewInput: ViewInput|null = null;
-  constructor(element?: HTMLElement, private readonly view: View = DEFAULT_VIEW) {
+  readonly #eventBreakpointsManager: SDK.EventBreakpointsModel.EventBreakpointsManager;
+  constructor(element: HTMLElement|undefined,
+              [eventBreakpointsManager]: UI.Widget.WidgetDependencies<typeof DebuggerPausedMessage>,
+              private readonly view: View = DEFAULT_VIEW) {
     super(element, {
       useShadowDom: 'pure',
     });
+    this.#eventBreakpointsManager = eventBreakpointsManager;
   }
 
   private static descriptionWithoutStack(description: string): string {
@@ -221,7 +227,7 @@ export class DebuggerPausedMessage extends UI.Widget.Widget<ShadowRoot> {
     };
   }
 
-  static #findEventNameForUi(detailsAuxData?: SDK.DebuggerModel.EventListenerPausedDetailsAuxData): string {
+  #findEventNameForUi(detailsAuxData?: SDK.DebuggerModel.EventListenerPausedDetailsAuxData): string {
     if (!detailsAuxData) {
       return '';
     }
@@ -237,7 +243,7 @@ export class DebuggerPausedMessage extends UI.Widget.Widget<ShadowRoot> {
     }
 
     let breakpoint: SDK.CategorizedBreakpoint.CategorizedBreakpoint|null =
-        SDK.EventBreakpointsModel.EventBreakpointsManager.instance().resolveEventListenerBreakpoint(detailsAuxData);
+        this.#eventBreakpointsManager.resolveEventListenerBreakpoint(detailsAuxData);
     if (breakpoint) {
       // EventBreakpointsManager breakpoints are the only ones with localized names.
       return getLocalizedBreakpointName(breakpoint.name);
@@ -269,8 +275,8 @@ export class DebuggerPausedMessage extends UI.Widget.Widget<ShadowRoot> {
     if (details.reason === Protocol.Debugger.PausedEventReason.DOM) {
       this.#viewInput = await DebuggerPausedMessage.createDOMBreakpointHitMessageDetails(details);
     } else if (details.reason === Protocol.Debugger.PausedEventReason.EventListener) {
-      const eventNameForUI = DebuggerPausedMessage.#findEventNameForUi(
-          details.auxData as SDK.DebuggerModel.EventListenerPausedDetailsAuxData);
+      const eventNameForUI =
+          this.#findEventNameForUi(details.auxData as SDK.DebuggerModel.EventListenerPausedDetailsAuxData);
       this.#viewInput = {mainText: i18nString(UIStrings.pausedOnEventListener), subText: eventNameForUI, errorLike};
     } else if (details.reason === Protocol.Debugger.PausedEventReason.XHR) {
       const auxData = (details.auxData as PausedDetailsAuxData);

package/front_end/panels/sources/DebuggerPlugin.ts

@@ -1773,7 +1773,7 @@ export class BreakpointLocationRevealer implements
   async reveal(breakpointLocation: Breakpoints.BreakpointManager.BreakpointLocation, omitFocus?: boolean|undefined):
       Promise<void> {
     const {uiLocation} = breakpointLocation;
-    SourcesPanel.instance().showUILocation(uiLocation, omitFocus);
+    await SourcesPanel.instance().showUILocation(uiLocation, omitFocus);
     const debuggerPlugin = debuggerPluginForUISourceCode.get(uiLocation.uiSourceCode);
     if (debuggerPlugin) {
       debuggerPlugin.editBreakpointLocation(breakpointLocation);

package/front_end/panels/sources/EditingLocationHistoryManager.ts

@@ -15,7 +15,7 @@ export const HistoryDepth = 20;
 export class EditingLocationHistoryManager {
   private readonly entries: EditingLocationHistoryEntry[] = [];
   private current = -1;
-  private revealing = false;
+  private revealingCount = 0;
 
   constructor(private readonly sourcesView: SourcesView) {
   }
@@ -31,7 +31,7 @@ export class EditingLocationHistoryManager {
     }
     const prevPos = update.startState.selection.main;
     const newPos = update.state.selection.main;
-    const isJump = !this.revealing && prevPos.anchor !== newPos.anchor && update.transactions.some(tr => {
+    const isJump = this.revealingCount === 0 && prevPos.anchor !== newPos.anchor && update.transactions.some(tr => {
       return Boolean(
           tr.isUserEvent('select.pointer') || tr.isUserEvent('select.reveal') || tr.isUserEvent('select.search'));
     });
@@ -50,7 +50,7 @@ export class EditingLocationHistoryManager {
   }
 
   updateCurrentState(uiSourceCode: Workspace.UISourceCode.UISourceCode, position: number): void {
-    if (!this.revealing) {
+    if (this.revealingCount === 0) {
       const top = this.current >= 0 ? this.entries[this.current] : null;
       if (top?.matches(uiSourceCode)) {
         top.position = position;
@@ -66,26 +66,29 @@ export class EditingLocationHistoryManager {
     }
   }
 
-  private reveal(entry: EditingLocationHistoryEntry): void {
+  private async reveal(entry: EditingLocationHistoryEntry): Promise<void> {
     const uiSourceCode = Workspace.Workspace.WorkspaceImpl.instance().uiSourceCode(entry.projectId, entry.url);
     if (uiSourceCode) {
-      this.revealing = true;
-      this.sourcesView.showSourceLocation(uiSourceCode, entry.position, false, true);
-      this.revealing = false;
+      this.revealingCount++;
+      try {
+        await this.sourcesView.showSourceLocation(uiSourceCode, entry.position, false, true);
+      } finally {
+        this.revealingCount--;
+      }
     }
   }
 
   rollback(): void {
     if (this.current > 0) {
       this.current--;
-      this.reveal(this.entries[this.current]);
+      void this.reveal(this.entries[this.current]);
     }
   }
 
   rollover(): void {
     if (this.current < this.entries.length - 1) {
       this.current++;
-      this.reveal(this.entries[this.current]);
+      void this.reveal(this.entries[this.current]);
     }
   }
 

package/front_end/panels/sources/SourcesPanel.ts

@@ -247,7 +247,8 @@ export class SourcesPanel extends UI.Panel.Panel implements
 
     this.debugToolbar = this.createDebugToolbar();
     this.debugToolbarDrawer = this.createDebugToolbarDrawer();
-    this.debuggerPausedMessage = new DebuggerPausedMessage();
+    this.debuggerPausedMessage =
+        new DebuggerPausedMessage(undefined, [SDK.EventBreakpointsModel.EventBreakpointsManager.instance()]);
 
     const initialDebugSidebarWidth = 225;
     this.splitWidget =
@@ -355,8 +356,8 @@ export class SourcesPanel extends UI.Panel.Panel implements
   }
 
   static updateResizerAndSidebarButtons(panel: SourcesPanel): void {
-    panel.#sourcesView.leftToolbar().removeToolbarItems();
-    panel.#sourcesView.rightToolbar().removeToolbarItems();
+    const leftItems: UI.Toolbar.ToolbarItem[] = [];
+    const rightItems: UI.Toolbar.ToolbarItem[] = [];
     panel.#sourcesView.bottomToolbar().removeToolbarItems();
     const isInWrapper = UI.Context.Context.instance().flavor(QuickSourceView) &&
         !UI.InspectorView.InspectorView.instance().isDrawerMinimized();
@@ -366,15 +367,17 @@ export class SourcesPanel extends UI.Panel.Panel implements
       panel.splitWidget.installResizer(panel.#sourcesView.scriptViewToolbar());
     }
     if (!isInWrapper) {
-      panel.#sourcesView.leftToolbar().appendToolbarItem(panel.toggleNavigatorSidebarButton);
+      leftItems.push(panel.toggleNavigatorSidebarButton);
       if (!Root.Runtime.Runtime.isTraceApp()) {
         if (panel.splitWidget.isVertical()) {
-          panel.#sourcesView.rightToolbar().appendToolbarItem(panel.toggleDebuggerSidebarButton);
+          rightItems.push(panel.toggleDebuggerSidebarButton);
         } else {
           panel.#sourcesView.bottomToolbar().appendToolbarItem(panel.toggleDebuggerSidebarButton);
         }
       }
     }
+    panel.#sourcesView.leftToolbarItems = leftItems;
+    panel.#sourcesView.rightToolbarItems = rightItems;
   }
 
   targetAdded(_target: SDK.Target.Target): void {
@@ -597,9 +600,8 @@ export class SourcesPanel extends UI.Panel.Panel implements
     return this.#sourcesView.visibleView();
   }
 
-  showUISourceCode(
-      uiSourceCode: Workspace.UISourceCode.UISourceCode, location?: SourceFrame.SourceFrame.RevealPosition,
-      omitFocus?: boolean): void {
+  async showUISourceCode(uiSourceCode: Workspace.UISourceCode.UISourceCode,
+                         location?: SourceFrame.SourceFrame.RevealPosition, omitFocus?: boolean): Promise<void> {
     if (omitFocus) {
       if (!this.isShowing() && !UI.Context.Context.instance().flavor(QuickSourceView)) {
         return;
@@ -607,7 +609,7 @@ export class SourcesPanel extends UI.Panel.Panel implements
     } else {
       this.showEditor();
     }
-    this.#sourcesView.showSourceLocation(uiSourceCode, location, omitFocus);
+    await this.#sourcesView.showSourceLocation(uiSourceCode, location, omitFocus);
   }
 
   private showEditor(): void {
@@ -617,9 +619,9 @@ export class SourcesPanel extends UI.Panel.Panel implements
     void this.setAsCurrentPanel();
   }
 
-  showUILocation(uiLocation: Workspace.UISourceCode.UILocation, omitFocus?: boolean): void {
+  async showUILocation(uiLocation: Workspace.UISourceCode.UILocation, omitFocus?: boolean): Promise<void> {
     const {uiSourceCode, lineNumber, columnNumber} = uiLocation;
-    this.showUISourceCode(uiSourceCode, {lineNumber, columnNumber}, omitFocus);
+    await this.showUISourceCode(uiSourceCode, {lineNumber, columnNumber}, omitFocus);
   }
 
   async revealInNavigator(uiSourceCode: Workspace.UISourceCode.UISourceCode, skipReveal?: boolean): Promise<void> {
@@ -670,7 +672,7 @@ export class SourcesPanel extends UI.Panel.Panel implements
     if (window.performance.now() - this.lastModificationTime < lastModificationTimeout) {
       return;
     }
-    this.#sourcesView.showSourceLocation(uiLocation.uiSourceCode, uiLocation, undefined, true);
+    await this.#sourcesView.showSourceLocation(uiLocation.uiSourceCode, uiLocation, undefined, true);
   }
 
   private async updateDebuggerButtonsAndStatus(): Promise<void> {
@@ -1140,7 +1142,7 @@ export class SourcesPanel extends UI.Panel.Panel implements
         await Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance().rawLocationToUILocation(
             response.location);
     if (uiLocation) {
-      this.showUILocation(uiLocation);
+      await this.showUILocation(uiLocation);
     }
   }
 
@@ -1292,7 +1294,7 @@ export const minToolbarWidth = 215;
 
 export class UILocationRevealer implements Common.Revealer.Revealer<Workspace.UISourceCode.UILocation> {
   async reveal(uiLocation: Workspace.UISourceCode.UILocation, omitFocus?: boolean): Promise<void> {
-    SourcesPanel.instance().showUILocation(uiLocation, omitFocus);
+    await SourcesPanel.instance().showUILocation(uiLocation, omitFocus);
   }
 }
 
@@ -1307,7 +1309,7 @@ export class UILocationRangeRevealer implements Common.Revealer.Revealer<Workspa
 
   async reveal(uiLocationRange: Workspace.UISourceCode.UILocationRange, omitFocus?: boolean): Promise<void> {
     const {uiSourceCode, range: {start: from, end: to}} = uiLocationRange;
-    SourcesPanel.instance().showUISourceCode(uiSourceCode, {from, to}, omitFocus);
+    await SourcesPanel.instance().showUISourceCode(uiSourceCode, {from, to}, omitFocus);
   }
 }
 
@@ -1317,14 +1319,14 @@ export class DebuggerLocationRevealer implements Common.Revealer.Revealer<SDK.De
         await Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance().rawLocationToUILocation(
             rawLocation);
     if (uiLocation) {
-      SourcesPanel.instance().showUILocation(uiLocation, omitFocus);
+      await SourcesPanel.instance().showUILocation(uiLocation, omitFocus);
     }
   }
 }
 
 export class UISourceCodeRevealer implements Common.Revealer.Revealer<Workspace.UISourceCode.UISourceCode> {
   async reveal(uiSourceCode: Workspace.UISourceCode.UISourceCode, omitFocus?: boolean): Promise<void> {
-    SourcesPanel.instance().showUISourceCode(uiSourceCode, undefined, omitFocus);
+    await SourcesPanel.instance().showUISourceCode(uiSourceCode, undefined, omitFocus);
   }
 }