[e2e] Adapt e2e tests that rely on the breakpoint sidebar pane

This adapts e2e tests that make use of the breakpoint sidebar to be compatible with both the old and the new one. This is a
preparatory step to enable the new sidebar per default.

Bug: 1407586, 1408030
Change-Id: I4dfa6de6367cebda6d5ce94f5ed1986cd9d84272
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/4171281
Auto-Submit: Kim-Anh Tran <kimanh@chromium.org>
Reviewed-by: Jaroslav Sevcik <jarin@chromium.org>
Commit-Queue: Jaroslav Sevcik <jarin@chromium.org>

diff --git a/test/e2e/extensions/debugger-language-plugins_test.ts b/test/e2e/extensions/debugger-language-plugins_test.ts
index 64ed17a..6eeee00 100644
--- a/test/e2e/extensions/debugger-language-plugins_test.ts
+++ b/test/e2e/extensions/debugger-language-plugins_test.ts

@@ -40,12 +40,12 @@
   openFileInEditor,
   openSourceCodeEditorForFile,
   openSourcesPanel,
-  PAUSE_ON_EXCEPTION_BUTTON,
   RESUME_BUTTON,
   switchToCallFrame,
   WasmLocationLabels,
   type LabelMapping,
   captureAddedSourceFiles,
+  PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR,
 } from '../helpers/sources-helpers.js';
 import {expectError} from '../../conductor/events.js';
 
@@ -130,7 +130,8 @@
     }, locationLabels.getMappingsForPlugin());
 
     await openSourcesPanel();
-    await click(PAUSE_ON_EXCEPTION_BUTTON);
+    await click(PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR);
+
     await goToResource('extensions/wasm_module.html?module=unreachable.wasm&autorun=Main');
     await waitFor('.paused-status');
 
@@ -280,7 +281,7 @@
     });
 
     await openSourcesPanel();
-    await click(PAUSE_ON_EXCEPTION_BUTTON);
+    await click(PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR);
     await goToResource('sources/wasm/unreachable.html');
     await waitFor(RESUME_BUTTON);
 
@@ -355,7 +356,7 @@
     });
 
     await openSourcesPanel();
-    await click(PAUSE_ON_EXCEPTION_BUTTON);
+    await click(PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR);
     await goToResource('sources/wasm/unreachable.html');
     await waitFor(RESUME_BUTTON);
 
@@ -448,7 +449,7 @@
     });
 
     await openSourcesPanel();
-    await click(PAUSE_ON_EXCEPTION_BUTTON);
+    await click(PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR);
     await goToResource('sources/wasm/unreachable.html');
     await waitFor(RESUME_BUTTON);
 
@@ -481,7 +482,7 @@
     });
 
     await openSourcesPanel();
-    await click(PAUSE_ON_EXCEPTION_BUTTON);
+    await click(PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR);
     await goToResource('sources/wasm/unreachable.html');
     await waitFor(RESUME_BUTTON);
 
@@ -551,7 +552,7 @@
     });
 
     await openSourcesPanel();
-    await click(PAUSE_ON_EXCEPTION_BUTTON);
+    await click(PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR);
     await goToResource('sources/wasm/unreachable.html');
     await waitFor(RESUME_BUTTON);
 
@@ -720,7 +721,7 @@
     });
 
     await openSourcesPanel();
-    await click(PAUSE_ON_EXCEPTION_BUTTON);
+    await click(PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR);
     await goToResource('sources/wasm/unreachable.html');
     await waitFor(RESUME_BUTTON);
 
@@ -897,7 +898,7 @@
     });
 
     await openSourcesPanel();
-    await click(PAUSE_ON_EXCEPTION_BUTTON);
+    await click(PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR);
     await goToResource('sources/wasm/unreachable.html');
     await waitFor(RESUME_BUTTON);
 
@@ -992,7 +993,7 @@
     });
 
     await openSourcesPanel();
-    await click(PAUSE_ON_EXCEPTION_BUTTON);
+    await click(PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR);
     await openSourceCodeEditorForFile('unreachable.ll', 'wasm/unreachable.html');
     await waitFor(RESUME_BUTTON);
 
@@ -1091,7 +1092,7 @@
     });
 
     await openSourcesPanel();
