Migrate inline-variable_test.ts to e2e_non_hosted

Fixed: 416404755
Change-Id: Id330128f9881305d93575e2500db790fe9da744e
Bug: 416404755
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6712995
Auto-Submit: Simon Zünd <[email protected]>
Reviewed-by: Alex Rudenko <[email protected]>
Commit-Queue: Alex Rudenko <[email protected]>

Author: szuend

test/e2e/sources/BUILD.gn

@@ -16,7 +16,6 @@ node_ts_library("sources") {
     "header-overrides_test.ts",
     "icon-row-bucket_test.ts",
     "ignore-list_test.ts",
-    "inline-variable_test.ts",
     "live-edit-moving-breakpoint_test.ts",
     "navigator-view_test.ts",
     "overrides_test.ts",

test/e2e/sources/inline-variable_test.ts

@@ -17,6 +17,7 @@ ts_e2e_library("sources") {
     "icon-row-bucket_test.ts",
     "inline-breakpoint_test.ts",
     "inline-scripts_test.ts",
+    "inline-variable_test.ts",
     "link-to-correct-source-line_test.ts",
     "pause-button_test.ts",
     "popover_test.ts",

test/e2e_non_hosted/sources/BUILD.gn

@@ -0,0 +1,36 @@
+// Copyright 2022 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import {assert} from 'chai';
+
+import {
+  addBreakpointForLine,
+  openSourceCodeEditorForFile,
+  RESUME_BUTTON,
+} from '../../e2e/helpers/sources-helpers.js';
+import type {DevToolsPage} from '../../e2e_non_hosted/shared/frontend-helper.js';
+
+async function retrieveCodeMirrorEditorContent(devToolsPage: DevToolsPage): Promise<string[]> {
+  const editor = await devToolsPage.waitFor('[aria-label="Code editor"]');
+  return await editor.evaluate(
+      (node: Element) => [...node.querySelectorAll('.cm-line')].map(node => node.textContent || '') || []);
+}
+
+describe('Sources Tab', function() {
+  it('shows correct inline variable at definition', async ({devToolsPage, inspectedPage}) => {
+    await openSourceCodeEditorForFile('inline-variable.js', 'inline-variable.html', devToolsPage, inspectedPage);
+    await addBreakpointForLine(3, devToolsPage);
+
+    const scriptEvaluation = inspectedPage.evaluate('simple(41);');
+
+    await devToolsPage.waitFor('.cm-line > .cm-variableValues');
+
+    const contents = await retrieveCodeMirrorEditorContent(devToolsPage);
+    assert.strictEqual(contents[0], 'function simple(a) {a = 41');
+    assert.strictEqual(contents[1], '  let x = a + 1;x = 42');
+
+    await devToolsPage.click(RESUME_BUTTON);
+    await scriptEvaluation;
+  });
+});