Fix: stable E2E tests on ubuntu localhost (#5269)

* fix: Needed to increase timeout for this test. waitForExecutionDone does not work since there are errors in the KCL code

* fix: again another wait for execution does not work

* fix: bug that desyncs codeManager, executeCode, lspPlugin

* fix: fixing react race condition on parsing numeric literals in command bar on open

* fix: adding comment to clarify the gotcha

* fix: saving off debugging...

* fix: added wait for execution done

* fix: removing testing code

* fix: adding wait for execution done

* fix: adding execution done wait

* fix: only fixes the chamfer point and click delete

* fix: add 1250ms before every progresscmdbar, removed model loaded scene state that is flaky, added toast if someone presses the command bar too quickly

* fix: adding a wait for execution

* fix: updating wait for execution

* fix: wait for execution done

* fix: wait for execution done

* fix: not waiting for scene, not waiting for command bar

* fix: restoring name

* fix: auto fixes

* A snapshot a day keeps the bugs away! 📷🐛 (OS: namespace-profile-ubuntu-8-cores)

* A snapshot a day keeps the bugs away! 📷🐛 (OS: namespace-profile-ubuntu-8-cores)

* A snapshot a day keeps the bugs away! 📷🐛 (OS: namespace-profile-ubuntu-8-cores)

* A snapshot a day keeps the bugs away! 📷🐛 (OS: namespace-profile-ubuntu-8-cores)

* A snapshot a day keeps the bugs away! 📷🐛 (OS: namespace-profile-ubuntu-8-cores)

* A snapshot a day keeps the bugs away! 📷🐛 (OS: namespace-profile-ubuntu-8-cores)

* fix: bad prompt fix

* fix: Fixed testing selections with wait

* fix: last wait fix

* fix: trying to resolve more flakes when running with more workers

* chore: adding a skipLocalEngine tag

* fix: fixing test when using local engine

* fix: codespell

* fix: big if true

* chore: skipping one more local engine tests that fails

* fix: auto fix:

* fix: restoring this testing code

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

e2e/playwright/can-create-sketches-on-all-planes-and-their-back-sides.spec.ts

@@ -19,6 +19,8 @@ test.describe(
       await page.setBodyDimensions({ width: 1200, height: 500 })
 
       await homePage.goToModelingScene()
+      // FIXME: Cannot use scene.waitForExecutionDone() since there is no KCL code
+      await page.waitForTimeout(10000)
       await u.openDebugPanel()
 
       const coord =

e2e/playwright/code-pane-and-errors.spec.ts

@@ -10,6 +10,7 @@ test.describe('Code pane and errors', { tag: ['@skipWin'] }, () => {
   test('Typing KCL errors induces a badge on the code pane button', async ({
     page,
     homePage,
+    scene,
   }) => {
     const u = await getUtils(page)
 
@@ -30,11 +31,7 @@ test.describe('Code pane and errors', { tag: ['@skipWin'] }, () => {
 
     await page.setBodyDimensions({ width: 1200, height: 500 })
     await homePage.goToModelingScene()
-
+    await scene.waitForExecutionDone()
-    // wait for execution done
-    await u.openDebugPanel()
-    await u.expectCmdLog('[data-message-type="execution-done"]')
-    await u.closeDebugPanel()
 
     // Ensure no badge is present
     const codePaneButtonHolder = page.locator('#code-button-holder')
@@ -175,7 +172,9 @@ test.describe('Code pane and errors', { tag: ['@skipWin'] }, () => {
     await page.setBodyDimensions({ width: 1200, height: 500 })
     await homePage.goToModelingScene()
 
-    await page.waitForTimeout(1000)
+    // FIXME: await scene.waitForExecutionDone() does not work. It still fails.
+    // I needed to increase this timeout to get this to pass.
+    await page.waitForTimeout(10000)
 
     // Ensure badge is present
     const codePaneButtonHolder = page.locator('#code-button-holder')
@@ -187,7 +186,7 @@ test.describe('Code pane and errors', { tag: ['@skipWin'] }, () => {
     // click in the editor to focus it
     await page.locator('.cm-content').click()
 
-    await page.waitForTimeout(500)
+    await page.waitForTimeout(2000)
 
     // go to the start of the editor and enter more text which will trigger
     // a lint error.
@@ -204,8 +203,9 @@ test.describe('Code pane and errors', { tag: ['@skipWin'] }, () => {
     await page.keyboard.press('ArrowUp')
     await page.keyboard.press('Home')
     await page.keyboard.type('foo_bar = 1')
-    await page.waitForTimeout(500)
+    await page.waitForTimeout(2000)
     await page.keyboard.press('Enter')
+    await page.waitForTimeout(2000)
 
     // ensure we have a lint error
     await expect(page.locator('.cm-lint-marker-info').first()).toBeVisible()

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

@@ -174,6 +174,9 @@ test.describe('Command bar tests', { tag: ['@skipWin'] }, () => {
       await page.setBodyDimensions({ width: 1200, height: 500 })
       await homePage.goToModelingScene()
 
+      // FIXME: No KCL code, unable to wait for engine execution
+      await page.waitForTimeout(10000)
+
       await expect(
         page.getByRole('button', { name: 'Start Sketch' })
       ).not.toBeDisabled()

e2e/playwright/desktop-export.spec.ts

@@ -9,8 +9,8 @@ import fsp from 'fs/promises'
 
 test(
   'export works on the first try',
-  { tag: '@electron' },
+  { tag: ['@electron', '@skipLocalEngine'] },
-  async ({ page, context }, testInfo) => {
+  async ({ page, context, scene }, testInfo) => {
     await context.folderSetupFn(async (dir) => {
       const bracketDir = path.join(dir, 'bracket')
       await Promise.all([fsp.mkdir(bracketDir, { recursive: true })])
@@ -118,8 +118,9 @@ test(
       // Close the file pane
       await u.closeFilePanel()
 
-      // wait for it to finish executing (todo: make this more robust)
+      // FIXME: await scene.waitForExecutionDone() does not work. The modeling indicator stays in -receive-reliable and not execution done
-      await page.waitForTimeout(1000)
+      await page.waitForTimeout(10000)
+
       // expect zero errors in guter
       await expect(page.locator('.cm-lint-marker-error')).not.toBeVisible()
 

e2e/playwright/editor-tests.spec.ts

@@ -490,6 +490,11 @@ test.describe('Editor tests', { tag: ['@skipWin'] }, () => {
     await page.keyboard.press('ArrowLeft')
     await page.keyboard.press('ArrowRight')
 
+    // FIXME: lsp errors do not propagate to the frontend until engine is connected and code is executed
+    // This timeout is to wait for engine connection. LSP and code execution errors should be handled differently
+    // LSP can emit errors as fast as it waits and show them in the editor
+    await page.waitForTimeout(10000)
+
     // error in guter
     await expect(page.locator('.cm-lint-marker-info').first()).toBeVisible()
 

e2e/playwright/fixtures/cmdBarFixture.ts

@@ -112,6 +112,9 @@ export class CmdBarFixture {
    * and assumes we are past the `pickCommand` step.
    */
   progressCmdBar = async (shouldFuzzProgressMethod = true) => {
+    // FIXME: Progressing the command bar is a race condition. We have an async useEffect that reports the final state via useCalculateKclExpression. If this does not run quickly enough, it will not "fail" the continue because you can press continue if the state is not ready. E2E tests do not know this.
+    // Wait 1250ms to assume the await executeAst of the KCL input field is finished
+    await this.page.waitForTimeout(1250)
     if (shouldFuzzProgressMethod || Math.random() > 0.5) {
       const arrowButton = this.page.getByRole('button', {
         name: 'arrow right Continue',
@@ -128,6 +131,23 @@ export class CmdBarFixture {
     }
   }
 
+  // Added data-testid to the command bar buttons
+  // command-bar-continue are the buttons to go to the next step
+  // does not include the submit which is the final button press
+  // aka the right arrow button
+  continue = async () => {
+    const continueButton = this.page.getByTestId('command-bar-continue')
+    await continueButton.click()
+  }
+
+  // Added data-testid to the command bar buttons
+  // command-bar-submit is the button for the final step to submit
+  // the command bar flow aka the checkmark button.
+  submit = async () => {
+    const submitButton = this.page.getByTestId('command-bar-submit')
+    await submitButton.click()
+  }
+
   openCmdBar = async (selectCmd?: 'promptToEdit') => {
     // TODO why does this button not work in electron tests?
     // await this.cmdBarOpenBtn.click()

e2e/playwright/point-click.spec.ts

@@ -29,11 +29,13 @@ test.describe('Point-and-click tests', { tag: ['@skipWin'] }, () => {
       localStorage.setItem('persistCode', file)
     }, file)
     await homePage.goToModelingScene()
+    await scene.waitForExecutionDone()
 
     const [clickCircle, moveToCircle] = scene.makeMouseHelpers(582, 217)
 
     await test.step('because there is sweepable geometry, verify extrude is enable when nothing is selected', async () => {
-      await scene.clickNoWhere()
+      // FIXME: Do not click, clicking removes the activeLines in future checks
+      // await scene.clickNoWhere()
       await expect(toolbar.extrudeButton).toBeEnabled()
     })
 
@@ -199,6 +201,7 @@ test.describe('Point-and-click tests', { tag: ['@skipWin'] }, () => {
       }, file)
       await page.setBodyDimensions({ width: 1000, height: 500 })
       await homePage.goToModelingScene()
+      await scene.waitForExecutionDone()
 
       const sketchOnAChamfer = _sketchOnAChamfer(page, editor, toolbar, scene)
 
@@ -422,6 +425,7 @@ test.describe('Point-and-click tests', { tag: ['@skipWin'] }, () => {
       }, file)
       await page.setBodyDimensions({ width: 1000, height: 500 })
       await homePage.goToModelingScene()
+      await scene.waitForExecutionDone()
 
       const sketchOnAChamfer = _sketchOnAChamfer(page, editor, toolbar, scene)
 
@@ -1051,6 +1055,9 @@ openSketch = startSketchOn('XY')
     const expectedOutput = `plane001 = offsetPlane('XZ', 5)`
 
     await homePage.goToModelingScene()
+    // FIXME: Since there is no KCL code loaded. We need to wait for the scene to load before we continue.
+    // The engine may not be connected
+    await page.waitForTimeout(15000)
 
     await test.step(`Look for the blue of the XZ plane`, async () => {
       await scene.expectPixelColor([50, 51, 96], testPoint, 15)
@@ -1276,6 +1283,7 @@ loft001 = loft([sketch001, sketch002])
     }, initialCode)
     await page.setBodyDimensions({ width: 1000, height: 500 })
     await homePage.goToModelingScene()
+    await scene.waitForExecutionDone()
 
     // One dumb hardcoded screen pixel value
     const testPoint = { x: 575, y: 200 }
@@ -1918,16 +1926,7 @@ extrude001 = extrude(sketch001, length = -12)
       }, initialCode)
       await page.setBodyDimensions({ width: 1000, height: 500 })
       await homePage.goToModelingScene()
-
+      await scene.waitForExecutionDone()
-      // verify modeling scene is loaded
-      await scene.expectPixelColor(
-        backgroundColor,
-        secondEdgeLocation,
-        lowTolerance
-      )
-
-      // wait for stream to load
-      await scene.expectPixelColor(bodyColor, bodyLocation, highTolerance)
     })
 
     // Test 1: Command bar flow with preselected edges
@@ -2152,6 +2151,7 @@ chamfer04 = chamfer({  length = 5,  tags = [getOppositeEdge(seg02)]}, extrude001
       }, initialCode)
       await page.setBodyDimensions({ width: 1000, height: 500 })
       await homePage.goToModelingScene()
+      await scene.waitForExecutionDone()
 
       // verify modeling scene is loaded
       await scene.expectPixelColor(
@@ -2274,6 +2274,7 @@ chamfer04 = chamfer({  length = 5,  tags = [getOppositeEdge(seg02)]}, extrude001
       }, initialCode)
       await page.setBodyDimensions({ width: 1000, height: 500 })
       await homePage.goToModelingScene()
+      await scene.waitForExecutionDone()
 
       // One dumb hardcoded screen pixel value
       const testPoint = { x: 575, y: 200 }
@@ -2372,6 +2373,7 @@ extrude001 = extrude(sketch001, length = 40)
     }, initialCode)
     await page.setBodyDimensions({ width: 1000, height: 500 })
     await homePage.goToModelingScene()
+    await scene.waitForExecutionDone()
 
     // One dumb hardcoded screen pixel value
     const testPoint = { x: 580, y: 180 }

e2e/playwright/projects.spec.ts

@@ -455,7 +455,7 @@ test.describe('Can export from electron app', () => {
   for (const method of exportMethods) {
     test(
       `Can export using ${method}`,
-      { tag: '@electron' },
+      { tag: ['@electron', '@skipLocalEngine'] },
       async ({ context, page }, testInfo) => {
         await context.folderSetupFn(async (dir) => {
           const bracketDir = path.join(dir, 'bracket')

e2e/playwright/prompt-to-edit.spec.ts

@@ -60,6 +60,7 @@ test.describe('Prompt-to-edit tests', { tag: '@skipWin' }, () => {
           localStorage.setItem('persistCode', file)
         }, file)
         await homePage.goToModelingScene()
+        await scene.waitForExecutionDone()
 
         const body1CapCoords = { x: 571, y: 351 }
         const greenCheckCoords = { x: 565, y: 345 }
@@ -76,7 +77,9 @@ test.describe('Prompt-to-edit tests', { tag: '@skipWin' }, () => {
           'Submitting to Text-to-CAD API...'
         )
         const successToast = page.getByText('Prompt to edit successful')
-        const acceptBtn = page.getByRole('button', { name: 'checkmark Accept' })
+        const acceptBtn = page.getByRole('button', {
+          name: 'checkmark Accept',
+        })
         const rejectBtn = page.getByRole('button', { name: 'close Reject' })
 
         await test.step('wait for scene to load select body and check selection came through', async () => {
@@ -99,7 +102,9 @@ test.describe('Prompt-to-edit tests', { tag: '@skipWin' }, () => {
           await page.waitForTimeout(100)
           await cmdBar.progressCmdBar()
           await expect(submittingToast).toBeVisible()
-          await expect(submittingToast).not.toBeVisible({ timeout: 2 * 60_000 }) // can take a while
+          await expect(submittingToast).not.toBeVisible({
+            timeout: 2 * 60_000,
+          }) // can take a while
           await expect(successToast).toBeVisible()
         })
 
@@ -150,6 +155,7 @@ test.describe('Prompt-to-edit tests', { tag: '@skipWin' }, () => {
       localStorage.setItem('persistCode', file)
     }, file)
     await homePage.goToModelingScene()
+    await scene.waitForExecutionDone()
 
     const body1CapCoords = { x: 571, y: 351 }
     const [clickBody1Cap] = scene.makeMouseHelpers(

e2e/playwright/regression-tests.spec.ts

@@ -313,106 +313,106 @@ extrude001 = extrude(sketch001, length = 50)
     }
   )
 
-  test('when engine fails export we handle the failure and alert the user', async ({
+  test(
-    scene,
+    'when engine fails export we handle the failure and alert the user',
-    page,
+    { tag: '@skipLocalEngine' },
-    homePage,
+    async ({ scene, page, homePage }) => {
-  }) => {
+      const u = await getUtils(page)
-    const u = await getUtils(page)
+      await page.addInitScript(
-    await page.addInitScript(
+        async ({ code }) => {
-      async ({ code }) => {
+          localStorage.setItem('persistCode', code)
-        localStorage.setItem('persistCode', code)
+          ;(window as any).playwrightSkipFilePicker = true
-        ;(window as any).playwrightSkipFilePicker = true
+        },
-      },
+        { code: TEST_CODE_TRIGGER_ENGINE_EXPORT_ERROR }
-      { code: TEST_CODE_TRIGGER_ENGINE_EXPORT_ERROR }
+      )
-    )
 
-    await page.setBodyDimensions({ width: 1000, height: 500 })
+      await page.setBodyDimensions({ width: 1000, height: 500 })
 
-    await homePage.goToModelingScene()
+      await homePage.goToModelingScene()
-    await u.waitForPageLoad()
+      await u.waitForPageLoad()
 
-    // wait for execution done
+      // wait for execution done
-    await u.openDebugPanel()
+      await u.openDebugPanel()
-    await u.expectCmdLog('[data-message-type="execution-done"]')
+      await u.expectCmdLog('[data-message-type="execution-done"]')
-    await u.closeDebugPanel()
+      await u.closeDebugPanel()
 
-    // expect zero errors in guter
+      // expect zero errors in guter
-    await expect(page.locator('.cm-lint-marker-error')).not.toBeVisible()
+      await expect(page.locator('.cm-lint-marker-error')).not.toBeVisible()
 
-    // export the model
+      // export the model
-    const exportButton = page.getByTestId('export-pane-button')
+      const exportButton = page.getByTestId('export-pane-button')
-    await expect(exportButton).toBeVisible()
+      await expect(exportButton).toBeVisible()
 
-    // Click the export button
+      // Click the export button
-    await exportButton.click()
+      await exportButton.click()
 
-    // Click the stl.
+      // Click the stl.
-    const stlOption = page.getByText('glTF')
+      const stlOption = page.getByText('glTF')
-    await expect(stlOption).toBeVisible()
+      await expect(stlOption).toBeVisible()
 
-    await page.keyboard.press('Enter')
+      await page.keyboard.press('Enter')
 
-    // Click the checkbox
+      // Click the checkbox
-    const submitButton = page.getByText('Confirm Export')
+      const submitButton = page.getByText('Confirm Export')
-    await expect(submitButton).toBeVisible()
+      await expect(submitButton).toBeVisible()
 
-    await page.keyboard.press('Enter')
+      await page.keyboard.press('Enter')
 
-    // Find the toast.
+      // Find the toast.
-    // Look out for the toast message
+      // Look out for the toast message
-    const exportingToastMessage = page.getByText(`Exporting...`)
+      const exportingToastMessage = page.getByText(`Exporting...`)
-    const errorToastMessage = page.getByText(`Error while exporting`)
+      const errorToastMessage = page.getByText(`Error while exporting`)
 
-    const engineErrorToastMessage = page.getByText(`Nothing to export`)
+      const engineErrorToastMessage = page.getByText(`Nothing to export`)
-    await expect(engineErrorToastMessage).toBeVisible()
+      await expect(engineErrorToastMessage).toBeVisible()
 
-    // Make sure the exporting toast is gone
+      // Make sure the exporting toast is gone
-    await expect(exportingToastMessage).not.toBeVisible()
+      await expect(exportingToastMessage).not.toBeVisible()
 
-    // Click the code editor
+      // Click the code editor
-    await page.locator('.cm-content').click()
+      await page.locator('.cm-content').click()
 
-    await page.waitForTimeout(2000)
+      await page.waitForTimeout(2000)
 
-    // Expect the toast to be gone
+      // Expect the toast to be gone
-    await expect(errorToastMessage).not.toBeVisible()
+      await expect(errorToastMessage).not.toBeVisible()
-    await expect(engineErrorToastMessage).not.toBeVisible()
+      await expect(engineErrorToastMessage).not.toBeVisible()
 
-    // Now add in code that works.
+      // Now add in code that works.
-    await page.locator('.cm-content').fill(bracket)
+      await page.locator('.cm-content').fill(bracket)
-    await page.keyboard.press('End')
+      await page.keyboard.press('End')
-    await page.keyboard.press('Enter')
+      await page.keyboard.press('Enter')
 
-    await scene.waitForExecutionDone()
+      await scene.waitForExecutionDone()
 
-    // Now try exporting
+      // Now try exporting
 
-    // Click the export button
+      // Click the export button
-    await exportButton.click()
+      await exportButton.click()
 
-    // Click the stl.
+      // Click the stl.
-    await expect(stlOption).toBeVisible()
+      await expect(stlOption).toBeVisible()
 
-    await page.keyboard.press('Enter')
+      await page.keyboard.press('Enter')
 
-    // Click the checkbox
+      // Click the checkbox
-    await expect(submitButton).toBeVisible()
+      await expect(submitButton).toBeVisible()
 
-    await page.keyboard.press('Enter')
+      await page.keyboard.press('Enter')
 
-    // Find the toast.
+      // Find the toast.
-    // Look out for the toast message
+      // Look out for the toast message
-    await expect(exportingToastMessage).toBeVisible()
+      await expect(exportingToastMessage).toBeVisible()
 
-    // Expect it to succeed.
+      // Expect it to succeed.
-    await expect(exportingToastMessage).not.toBeVisible({ timeout: 15_000 })
+      await expect(exportingToastMessage).not.toBeVisible({ timeout: 15_000 })
-    await expect(errorToastMessage).not.toBeVisible()
+      await expect(errorToastMessage).not.toBeVisible()
-    await expect(engineErrorToastMessage).not.toBeVisible()
+      await expect(engineErrorToastMessage).not.toBeVisible()
 
-    const successToastMessage = page.getByText(`Exported successfully`)
+      const successToastMessage = page.getByText(`Exported successfully`)
-    await expect(successToastMessage).toBeVisible()
+      await expect(successToastMessage).toBeVisible()
-  })
+    }
+  )
   test(
     'ensure you can not export while an export is already going',
     { tag: ['@skipLinux', '@skipWin'] },

e2e/playwright/sketch-tests.spec.ts

@@ -9,6 +9,7 @@ import {
   PERSIST_MODELING_CONTEXT,
 } from './test-utils'
 import { uuidv4, roundOff } from 'lib/utils'
+import { SceneFixture } from './fixtures/sceneFixture'
 
 test.describe('Sketch tests', { tag: ['@skipWin'] }, () => {
   test('multi-sketch file shows multiple Edit Sketch buttons', async ({
@@ -184,7 +185,8 @@ test.describe('Sketch tests', { tag: ['@skipWin'] }, () => {
     const doEditSegmentsByDraggingHandle = async (
       page: Page,
       homePage: HomePageFixture,
-      openPanes: string[]
+      openPanes: string[],
+      scene: SceneFixture
     ) => {
       // Load the app with the code panes
       await page.addInitScript(async () => {
@@ -200,6 +202,7 @@ test.describe('Sketch tests', { tag: ['@skipWin'] }, () => {
 
       const u = await getUtils(page)
       await homePage.goToModelingScene()
+      await scene.waitForExecutionDone()
 
       await expect(
         page.getByRole('button', { name: 'Start Sketch' })
@@ -317,7 +320,7 @@ test.describe('Sketch tests', { tag: ['@skipWin'] }, () => {
     test(
       'code pane open at start-handles',
       { tag: ['@skipWin'] },
-      async ({ page, homePage }) => {
+      async ({ page, homePage, scene }) => {
         // Load the app with the code panes
         await page.addInitScript(async () => {
           localStorage.setItem(
@@ -330,14 +333,14 @@ test.describe('Sketch tests', { tag: ['@skipWin'] }, () => {
             })
           )
         })
-        await doEditSegmentsByDraggingHandle(page, homePage, ['code'])
+        await doEditSegmentsByDraggingHandle(page, homePage, ['code'], scene)
       }
     )
 
     test(
       'code pane closed at start-handles',
       { tag: ['@skipWin'] },
-      async ({ page, homePage }) => {
+      async ({ page, homePage, scene }) => {
         // Load the app with the code panes
         await page.addInitScript(async (persistModelingContext) => {
           localStorage.setItem(
@@ -345,7 +348,7 @@ test.describe('Sketch tests', { tag: ['@skipWin'] }, () => {
             JSON.stringify({ openPanes: [] })
           )
         }, PERSIST_MODELING_CONTEXT)
-        await doEditSegmentsByDraggingHandle(page, homePage, [])
+        await doEditSegmentsByDraggingHandle(page, homePage, [], scene)
       }
     )
   })
@@ -547,6 +550,7 @@ test.describe('Sketch tests', { tag: ['@skipWin'] }, () => {
   test('Can edit a sketch that has been revolved in the same pipe', async ({
     page,
     homePage,
+    scene,
   }) => {
     const u = await getUtils(page)
     await page.addInitScript(async () => {
@@ -562,6 +566,7 @@ test.describe('Sketch tests', { tag: ['@skipWin'] }, () => {
     })
 
     await homePage.goToModelingScene()
+    await scene.waitForExecutionDone()
 
     await expect(
       page.getByRole('button', { name: 'Start Sketch' })

e2e/playwright/test-network-and-connection-issues.spec.ts

@@ -3,199 +3,200 @@ import { test, expect } from './zoo-test'
 import { commonPoints, getUtils } from './test-utils'
 
 test.describe('Test network and connection issues', () => {
-  test('simulate network down and network little widget', async ({
+  test(
-    page,
+    'simulate network down and network little widget',
-    homePage,
+    { tag: '@skipLocalEngine' },
-  }) => {
+    async ({ page, homePage }) => {
-    const u = await getUtils(page)
+      const u = await getUtils(page)
-    await page.setBodyDimensions({ width: 1200, height: 500 })
+      await page.setBodyDimensions({ width: 1200, height: 500 })
 
-    await homePage.goToModelingScene()
+      await homePage.goToModelingScene()
 
-    const networkToggle = page.getByTestId('network-toggle')
+      const networkToggle = page.getByTestId('network-toggle')
 
-    // This is how we wait until the stream is online
+      // This is how we wait until the stream is online
-    await expect(
+      await expect(
-      page.getByRole('button', { name: 'Start Sketch' })
+        page.getByRole('button', { name: 'Start Sketch' })
-    ).not.toBeDisabled({ timeout: 15000 })
+      ).not.toBeDisabled({ timeout: 15000 })
 
-    const networkWidget = page.locator('[data-testid="network-toggle"]')
+      const networkWidget = page.locator('[data-testid="network-toggle"]')
-    await expect(networkWidget).toBeVisible()
+      await expect(networkWidget).toBeVisible()
-    await networkWidget.hover()
+      await networkWidget.hover()
 
-    const networkPopover = page.locator('[data-testid="network-popover"]')
+      const networkPopover = page.locator('[data-testid="network-popover"]')
-    await expect(networkPopover).not.toBeVisible()
+      await expect(networkPopover).not.toBeVisible()
 
-    // (First check) Expect the network to be up
+      // (First check) Expect the network to be up
-    await expect(networkToggle).toContainText('Connected')
+      await expect(networkToggle).toContainText('Connected')
 
-    // Click the network widget
+      // Click the network widget
-    await networkWidget.click()
+      await networkWidget.click()
 
-    // Check the modal opened.
+      // Check the modal opened.
-    await expect(networkPopover).toBeVisible()
+      await expect(networkPopover).toBeVisible()
 
-    // Click off the modal.
+      // Click off the modal.
-    await page.mouse.click(100, 100)
+      await page.mouse.click(100, 100)
-    await expect(networkPopover).not.toBeVisible()
+      await expect(networkPopover).not.toBeVisible()
 
-    // Turn off the network
+      // Turn off the network
-    await u.emulateNetworkConditions({
+      await u.emulateNetworkConditions({
-      offline: true,
+        offline: true,
-      // values of 0 remove any active throttling. crbug.com/456324#c9
+        // values of 0 remove any active throttling. crbug.com/456324#c9
-      latency: 0,
+        latency: 0,
-      downloadThroughput: -1,
+        downloadThroughput: -1,
-      uploadThroughput: -1,
+        uploadThroughput: -1,
-    })
+      })
 
-    // Expect the network to be down
+      // Expect the network to be down
-    await expect(networkToggle).toContainText('Problem')
+      await expect(networkToggle).toContainText('Problem')
 
-    // Click the network widget
+      // Click the network widget
-    await networkWidget.click()
+      await networkWidget.click()
 
-    // Check the modal opened.
+      // Check the modal opened.
-    await expect(networkPopover).toBeVisible()
+      await expect(networkPopover).toBeVisible()
 
-    // Click off the modal.
+      // Click off the modal.
-    await page.mouse.click(0, 0)
+      await page.mouse.click(0, 0)
-    await expect(networkPopover).not.toBeVisible()
+      await expect(networkPopover).not.toBeVisible()
 
-    // Turn back on the network
+      // Turn back on the network
-    await u.emulateNetworkConditions({
+      await u.emulateNetworkConditions({
-      offline: false,
+        offline: false,
-      // values of 0 remove any active throttling. crbug.com/456324#c9
+        // values of 0 remove any active throttling. crbug.com/456324#c9
-      latency: 0,
+        latency: 0,
-      downloadThroughput: -1,
+        downloadThroughput: -1,
-      uploadThroughput: -1,
+        uploadThroughput: -1,
-    })
+      })
 
-    await expect(
+      await expect(
-      page.getByRole('button', { name: 'Start Sketch' })
+        page.getByRole('button', { name: 'Start Sketch' })
-    ).not.toBeDisabled({ timeout: 15000 })
+      ).not.toBeDisabled({ timeout: 15000 })
 
-    // (Second check) expect the network to be up
+      // (Second check) expect the network to be up
-    await expect(networkToggle).toContainText('Connected')
+      await expect(networkToggle).toContainText('Connected')
-  })
+    }
+  )
 
-  test('Engine disconnect & reconnect in sketch mode', async ({
+  test(
-    page,
+    'Engine disconnect & reconnect in sketch mode',
-    homePage,
+    { tag: '@skipLocalEngine' },
-  }) => {
+    async ({ page, homePage }) => {
-    // TODO: Don't skip Mac for these. After `window.tearDown` is working in Safari, these should work on webkit
+      // TODO: Don't skip Mac for these. After `window.tearDown` is working in Safari, these should work on webkit
-    const networkToggle = page.getByTestId('network-toggle')
+      const networkToggle = page.getByTestId('network-toggle')
 
-    const u = await getUtils(page)
+      const u = await getUtils(page)
-    await page.setBodyDimensions({ width: 1200, height: 500 })
+      await page.setBodyDimensions({ width: 1200, height: 500 })
-    const PUR = 400 / 37.5 //pixeltoUnitRatio
+      const PUR = 400 / 37.5 //pixeltoUnitRatio
 
-    await homePage.goToModelingScene()
+      await homePage.goToModelingScene()
-    await u.waitForPageLoad()
+      await u.waitForPageLoad()
 
-    await u.openDebugPanel()
+      await u.openDebugPanel()
-    // click on "Start Sketch" button
+      // click on "Start Sketch" button
-    await u.clearCommandLogs()
+      await u.clearCommandLogs()
-    await page.getByRole('button', { name: 'Start Sketch' }).click()
+      await page.getByRole('button', { name: 'Start Sketch' }).click()
-    await page.waitForTimeout(100)
+      await page.waitForTimeout(100)
 
-    // select a plane
+      // select a plane
-    await page.mouse.click(700, 200)
+      await page.mouse.click(700, 200)
 
-    await expect(page.locator('.cm-content')).toHaveText(
+      await expect(page.locator('.cm-content')).toHaveText(
-      `sketch001 = startSketchOn('XZ')`
+        `sketch001 = startSketchOn('XZ')`
-    )
+      )
-    await u.closeDebugPanel()
+      await u.closeDebugPanel()
 
-    await page.waitForTimeout(500) // TODO detect animation ending, or disable animation
+      await page.waitForTimeout(500) // TODO detect animation ending, or disable animation
 
-    const startXPx = 600
+      const startXPx = 600
-    await page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10)
+      await page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10)
-    await expect(page.locator('.cm-content'))
+      await expect(page.locator('.cm-content'))
-      .toHaveText(`sketch001 = startSketchOn('XZ')
+        .toHaveText(`sketch001 = startSketchOn('XZ')
   |> startProfileAt(${commonPoints.startAt}, %)`)
-    await page.waitForTimeout(100)
+      await page.waitForTimeout(100)
 
-    await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 10)
+      await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 10)
-    await page.waitForTimeout(100)
+      await page.waitForTimeout(100)
 
-    await expect(page.locator('.cm-content'))
+      await expect(page.locator('.cm-content'))
-      .toHaveText(`sketch001 = startSketchOn('XZ')
+        .toHaveText(`sketch001 = startSketchOn('XZ')
   |> startProfileAt(${commonPoints.startAt}, %)
   |> xLine(${commonPoints.num1}, %)`)
 
-    // Expect the network to be up
+      // Expect the network to be up
-    await expect(networkToggle).toContainText('Connected')
+      await expect(networkToggle).toContainText('Connected')
 
-    // simulate network down
+      // simulate network down
-    await u.emulateNetworkConditions({
+      await u.emulateNetworkConditions({
-      offline: true,
+        offline: true,
-      // values of 0 remove any active throttling. crbug.com/456324#c9
+        // values of 0 remove any active throttling. crbug.com/456324#c9
-      latency: 0,
+        latency: 0,
-      downloadThroughput: -1,
+        downloadThroughput: -1,
-      uploadThroughput: -1,
+        uploadThroughput: -1,
-    })
+      })
 
-    // Expect the network to be down
+      // Expect the network to be down
-    await expect(networkToggle).toContainText('Problem')
+      await expect(networkToggle).toContainText('Problem')
 
-    // Ensure we are not in sketch mode
+      // Ensure we are not in sketch mode
-    await expect(
+      await expect(
-      page.getByRole('button', { name: 'Exit Sketch' })
+        page.getByRole('button', { name: 'Exit Sketch' })
-    ).not.toBeVisible()
+      ).not.toBeVisible()
-    await expect(
+      await expect(
-      page.getByRole('button', { name: 'Start Sketch' })
+        page.getByRole('button', { name: 'Start Sketch' })
-    ).toBeVisible()
+      ).toBeVisible()
 
-    // simulate network up
+      // simulate network up
-    await u.emulateNetworkConditions({
+      await u.emulateNetworkConditions({
-      offline: false,
+        offline: false,
-      // values of 0 remove any active throttling. crbug.com/456324#c9
+        // values of 0 remove any active throttling. crbug.com/456324#c9
-      latency: 0,
+        latency: 0,
-      downloadThroughput: -1,
+        downloadThroughput: -1,
-      uploadThroughput: -1,
+        uploadThroughput: -1,
-    })
+      })
 
-    // Wait for the app to be ready for use
+      // Wait for the app to be ready for use
-    await expect(
+      await expect(
-      page.getByRole('button', { name: 'Start Sketch' })
+        page.getByRole('button', { name: 'Start Sketch' })
-    ).not.toBeDisabled({ timeout: 15000 })
+      ).not.toBeDisabled({ timeout: 15000 })
 
-    // Expect the network to be up
+      // Expect the network to be up
-    await expect(networkToggle).toContainText('Connected')
+      await expect(networkToggle).toContainText('Connected')
-    await expect(page.getByTestId('loading-stream')).not.toBeAttached()
+      await expect(page.getByTestId('loading-stream')).not.toBeAttached()
 
-    // Click off the code pane.
+      // Click off the code pane.
-    await page.mouse.click(100, 100)
+      await page.mouse.click(100, 100)
 
-    // select a line
+      // select a line
-    await page.getByText(`startProfileAt(${commonPoints.startAt}, %)`).click()
+      await page.getByText(`startProfileAt(${commonPoints.startAt}, %)`).click()
 
-    // enter sketch again
+      // enter sketch again
-    await u.doAndWaitForCmd(
+      await u.doAndWaitForCmd(
-      () => page.getByRole('button', { name: 'Edit Sketch' }).click(),
+        () => page.getByRole('button', { name: 'Edit Sketch' }).click(),
-      'default_camera_get_settings'
+        'default_camera_get_settings'
-    )
+      )
-    await page.waitForTimeout(150)
+      await page.waitForTimeout(150)
 
-    // Click the line tool
+      // Click the line tool
-    await page.getByRole('button', { name: 'line Line', exact: true }).click()
+      await page.getByRole('button', { name: 'line Line', exact: true }).click()
 
-    await page.waitForTimeout(150)
+      await page.waitForTimeout(150)
 
-    // Ensure we can continue sketching
+      // Ensure we can continue sketching
-    await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 20)
+      await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 20)
-    await expect.poll(u.normalisedEditorCode)
+      await expect.poll(u.normalisedEditorCode)
-      .toBe(`sketch001 = startSketchOn('XZ')
+        .toBe(`sketch001 = startSketchOn('XZ')
   |> startProfileAt([12.34, -12.34], %)
   |> xLine(12.34, %)
   |> line(end = [-12.34, 12.34])
 
 `)
-    await page.waitForTimeout(100)
+      await page.waitForTimeout(100)
-    await page.mouse.click(startXPx, 500 - PUR * 20)
+      await page.mouse.click(startXPx, 500 - PUR * 20)
 
-    await expect.poll(u.normalisedEditorCode)
+      await expect.poll(u.normalisedEditorCode)
-      .toBe(`sketch001 = startSketchOn('XZ')
+        .toBe(`sketch001 = startSketchOn('XZ')
   |> startProfileAt([12.34, -12.34], %)
   |> xLine(12.34, %)
   |> line(end = [-12.34, 12.34])
@@ -203,20 +204,21 @@ test.describe('Test network and connection issues', () => {
 
 `)
 
-    // Unequip line tool
+      // Unequip line tool
-    await page.keyboard.press('Escape')
+      await page.keyboard.press('Escape')
-    // Make sure we didn't pop out of sketch mode.
+      // Make sure we didn't pop out of sketch mode.
-    await expect(
+      await expect(
-      page.getByRole('button', { name: 'Exit Sketch' })
+        page.getByRole('button', { name: 'Exit Sketch' })
-    ).toBeVisible()
+      ).toBeVisible()
-    await expect(
+      await expect(
-      page.getByRole('button', { name: 'line Line', exact: true })
+        page.getByRole('button', { name: 'line Line', exact: true })
-    ).not.toHaveAttribute('aria-pressed', 'true')
+      ).not.toHaveAttribute('aria-pressed', 'true')
 
-    // Exit sketch
+      // Exit sketch
-    await page.keyboard.press('Escape')
+      await page.keyboard.press('Escape')
-    await expect(
+      await expect(
-      page.getByRole('button', { name: 'Exit Sketch' })
+        page.getByRole('button', { name: 'Exit Sketch' })
-    ).not.toBeVisible()
+      ).not.toBeVisible()
-  })
+    }
+  )
 })

e2e/playwright/testing-camera-movement.spec.ts

@@ -109,7 +109,8 @@ test.describe('Testing Camera Movement', { tag: ['@skipWin'] }, () => {
       await page.keyboard.down('Shift')
       await page.mouse.move(600, 200)
       await page.mouse.down({ button: 'right' })
-      await page.mouse.move(700, 200, { steps: 2 })
+      // Gotcha: remove steps:2 from this 700,200 mouse move. This bricked the test on local host engine.
+      await page.mouse.move(700, 200)
       await page.mouse.up({ button: 'right' })
       await page.keyboard.up('Shift')
     }, [-19, -85, -85])

e2e/playwright/testing-selections.spec.ts

@@ -248,7 +248,11 @@ test.describe('Testing selections', { tag: ['@skipWin'] }, () => {
     })
   })
 
-  test('Solids should be select and deletable', async ({ page, homePage }) => {
+  test('Solids should be select and deletable', async ({
+    page,
+    homePage,
+    scene,
+  }) => {
     test.setTimeout(90_000)
     const u = await getUtils(page)
     await page.addInitScript(async () => {
@@ -320,10 +324,7 @@ test.describe('Testing selections', { tag: ['@skipWin'] }, () => {
     await page.setBodyDimensions({ width: 1000, height: 500 })
 
     await homePage.goToModelingScene()
-
+    await scene.waitForExecutionDone()
-    await u.openDebugPanel()
-    await u.expectCmdLog('[data-message-type="execution-done"]')
-    await u.closeDebugPanel()
 
     await u.openAndClearDebugPanel()
     await u.sendCustomCmd({
@@ -902,6 +903,7 @@ test.describe('Testing selections', { tag: ['@skipWin'] }, () => {
   test('Testing selections (and hovers) work on sketches when NOT in sketch mode', async ({
     page,
     homePage,
+    scene,
   }) => {
     const cases = [
       {
@@ -937,6 +939,7 @@ test.describe('Testing selections', { tag: ['@skipWin'] }, () => {
     await page.setBodyDimensions({ width: 1200, height: 500 })
 
     await homePage.goToModelingScene()
+    await scene.waitForExecutionDone()
     await u.openAndClearDebugPanel()
 
     await u.sendCustomCmd({
@@ -970,6 +973,7 @@ test.describe('Testing selections', { tag: ['@skipWin'] }, () => {
   test("Hovering and selection of extruded faces works, and is not overridden shortly after user's click", async ({
     page,
     homePage,
+    scene,
   }) => {
     await page.addInitScript(async () => {
       localStorage.setItem(
@@ -988,6 +992,7 @@ test.describe('Testing selections', { tag: ['@skipWin'] }, () => {
     await page.setBodyDimensions({ width: 1200, height: 500 })
 
     await homePage.goToModelingScene()
+    await scene.waitForExecutionDone()
     await u.openAndClearDebugPanel()
 
     await u.sendCustomCmd({
@@ -1021,19 +1026,19 @@ test.describe('Testing selections', { tag: ['@skipWin'] }, () => {
       .poll(() => u.getGreatestPixDiff(extrudeWall, noHoverColor))
       .toBeLessThan(15)
     await page.mouse.move(nothing.x, nothing.y)
-    await page.waitForTimeout(100)
+    await page.waitForTimeout(1000)
     await page.mouse.move(extrudeWall.x, extrudeWall.y)
     await expect(page.getByTestId('hover-highlight').first()).toBeVisible()
     await expect(page.getByTestId('hover-highlight').first()).toContainText(
       removeAfterFirstParenthesis(extrudeText)
     )
-    await page.waitForTimeout(200)
+    await page.waitForTimeout(1000)
     await expect(
       await u.getGreatestPixDiff(extrudeWall, hoverColor)
     ).toBeLessThan(15)
     await page.mouse.click(extrudeWall.x, extrudeWall.y)
     await expect(page.locator('.cm-activeLine')).toHaveText(`|> ${extrudeText}`)
-    await page.waitForTimeout(200)
+    await page.waitForTimeout(1000)
     await expect(
       await u.getGreatestPixDiff(extrudeWall, selectColor)
     ).toBeLessThan(15)
@@ -1044,7 +1049,7 @@ test.describe('Testing selections', { tag: ['@skipWin'] }, () => {
     ).toBeLessThan(15)
 
     await page.mouse.move(nothing.x, nothing.y)
-    await page.waitForTimeout(300)
+    await page.waitForTimeout(1000)
     await expect(page.getByTestId('hover-highlight')).not.toBeVisible()
 
     // because of shading, color is not exact everywhere on the face
@@ -1058,11 +1063,11 @@ test.describe('Testing selections', { tag: ['@skipWin'] }, () => {
     await expect(page.getByTestId('hover-highlight').first()).toContainText(
       removeAfterFirstParenthesis(capText)
     )
-    await page.waitForTimeout(200)
+    await page.waitForTimeout(1000)
     await expect(await u.getGreatestPixDiff(cap, hoverColor)).toBeLessThan(15)
     await page.mouse.click(cap.x, cap.y)
     await expect(page.locator('.cm-activeLine')).toHaveText(`|> ${capText}`)
-    await page.waitForTimeout(200)
+    await page.waitForTimeout(1000)
     await expect(await u.getGreatestPixDiff(cap, selectColor)).toBeLessThan(15)
     await page.waitForTimeout(1000)
     // check color stays there, i.e. not overridden (this was a bug previously)

e2e/playwright/various.spec.ts

@@ -32,15 +32,18 @@ test.fixme('Units menu', async ({ page, homePage }) => {
   await expect(unitsMenuButton).toContainText('mm')
 })
 
-test('Successful export shows a success toast', async ({ page, homePage }) => {
+test(
-  // FYI this test doesn't work with only engine running locally
+  'Successful export shows a success toast',
-  // And you will need to have the KittyCAD CLI installed
+  { tag: '@skipLocalEngine' },
-  const u = await getUtils(page)
+  async ({ page, homePage }) => {
-  await page.addInitScript(async () => {
+    // FYI this test doesn't work with only engine running locally
-    ;(window as any).playwrightSkipFilePicker = true
+    // And you will need to have the KittyCAD CLI installed
-    localStorage.setItem(
+    const u = await getUtils(page)
-      'persistCode',
+    await page.addInitScript(async () => {
-      `topAng = 25
+      ;(window as any).playwrightSkipFilePicker = true
+      localStorage.setItem(
+        'persistCode',
+        `topAng = 25
 bottomAng = 35
 baseLen = 3.5
 baseHeight = 1
@@ -78,26 +81,27 @@ part001 = startSketchOn('-XZ')
 |> xLineTo(ZERO, %)
 |> close()
 |> extrude(length = 4)`
+      )
+    })
+    await page.setBodyDimensions({ width: 1200, height: 500 })
+
+    await homePage.goToModelingScene()
+    await u.openDebugPanel()
+    await u.expectCmdLog('[data-message-type="execution-done"]')
+    await u.waitForCmdReceive('extrude')
+    await page.waitForTimeout(1000)
+    await u.clearAndCloseDebugPanel()
+
+    await doExport(
+      {
+        type: 'gltf',
+        storage: 'embedded',
+        presentation: 'pretty',
+      },
+      page
     )
-  })
+  }
-  await page.setBodyDimensions({ width: 1200, height: 500 })
+)
-
-  await homePage.goToModelingScene()
-  await u.openDebugPanel()
-  await u.expectCmdLog('[data-message-type="execution-done"]')
-  await u.waitForCmdReceive('extrude')
-  await page.waitForTimeout(1000)
-  await u.clearAndCloseDebugPanel()
-
-  await doExport(
-    {
-      type: 'gltf',
-      storage: 'embedded',
-      presentation: 'pretty',
-    },
-    page
-  )
-})
 
 test('Paste should not work unless an input is focused', async ({
   page,
@@ -444,7 +448,7 @@ test('Delete key does not navigate back', async ({ page, homePage }) => {
   await expect.poll(() => page.url()).not.toContain('/settings')
 })
 
-test('Sketch on face', async ({ page, homePage }) => {
+test('Sketch on face', async ({ page, homePage, scene, cmdBar }) => {
   test.setTimeout(90_000)
   const u = await getUtils(page)
   await page.addInitScript(async () => {
@@ -470,11 +474,7 @@ extrude001 = extrude(sketch001, length = 5 + 7)`
   await page.setBodyDimensions({ width: 1200, height: 500 })
 
   await homePage.goToModelingScene()
-
+  await scene.waitForExecutionDone()
-  // wait for execution done
-  await u.openDebugPanel()
-  await u.expectCmdLog('[data-message-type="execution-done"]')
-  await u.closeDebugPanel()
 
   await expect(
     page.getByRole('button', { name: 'Start Sketch' })
@@ -579,10 +579,9 @@ extrude001 = extrude(sketch001, length = 5 + 7)`
   await expect(page.getByTestId('command-bar')).toBeVisible()
   await page.waitForTimeout(100)
 
-  await page.getByRole('button', { name: 'arrow right Continue' }).click()
+  await cmdBar.progressCmdBar()
-  await page.waitForTimeout(100)
   await expect(page.getByText('Confirm Extrude')).toBeVisible()
-  await page.getByRole('button', { name: 'checkmark Submit command' }).click()
+  await cmdBar.progressCmdBar()
 
   const result2 = result.genNext`
 const sketch002 = extrude(sketch002, length = ${[5, 5]} + 7)`

package.json

@@ -120,6 +120,7 @@
     "test:playwright:electron:windows:local": "yarn tronb:vite:dev && set NODE_ENV='development' && playwright test --config=playwright.electron.config.ts --grep-invert=\"@skipWin|@snapshot\"",
     "test:playwright:electron:macos:local": "yarn tronb:vite:dev && NODE_ENV=development playwright test --config=playwright.electron.config.ts --grep-invert='@skipMacos|@snapshot'",
     "test:playwright:electron:ubuntu:local": "yarn tronb:vite:dev && NODE_ENV=development playwright test --config=playwright.electron.config.ts --grep-invert='@skipLinux|@snapshot'",
+    "test:playwright:electron:ubuntu:engine:local": "yarn tronb:vite:dev && NODE_ENV=development playwright test --config=playwright.electron.config.ts --grep-invert='@skipLinux|@snapshot|@skipLocalEngine'",
     "test:unit:local": "yarn simpleserver:bg && yarn test:unit; kill-port 3000",
     "test:unit:kcl-samples:local": "yarn simpleserver:bg && yarn test:unit:kcl-samples; kill-port 3000"
   },

src/components/CommandBar/CommandBarHeader.tsx

@@ -196,6 +196,7 @@ function ReviewingButton() {
       type="submit"
       form="review-form"
       className="w-fit !p-0 rounded-sm hover:shadow"
+      data-testid="command-bar-submit"
       iconStart={{
         icon: 'checkmark',
         bgClassName: 'p-1 rounded-sm !bg-primary hover:brightness-110',
@@ -214,6 +215,7 @@ function GatheringArgsButton() {
       type="submit"
       form="arg-form"
       className="w-fit !p-0 rounded-sm hover:shadow"
+      data-testid="command-bar-continue"
       iconStart={{
         icon: 'arrowRight',
         bgClassName: 'p-1 rounded-sm !bg-primary hover:brightness-110',

src/components/CommandBar/CommandBarKclInput.tsx

@@ -20,6 +20,7 @@ import { createIdentifier, createVariableDeclaration } from 'lang/modifyAst'
 import { useCodeMirror } from 'components/ModelingSidebar/ModelingPanes/CodeEditor'
 import { useSelector } from '@xstate/react'
 import { commandBarActor, useCommandBarState } from 'machines/commandBarMachine'
+import toast from 'react-hot-toast'
 
 const machineContextSelector = (snapshot?: {
   context: Record<string, unknown>
@@ -97,6 +98,7 @@ function CommandBarKclInput({
     value,
     initialVariableName,
   })
+
   const varMentionData: Completion[] = prevVariables.map((v) => ({
     label: v.key,
     detail: String(roundOff(v.value as number)),
@@ -170,7 +172,15 @@ function CommandBarKclInput({
 
   function handleSubmit(e?: React.FormEvent<HTMLFormElement>) {
     e?.preventDefault()
-    if (!canSubmit || valueNode === null) return
+    if (!canSubmit || valueNode === null) {
+      // Gotcha: Our application can attempt to submit a command value before the command bar kcl input is ready. Notify the scene and user.
+      if (!canSubmit) {
+        toast.error('Unable to submit command')
+      } else if (valueNode === null) {
+        toast.error('Unable to submit undefined command value')
+      }
+      return
+    }
 
     onSubmit(
       createNewVariable

src/editor/plugins/lsp/kcl/index.ts

@@ -25,6 +25,18 @@ export class KclPlugin implements PluginValue {
 
   constructor(client: LanguageServerClient) {
     this.client = client
+
+    // Gotcha: Code can be written into the CodeMirror editor but not propagated to codeManager.code
+    // because the update function has not run. We need to initialize the codeManager.code when lsp initializes
+    // because new code could have been written into the editor before the update callback is initialized.
+    // There appears to be limited ways to safely get the current doc content. This appears to be sync and safe.
+    const kclLspPlugin = this.client.plugins.find((plugin) => {
+      return plugin.client.name === 'kcl'
+    })
+    if (kclLspPlugin) {
+      // @ts-ignore Ignoring this private dereference of .view on the plugin. I do not have another helper method that can give me doc string
+      codeManager.code = kclLspPlugin.view.state.doc.toString()
+    }
   }
 
   // When a doc update needs to be sent to the server, this holds the

src/lib/useCalculateKclExpression.ts

@@ -9,6 +9,8 @@ import {
   getCalculatedKclExpressionValue,
   programMemoryFromVariables,
 } from './kclHelpers'
+import { parse, resultIsOk } from 'lang/wasm'
+import { err } from 'lib/trap'
 
 const isValidVariableName = (name: string) =>
   /^[a-zA-Z_][a-zA-Z0-9_]*$/.test(name)
@@ -50,7 +52,20 @@ export function useCalculateKclExpression({
     bodyPath: [],
   })
   const [valueNode, setValueNode] = useState<Expr | null>(null)
-  const [calcResult, setCalcResult] = useState('NAN')
+  // Gotcha: If we do not attempt to parse numeric literals instantly it means that there is an async action to verify
+  // the value is good. This means all E2E tests have a race condition on when they can hit "next" in the command bar.
+  // Most scenarios automatically pass a numeric literal. We can try to parse that first, otherwise make it go through the slow
+  // async method.
+  // If we pass in numeric literals, we should instantly parse them, they have nothing to do with application memory
+  const _code_value = `const __result__ = ${value}`
+  const codeValueParseResult = parse(_code_value)
+  let isValueParsable = true
+  if (err(codeValueParseResult) || !resultIsOk(codeValueParseResult)) {
+    isValueParsable = false
+  }
+  const initialCalcResult: number | string =
+    Number.isNaN(Number(value)) || !isValueParsable ? 'NAN' : value
+  const [calcResult, setCalcResult] = useState(initialCalcResult)
   const [newVariableName, setNewVariableName] = useState('')
   const [isNewVariableNameUnique, setIsNewVariableNameUnique] = useState(true)