-    await click(PAUSE_ON_EXCEPTION_BUTTON);
+    await click(PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR);
     await goToResource('sources/wasm/unreachable.html');
     await waitFor(RESUME_BUTTON);
     const locals = await getValuesForScope('LOCAL', 0, 1);

diff --git a/test/e2e/helpers/sources-helpers.ts b/test/e2e/helpers/sources-helpers.ts
index 1e6121f..429de94 100644
--- a/test/e2e/helpers/sources-helpers.ts
+++ b/test/e2e/helpers/sources-helpers.ts

@@ -18,6 +18,7 @@
   getPendingEvents,
   getTestServerPort,
   goToResource,
+  isEnabledExperiment,
   pasteText,
   platform,
   pressKey,
@@ -31,7 +32,6 @@
 } from '../../shared/helper.js';
 
 export const ACTIVE_LINE = '.CodeMirror-activeline > pre > span';
-export const PAUSE_ON_EXCEPTION_BUTTON = '[aria-label="Pause on exceptions"]';
 export const PAUSE_BUTTON = '[aria-label="Pause script execution"]';
 export const RESUME_BUTTON = '[aria-label="Resume script execution"]';
 export const SOURCES_LINES_SELECTOR = '.CodeMirror-code > div';
@@ -50,6 +50,11 @@
 const OVERRIDES_TAB_SELECTOR = '[aria-label="Overrides"]';
 export const ENABLE_OVERRIDES_SELECTOR = '[aria-label="Select folder for overrides"]';
 const CLEAR_CONFIGURATION_SELECTOR = '[aria-label="Clear configuration"]';
+const BREAKPOINT_VIEW_PAUSE_ON_UNCAUGHT_SELECTOR = '.pause-on-uncaught-exceptions';
+const PAUSE_ON_EXCEPTION_BUTTON = '[aria-label="Pause on exceptions"]';
+export const PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR =
+    `${PAUSE_ON_EXCEPTION_BUTTON},${BREAKPOINT_VIEW_PAUSE_ON_UNCAUGHT_SELECTOR}`;
+export const BREAKPOINT_ITEM_SELECTOR = '.breakpoint-item,.breakpoint-entry';
 
 export async function toggleNavigatorSidebar(frontend: puppeteer.Page) {
   const modifierKey = platform === 'mac' ? 'Meta' : 'Control';
@@ -177,6 +182,23 @@
   return sourceTabs.evaluate(node => node.getAttribute('aria-label')) as Promise<string>;
 }
 
