Upgrade e2e tests to cmdBar fixtures with fixes

e2e/playwright/command-bar-tests.spec.ts

@@ -307,7 +307,7 @@ test.describe('Command bar tests', () => {
     )
 
     const continueButton = page.getByRole('button', { name: 'Continue' })
-    const submitButton = page.getByRole('button', { name: 'Submit command' })
+    const submitButton = page.getByTestId('command-bar-submit')
     await continueButton.click()
 
     // Review step and argument hotkeys

e2e/playwright/fixtures/cmdBarFixture.ts

@@ -118,15 +118,11 @@ export class CmdBarFixture {
       return
     }
 
-    const arrowButton = this.page.getByRole('button', {
+    const arrowButton = this.page.getByTestId('command-bar-continue')
-      name: 'arrow right Continue',
-    })
     if (await arrowButton.isVisible()) {
-      await arrowButton.click()
+      await this.continue()
     } else {
-      await this.page
+      await this.submit()
-        .getByRole('button', { name: 'checkmark Submit command' })
-        .click()
     }
   }
 

e2e/playwright/projects.spec.ts

@@ -475,6 +475,7 @@ test.describe('Can export from electron app', () => {
               },
               tronApp.projectDirName,
               page,
+              cmdBar,
               method
             )
           )
@@ -779,9 +780,6 @@ test.describe(`Project management commands`, () => {
       const commandContinueButton = page.getByRole('button', {
         name: 'Continue',
       })
-      const commandSubmitButton = page.getByRole('button', {
-        name: 'Submit command',
-      })
       const toastMessage = page.getByText(`Successfully renamed`)
 
       await test.step(`Setup`, async () => {
@@ -800,8 +798,7 @@ test.describe(`Project management commands`, () => {
         await expect(commandContinueButton).toBeVisible()
         await commandContinueButton.click()
 
-        await expect(commandSubmitButton).toBeVisible()
+        await cmdBar.submit()
-        await commandSubmitButton.click()
 
         await expect(toastMessage).toBeVisible()
       })
@@ -837,9 +834,6 @@ test.describe(`Project management commands`, () => {
       })
       const projectNameOption = page.getByRole('option', { name: projectName })
       const commandWarning = page.getByText('Are you sure you want to delete?')
-      const commandSubmitButton = page.getByRole('button', {
-        name: 'Submit command',
-      })
       const toastMessage = page.getByText(`Successfully deleted`)
       const noProjectsMessage = page.getByText('No projects found')
 
@@ -859,8 +853,7 @@ test.describe(`Project management commands`, () => {
         await projectNameOption.click()
 
         await expect(commandWarning).toBeVisible()
-        await expect(commandSubmitButton).toBeVisible()
+        await cmdBar.submit()
-        await commandSubmitButton.click()
 
         await expect(toastMessage).toBeVisible()
       })
@@ -894,9 +887,6 @@ test.describe(`Project management commands`, () => {
       const commandContinueButton = page.getByRole('button', {
         name: 'Continue',
       })
-      const commandSubmitButton = page.getByRole('button', {
-        name: 'Submit command',
-      })
       const toastMessage = page.getByText(`Successfully renamed`)
 
       await test.step(`Setup`, async () => {
@@ -914,8 +904,7 @@ test.describe(`Project management commands`, () => {
         await expect(commandContinueButton).toBeVisible()
         await commandContinueButton.click()
 
-        await expect(commandSubmitButton).toBeVisible()
+        await cmdBar.submit()
-        await commandSubmitButton.click()
 
         await expect(toastMessage).toBeVisible()
       })
@@ -949,9 +938,6 @@ test.describe(`Project management commands`, () => {
       })
       const projectNameOption = page.getByRole('option', { name: projectName })
       const commandWarning = page.getByText('Are you sure you want to delete?')
-      const commandSubmitButton = page.getByRole('button', {
-        name: 'Submit command',
-      })
       const toastMessage = page.getByText(`Successfully deleted`)
       const noProjectsMessage = page.getByText('No projects found')
 
@@ -967,8 +953,7 @@ test.describe(`Project management commands`, () => {
         await projectNameOption.click()
 
         await expect(commandWarning).toBeVisible()
-        await expect(commandSubmitButton).toBeVisible()
+        await cmdBar.submit()
-        await commandSubmitButton.click()
 
         await expect(toastMessage).toBeVisible()
       })

e2e/playwright/test-utils.ts

@@ -22,6 +22,7 @@ export const token = process.env.token || ''
 import type { ProjectConfiguration } from '@rust/kcl-lib/bindings/ProjectConfiguration'
 
 import type { ElectronZoo } from '@e2e/playwright/fixtures/fixtureSetup'
+import type { CmdBarFixture } from '@e2e/playwright/fixtures/cmdBarFixture'
 import { isErrorWhitelisted } from '@e2e/playwright/lib/console-error-whitelist'
 import { TEST_SETTINGS, TEST_SETTINGS_KEY } from '@e2e/playwright/storageStates'
 import { test } from '@e2e/playwright/zoo-test'
@@ -737,6 +738,7 @@ export const doExport = async (
   output: Models['OutputFormat3d_type'],
   rootDir: string,
   page: Page,
+  cmdBar: CmdBarFixture,
   exportFrom: 'dropdown' | 'sidebarButton' | 'commandBar' = 'dropdown'
 ): Promise<Paths> => {
   if (exportFrom === 'dropdown') {
@@ -782,7 +784,7 @@ export const doExport = async (
   }
   await expect(page.getByText('Confirm Export')).toBeVisible()
 
-  await page.getByRole('button', { name: 'Submit command' }).click()
+  await cmdBar.submit()
 
   await expect(page.getByText('Exported successfully')).toBeVisible()
 

e2e/playwright/testing-constraints.spec.ts

@@ -10,7 +10,7 @@ import {
 import { expect, test } from '@e2e/playwright/zoo-test'
 
 test.describe('Testing constraints', () => {
-  test('Can constrain line length', async ({ page, homePage }) => {
+  test('Can constrain line length', async ({ page, homePage, cmdBar }) => {
     await page.addInitScript(async () => {
       localStorage.setItem(
         'persistCode',
@@ -50,11 +50,7 @@ test.describe('Testing constraints', () => {
     await page.waitForTimeout(100)
     await page.getByTestId('constraint-length').click()
     await page.getByTestId('cmd-bar-arg-value').getByRole('textbox').fill('20')
-    await page
+    await cmdBar.continue()
-      .getByRole('button', {
-        name: 'arrow right Continue',
-      })
-      .click()
 
     await expect(page.locator('.cm-content')).toHaveText(
       `length001 = 20sketch001 = startSketchOn(XY)  |> startProfile(at = [-10, -10])  |> line(end = [20, 0])  |> angledLine(angle = 90, length = length001)  |> xLine(length = -20)`
@@ -681,9 +677,6 @@ test.describe('Testing constraints', () => {
           .getByRole('textbox')
         const cmdBarKclVariableNameInput =
           page.getByPlaceholder('Variable name')
-        const cmdBarSubmitButton = page.getByRole('button', {
-          name: 'arrow right Continue',
-        })
 
         await page.addInitScript(async () => {
           localStorage.setItem(
@@ -736,7 +729,7 @@ part002 = startSketchOn(XZ)
         await page.waitForTimeout(500)
         const [ang, len] = value.split(', ')
         const changedCode = `|> angledLine(angle = ${ang}, length = ${len})`
-        await cmdBarSubmitButton.click()
+        await cmdBar.continue()
         await expect(page.locator('.cm-content')).toContainText(changedCode)
 
         // checking active assures the cursor is where it should be
@@ -1101,11 +1094,7 @@ part002 = startSketchOn(XZ)
     await page.waitForTimeout(500)
 
     await page.getByTestId('cmd-bar-arg-value').getByRole('textbox').fill('10')
-    await page
+    await cmdBar.continue()
-      .getByRole('button', {
-        name: 'arrow right Continue',
-      })
-      .click()
 
     await pollEditorLinesSelectedLength(page, 1)
     activeLinesContent = await page.locator('.cm-activeLine').all()

e2e/playwright/testing-samples-loading.spec.ts

@@ -21,7 +21,7 @@ test.describe('Testing loading external models', () => {
   // We have no more web tests
   test.fail(
     'Web: should overwrite current code, cannot create new file',
-    async ({ editor, context, page, homePage }) => {
+    async ({ editor, context, page, homePage, cmdBar }) => {
       const u = await getUtils(page)
       await test.step(`Test setup`, async () => {
         await context.addInitScript((code) => {
@@ -52,9 +52,6 @@ test.describe('Testing loading external models', () => {
           name,
         })
       const warningText = page.getByText('Overwrite current file with sample?')
-      const confirmButton = page.getByRole('button', {
-        name: 'Submit command',
-      })
 
       await test.step(`Precondition: check the initial code`, async () => {
         await u.openKclCodePanel()
@@ -70,7 +67,7 @@ test.describe('Testing loading external models', () => {
         await expect(commandMethodOption('Create new file')).not.toBeVisible()
         await commandMethodOption('Overwrite').click()
         await expect(warningText).toBeVisible()
-        await confirmButton.click()
+        await cmdBar.submit()
 
         await editor.expectEditor.toContain('// ' + newSample.title)
       })

e2e/playwright/testing-segment-overlays.spec.ts

@@ -3,6 +3,7 @@ import type { LineInputsType } from '@src/lang/std/sketchcombos'
 import { uuidv4 } from '@src/lib/utils'
 
 import type { EditorFixture } from '@e2e/playwright/fixtures/editorFixture'
+import type { CmdBarFixture } from '@e2e/playwright/fixtures/cmdBarFixture'
 import { deg, getUtils, wiggleMove } from '@e2e/playwright/test-utils'
 import { expect, test } from '@e2e/playwright/zoo-test'
 
@@ -18,7 +19,7 @@ test.describe('Testing segment overlays', () => {
      * @param {number} options.steps - The number of steps to perform
      */
     const _clickConstrained =
-      (page: Page, editor: EditorFixture) =>
+      (page: Page, editor: EditorFixture, cmdBar: CmdBarFixture) =>
       async ({
         hoverPos,
         constraintType,
@@ -93,11 +94,7 @@ test.describe('Testing segment overlays', () => {
           page.getByTestId('cmd-bar-arg-value').getByRole('textbox')
         ).toBeFocused()
         await page.waitForTimeout(500)
-        await page
+        await cmdBar.continue()
-          .getByRole('button', {
-            name: 'arrow right Continue',
-          })
-          .click()
         await editor.expectEditor.toContain(expectFinal, {
           shouldNormalise: true,
         })
@@ -113,7 +110,7 @@ test.describe('Testing segment overlays', () => {
      * @param {number} options.steps - The number of steps to perform
      */
     const _clickUnconstrained =
-      (page: Page, editor: EditorFixture) =>
+      (page: Page, editor: EditorFixture, cmdBar: CmdBarFixture) =>
       async ({
         hoverPos,
         constraintType,
@@ -163,11 +160,7 @@ test.describe('Testing segment overlays', () => {
           page.getByTestId('cmd-bar-arg-value').getByRole('textbox')
         ).toBeFocused()
         await page.waitForTimeout(500)
-        await page
+        await cmdBar.continue()
-          .getByRole('button', {
-            name: 'arrow right Continue',
-          })
-          .click()
         await editor.expectEditor.toContain(expectAfterUnconstrained, {
           shouldNormalise: true,
         })
@@ -239,8 +232,8 @@ test.describe('Testing segment overlays', () => {
 
       await expect(page.getByTestId('segment-overlay')).toHaveCount(14)
 
-      const clickUnconstrained = _clickUnconstrained(page, editor)
+      const clickUnconstrained = _clickUnconstrained(page, editor, cmdBar)
-      const clickConstrained = _clickConstrained(page, editor)
+      const clickConstrained = _clickConstrained(page, editor, cmdBar)
 
       await u.openAndClearDebugPanel()
       await u.sendCustomCmd({
@@ -664,7 +657,7 @@ profile002 = circle(sketch001, center = [345, 0], radius = 238.38)
       await expect(
         page.getByTestId('cmd-bar-arg-value').getByRole('textbox')
       ).toBeFocused()
-      await page.getByRole('button', { name: 'arrow right Continue' }).click()
+      await cmdBar.continue()
 
       // Verify the X constraint was added
       await editor.expectEditor.toContain('center = [xAbs001, 0]', {
@@ -682,7 +675,7 @@ profile002 = circle(sketch001, center = [345, 0], radius = 238.38)
       await expect(
         page.getByTestId('cmd-bar-arg-value').getByRole('textbox')
       ).toBeFocused()
-      await page.getByRole('button', { name: 'arrow right Continue' }).click()
+      await cmdBar.continue()
 
       // Verify the Y constraint was added
       await editor.expectEditor.toContain('center = [xAbs001, yAbs001]', {
@@ -700,7 +693,7 @@ profile002 = circle(sketch001, center = [345, 0], radius = 238.38)
       await expect(
         page.getByTestId('cmd-bar-arg-value').getByRole('textbox')
       ).toBeFocused()
-      await page.getByRole('button', { name: 'arrow right Continue' }).click()
+      await cmdBar.continue()
 
       // Verify all constraints were added
       await editor.expectEditor.toContain(
@@ -887,7 +880,7 @@ profile003 = startProfile(sketch001, at = [64.39, 35.16])
     await expect(
       page.getByTestId('cmd-bar-arg-value').getByRole('textbox')
     ).toBeFocused()
-    await page.getByRole('button', { name: 'arrow right Continue' }).click()
+    await cmdBar.continue()
 
     // Verify the constraint was added
     await editor.expectEditor.toContain(
@@ -910,7 +903,7 @@ profile003 = startProfile(sketch001, at = [64.39, 35.16])
     await expect(
       page.getByTestId('cmd-bar-arg-value').getByRole('textbox')
     ).toBeFocused()
-    await page.getByRole('button', { name: 'arrow right Continue' }).click()
+    await cmdBar.continue()
 
     // Verify both constraints were added
     await editor.expectEditor.toContain(
@@ -935,7 +928,7 @@ profile003 = startProfile(sketch001, at = [64.39, 35.16])
     await expect(
       page.getByTestId('cmd-bar-arg-value').getByRole('textbox')
     ).toBeFocused()
-    await page.getByRole('button', { name: 'arrow right Continue' }).click()
+    await cmdBar.continue()
 
     // Verify the constraint was added
     await editor.expectEditor.toContain('endAbsolute = [xAbs002, 84.07]', {
@@ -955,7 +948,7 @@ profile003 = startProfile(sketch001, at = [64.39, 35.16])
     await expect(
       page.getByTestId('cmd-bar-arg-value').getByRole('textbox')
     ).toBeFocused()
-    await page.getByRole('button', { name: 'arrow right Continue' }).click()
+    await cmdBar.continue()
 
     // Verify all constraints were added
     await editor.expectEditor.toContain(

e2e/playwright/various.spec.ts

@@ -32,7 +32,7 @@ test('Units menu', async ({ page, homePage }) => {
 test(
   'Successful export shows a success toast',
   { tag: '@skipLocalEngine' },
-  async ({ page, homePage, tronApp }) => {
+  async ({ page, homePage, cmdBar, tronApp }) => {
     // FYI this test doesn't work with only engine running locally
     // And you will need to have the KittyCAD CLI installed
     const u = await getUtils(page)
@@ -94,7 +94,8 @@ part001 = startSketchOn(-XZ)
         presentation: 'pretty',
       },
       tronApp?.projectDirName,
-      page
+      page,
+      cmdBar
     )
   }
 )
@@ -254,6 +255,7 @@ test('First escape in tool pops you out of tool, second exits sketch mode', asyn
 test('Basic default modeling and sketch hotkeys work', async ({
   page,
   homePage,
+  cmdBar,
 }) => {
   const u = await getUtils(page)
   await test.step(`Set up test`, async () => {
@@ -397,11 +399,8 @@ test('Basic default modeling and sketch hotkeys work', async ({
     await expect(page.getByRole('button', { name: 'Continue' })).toBeVisible({
       timeout: 20_000,
     })
-    await page.getByRole('button', { name: 'Continue' }).click()
+    await cmdBar.continue()
-    await expect(
+    await cmdBar.submit()
-      page.getByRole('button', { name: 'Submit command' })
-    ).toBeVisible()
-    await page.getByRole('button', { name: 'Submit command' }).click()
     await expect(page.locator('.cm-content')).toContainText('extrude(')
   })