+export async function getBreakpointHitLocation() {
+  if (await isEnabledExperiment('breakpointView')) {
+    const breakpointHitHandle = await waitFor('.breakpoint-item.hit');
+    const locationHandle = await waitFor('.location', breakpointHitHandle);
+    const locationText = await locationHandle.evaluate(location => location.textContent);
+
+    const groupHandle = await breakpointHitHandle.evaluateHandle(x => x.parentElement);
+    const groupHeaderTitleHandle = await waitFor('.group-header-title', groupHandle);
+    const groupHeaderTitle = await groupHeaderTitleHandle?.evaluate(header => header.textContent);
+
+    return `${groupHeaderTitle}:${locationText}`;
+  }
+  const breakpointHandle = await $('label', await waitFor('.breakpoint-hit'));
+  const breakpointLocation = await breakpointHandle?.evaluate(label => label.textContent);
+  return breakpointLocation;
+}
+
 export async function getOpenSources() {
   const sourceTabPane = await waitFor('#sources-panel-sources-view .tabbed-pane');
   const sourceTabs = await waitFor('.tabbed-pane-header-tabs', sourceTabPane);

diff --git a/test/e2e/sources/breakpoint-csp-violations_test.ts b/test/e2e/sources/breakpoint-csp-violations_test.ts
index 7da4c57..45e18a6 100644
--- a/test/e2e/sources/breakpoint-csp-violations_test.ts
+++ b/test/e2e/sources/breakpoint-csp-violations_test.ts

@@ -6,14 +6,14 @@
 
 import {click, goToResource} from '../../shared/helper.js';
 import {describe, it} from '../../shared/mocha-extensions.js';
-import {getPausedMessages, openSourcesPanel, PAUSE_ON_EXCEPTION_BUTTON} from '../helpers/sources-helpers.js';
+import {getPausedMessages, openSourcesPanel, PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR} from '../helpers/sources-helpers.js';
 
 describe('Breakpoints on CSP Violation', async () => {
   it('CSP Violations should come up before break on exceptions', async () => {
     await openSourcesPanel();
     await click('[aria-label="CSP Violation Breakpoints"]');
     await click('[aria-label="Trusted Type Violations"]');
-    await click(PAUSE_ON_EXCEPTION_BUTTON);
+    await click(PAUSE_ON_UNCAUGHT_EXCEPTION_SELECTOR);
 
     const resource = goToResource('network/trusted-type-violations-enforced.rawresponse');
 

diff --git a/test/e2e/sources/breakpoint-javascript_test.ts b/test/e2e/sources/breakpoint-javascript_test.ts
index dd2a656..ebe0042 100644
--- a/test/e2e/sources/breakpoint-javascript_test.ts
+++ b/test/e2e/sources/breakpoint-javascript_test.ts

@@ -5,7 +5,6 @@
 import {assert} from 'chai';
 
 import {
-  $,
   click,
   enableExperiment,
   getBrowserAndPages,
@@ -18,6 +17,7 @@
 import {getMenuItemAtPosition, getMenuItemTitleAtPosition, openFileQuickOpen} from '../helpers/quick_open-helpers.js';
 import {
   addBreakpointForLine,
+  getBreakpointHitLocation,
   isEqualOrAbbreviation,
   openSourceCodeEditorForFile,
   PAUSE_INDICATOR_SELECTOR,
@@ -59,8 +59,7 @@
     const scriptLocation = await retrieveTopCallFrameWithoutResuming();
     assert.deepEqual(scriptLocation, 'click-breakpoint.js:4');
 
-    const breakpointHandle = await $('label', await waitFor('.breakpoint-hit'));
-    const breakpointLocation = await breakpointHandle?.evaluate(label => label.textContent);
+    const breakpointLocation = await getBreakpointHitLocation();
     assert.deepEqual(breakpointLocation, scriptLocation);
 
     await click(RESUME_BUTTON);

diff --git a/test/e2e/sources/script-in-multiple-workers_test.ts b/test/e2e/sources/script-in-multiple-workers_test.ts
index b57a1a0..224ab48 100644
--- a/test/e2e/sources/script-in-multiple-workers_test.ts
+++ b/test/e2e/sources/script-in-multiple-workers_test.ts

@@ -17,6 +17,7 @@
 import {describe, it} from '../../shared/mocha-extensions.js';
 import {
   addBreakpointForLine,
+  BREAKPOINT_ITEM_SELECTOR,
   createSelectorsForWorkerFile,
   getBreakpointDecorators,
   getOpenSources,
@@ -121,8 +122,8 @@
       // Set a breakpoint
       await addBreakpointForLine(frontend, 6);
 
-      await waitFor('.breakpoint-entry');
-      const breakpoints = (await $$('.breakpoint-entry')).length;
+      await waitFor(BREAKPOINT_ITEM_SELECTOR);
+      const breakpoints = (await $$(BREAKPOINT_ITEM_SELECTOR)).length;
       assert.strictEqual(breakpoints, 1);
     });
 
@@ -148,7 +149,7 @@
         });
 
         await step('Disable first breakpoint', async () => {
-          const bpEntry = await waitFor('.breakpoint-entry');
+          const bpEntry = await waitFor(BREAKPOINT_ITEM_SELECTOR);
           const bpCheckbox = await waitFor('input', bpEntry);
           await bpCheckbox.evaluate(n => (n as HTMLElement).click());
           await waitFor('.cm-breakpoint-disabled');

diff --git a/test/shared/helper.ts b/test/shared/helper.ts
index 1c462e7..b894591 100644
--- a/test/shared/helper.ts
+++ b/test/shared/helper.ts

@@ -379,6 +379,13 @@
   await reloadDevTools(options);
 }
 
+export const isEnabledExperiment = async (experiment: string) => {
+  const {frontend} = getBrowserAndPages();
+  return await frontend.evaluate((experiment): Promise<boolean> => {
+    return globalThis.Root.Runtime.experiments.isEnabled(experiment);
+  }, experiment);
+};
+
 export const enableExperiment = (experiment: string, options?: DevToolsFrontendReloadOptions) =>
     setExperimentEnabled(experiment, true, options);