A snapshot a day keeps the bugs away! 📷🐛 (OS: ubuntu)

.codespellrc

@@ -1,3 +1,3 @@
 [codespell]
-ignore-words-list: crate,everytime,inout,co-ordinate,ot,nwo,absolutey,atleast
+ignore-words-list: crate,everytime,inout,co-ordinate,ot,nwo,absolutey
-skip: **/target,node_modules,build,**/Cargo.lock,./docs/kcl/*.md,./src-tauri/gen/schemas
+skip: **/target,node_modules,build,**/Cargo.lock

.github/dependabot.yml

@@ -9,27 +9,15 @@ updates:
       directory: '/' # Location of package manifests
       schedule:
           interval: 'daily'
-      reviewers:
-          - franknoirot 
-          - irev-dev
     - package-ecosystem: 'github-actions' # See documentation for possible values
       directory: '/' # Location of package manifests
       schedule:
           interval: 'daily'
-      reviewers:
-          - adamchalmers
-          - jessfraz
     - package-ecosystem: 'cargo' # See documentation for possible values
       directory: '/src/wasm-lib/' # Location of package manifests
       schedule:
           interval: 'daily'
-      reviewers:
-          - adamchalmers
-          - jessfraz
     - package-ecosystem: 'cargo' # See documentation for possible values
       directory: '/src-tauri/' # Location of package manifests
       schedule:
           interval: 'daily'
-      reviewers:
-          - adamchalmers
-          - jessfraz

.github/workflows/cargo-criterion.yml

@@ -7,23 +7,23 @@ on:
       - '**/Cargo.toml'
       - '**/Cargo.lock'
       - '**/rust-toolchain.toml'
-      - .github/workflows/cargo-bench.yml
+      - .github/workflows/cargo-criterion.yml
   pull_request:
     paths:
       - '**.rs'
       - '**/Cargo.toml'
       - '**/Cargo.lock'
       - '**/rust-toolchain.toml'
-      - .github/workflows/cargo-bench.yml
+      - .github/workflows/cargo-criterion.yml
   workflow_dispatch:
 permissions: read-all
 concurrency:
   group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
   cancel-in-progress: true
-name: cargo bench
+name: cargo criterion
 jobs:
-  cargo-bench:
+  cargocriterion:
-    name: Benchmark with iai
+    name: cargo criterion
     runs-on: ubuntu-latest-8-cores
     steps:
       - uses: actions/checkout@v4
@@ -31,12 +31,10 @@ jobs:
       - name: Install dependencies
         run: |
           cargo install cargo-criterion
-          sudo apt update
-          sudo apt install -y valgrind
       - name: Rust Cache
         uses: Swatinem/rust-cache@v2.6.1
       - name: Benchmark kcl library
         shell: bash
         run: |-
-          cd src/wasm-lib/kcl; cargo bench -- iai
+          cd src/wasm-lib/kcl; cargo criterion
 

.github/workflows/check-exampleKcl.yml

@@ -16,10 +16,10 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v3
 
       - name: Comment on PR
-        uses: actions/github-script@v7
+        uses: actions/github-script@v6
         with:
           script: |
             const message = '`src/lib/exampleKcl.ts` has been updated in this PR, please review and update the `src/routes/onboarding`, if needed.';

.github/workflows/ci.yml

@@ -104,11 +104,7 @@ jobs:
         run: |
           VERSION=$(date +'%-y.%-m.%-d') yarn bump-jsons
           echo "$(jq --arg url 'https://dl.zoo.dev/releases/modeling-app/nightly/last_update.json' \
-            '.plugins.updater.endpoints[]=$url' src-tauri/tauri.release.conf.json --indent 2)" > src-tauri/tauri.release.conf.json
+            '.tauri.updater.endpoints[]=$url' src-tauri/tauri.release.conf.json --indent 2)" > src-tauri/tauri.release.conf.json
-          echo "$(jq --arg id 'dev.zoo.modeling-app-nightly' \
-            '.identifier=$id' src-tauri/tauri.release.conf.json --indent 2)" > src-tauri/tauri.release.conf.json
-          echo "$(jq --arg name 'Zoo Modeling App (Nightly)' \
-            '.productName=$name' src-tauri/tauri.release.conf.json --indent 2)" > src-tauri/tauri.release.conf.json
 
       - uses: actions/upload-artifact@v3
         if: github.event_name == 'schedule'
@@ -129,9 +125,6 @@ jobs:
       fail-fast: false
       matrix:
         os: [macos-14, ubuntu-latest, windows-latest]
-    env:
-      TAURI_ARGS_MACOS: ${{ matrix.os == 'macos-14' && '--target universal-apple-darwin' || '' }}
-      TAURI_ARGS_UBUNTU: ${{ matrix.os == 'ubuntu-latest' && '--bundles' || '' }}
     steps:
       - uses: actions/checkout@v4
 
@@ -151,12 +144,10 @@ jobs:
           sudo apt-get update &&
           sudo apt-get install -y
           libgtk-3-dev
-          libayatana-appindicator3-dev
+          libgtksourceview-3.0-dev
+          webkit2gtk-4.0
+          libappindicator3-dev
           webkit2gtk-driver
-          libsoup-3.0-dev
-          libjavascriptcoregtk-4.1-dev
-          libwebkit2gtk-4.1-dev
-          at-spi2-core
           xvfb
 
       - name: Sync node version and setup cache
@@ -170,9 +161,7 @@ jobs:
       - name: Setup Rust
         uses: dtolnay/rust-toolchain@stable
 
-      # TODO: re-enable for Windows builds, see https://github.com/tauri-apps/tauri/issues/9045
       - name: Setup Rust cache
-        if: matrix.os != 'windows-latest'
         uses: swatinem/rust-cache@v2
         with:
           workspaces: './src-tauri -> target'
@@ -235,14 +224,14 @@ jobs:
         with:
           includeRelease: false
           includeDebug: true
-          args: "${{ env.TAURI_ARGS_MACOS }} ${{ env.TAURI_ARGS_UBUNTU }}"
+          args: ${{ matrix.os == 'macos-14' && '--target universal-apple-darwin' || '' }}
 
       - name: Build the app (release) and sign
         uses: tauri-apps/tauri-action@v0
         if: ${{ env.BUILD_RELEASE == 'true' }}
         env:
-          TAURI_SIGNING_PRIVATE_KEY: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY }}
+          TAURI_PRIVATE_KEY: ${{ secrets.TAURI_PRIVATE_KEY }}
-          TAURI_SIGNING_PRIVATE_KEY_PASSWORD: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY_PASSWORD }}
+          TAURI_KEY_PASSWORD: ${{ secrets.TAURI_KEY_PASSWORD }}
           APPLE_CERTIFICATE: ${{ secrets.APPLE_CERTIFICATE }}
           APPLE_CERTIFICATE_PASSWORD: ${{ secrets.APPLE_CERTIFICATE_PASSWORD }}
           APPLE_SIGNING_IDENTITY: ${{ secrets.APPLE_SIGNING_IDENTITY }}
@@ -251,7 +240,7 @@ jobs:
           APPLE_TEAM_ID: ${{ secrets.APPLE_TEAM_ID }}
           TAURI_CONF_ARGS: "--config ${{ matrix.os == 'windows-latest' && 'src-tauri\\tauri.release.conf.json' || 'src-tauri/tauri.release.conf.json' }}"
         with:
-          args: "${{ env.TAURI_CONF_ARGS }} ${{ env.TAURI_ARGS_MACOS }} ${{ env.TAURI_ARGS_UBUNTU }}"
+          args: "${{ matrix.os == 'macos-14' && '--target universal-apple-darwin' || '' }} ${{ env.TAURI_CONF_ARGS }}"
 
       - uses: actions/upload-artifact@v3
         if: matrix.os != 'ubuntu-latest'
@@ -261,11 +250,10 @@ jobs:
         with:
           path: "${{ env.PREFIX }}/${{ env.MODE }}/bundle/*/*"
 
-      # TODO: re-enable linux e2e tests when possible
       - name: Run e2e tests (linux only)
-        if: false
+        if: matrix.os == 'ubuntu-latest'
         run: |
-          cargo install tauri-driver
+          cargo install tauri-driver@0.1.3
           source .env.${{ env.BUILD_RELEASE == 'true' && 'production' || 'development' }}
           export VITE_KC_API_BASE_URL
           xvfb-run yarn test:e2e:tauri
@@ -285,7 +273,6 @@ jobs:
       NOTES: ${{ github.event_name == 'release' && github.event.release.body || format('Nightly build, commit {0}', github.sha) }}
       BUCKET_DIR: ${{ github.event_name == 'release' && 'dl.kittycad.io/releases/modeling-app' || 'dl.kittycad.io/releases/modeling-app/nightly' }}
       WEBSITE_DIR: ${{ github.event_name == 'release' && 'dl.zoo.dev/releases/modeling-app' || 'dl.zoo.dev/releases/modeling-app/nightly' }}
-      URL_CODED_NAME: ${{ github.event_name == 'schedule' && 'Zoo%20Modeling%20App%20%28Nightly%29' || 'Zoo%20Modeling%20App' }}
     steps:
       - uses: actions/download-artifact@v3
 
@@ -300,9 +287,9 @@ jobs:
             --arg pub_date "${PUB_DATE}" \
             --arg notes "${NOTES}" \
             --arg darwin_sig "$DARWIN_SIG" \
-            --arg darwin_url "$RELEASE_DIR/macos/${{ env.URL_CODED_NAME }}.app.tar.gz" \
+            --arg darwin_url "$RELEASE_DIR/macos/Zoo%20Modeling%20App.app.tar.gz" \
             --arg windows_sig "$WINDOWS_SIG" \
-            --arg windows_url "$RELEASE_DIR/msi/${{ env.URL_CODED_NAME }}_${VERSION_NO_V}_x64_en-US.msi.zip" \
+            --arg windows_url "$RELEASE_DIR/msi/Zoo%20Modeling%20App_${VERSION_NO_V}_x64_en-US.msi.zip" \
             '{
               "version": $version,
               "pub_date": $pub_date,
@@ -331,8 +318,8 @@ jobs:
             --arg version "${VERSION}" \
             --arg pub_date "${PUB_DATE}" \
             --arg notes "${NOTES}" \
-            --arg darwin_url "$RELEASE_DIR/dmg/${{ env.URL_CODED_NAME }}_${VERSION_NO_V}_universal.dmg" \
+            --arg darwin_url "$RELEASE_DIR/dmg/Zoo%20Modeling%20App_${VERSION_NO_V}_universal.dmg" \
-            --arg windows_url "$RELEASE_DIR/msi/${{ env.URL_CODED_NAME }}_${VERSION_NO_V}_x64_en-US.msi" \
+            --arg windows_url "$RELEASE_DIR/msi/Zoo%20Modeling%20App_${VERSION_NO_V}_x64_en-US.msi" \
             '{
               "version": $version,
               "pub_date": $pub_date,

.github/workflows/generate-website-docs.yml

@@ -56,9 +56,6 @@ jobs:
           gh pr create --title "Update KCL docs" \
               --body "Updating the generated kcl docs cc @jessfraz @franknoirot merge this" \
               --head "$NEW_BRANCH" \
-              --reviewer jessfraz \
-              --reviewer irev-dev \
-              --reviewer franknoirot \
               --base main || true
         env:
           GITHUB_TOKEN: ${{ steps.app-token.outputs.token }}

.github/workflows/playwright.yml

@@ -9,10 +9,6 @@ concurrency:
   group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
   cancel-in-progress: true
 
-permissions:
-  contents: write
-  pull-requests: write
-
 jobs:
   playwright-ubuntu:
     timeout-minutes: 60

.gitignore

@@ -51,6 +51,5 @@ e2e/playwright/export-snapshots/*
 
 ## generated files
 src/**/*.typegen.ts
-src-tauri/gen
 
 src/wasm-lib/grackle/stdlib_cube_partial.json

README.md

@@ -281,7 +281,7 @@ https://github.com/KittyCAD/modeling-app/assets/29681384/6f5e8e85-1003-4fd9-be7f
 <details>
 
 <summary>
-PS: for the debug panel, the following JSON is useful for snapping the camera
+Ps for the debug panel, the following JSON is useful for snapping the camera
 </summary>
 
 ```JSON

docs/kcl/abs.md

@@ -12,10 +12,6 @@ Computes the absolute value of a number.
 abs(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/acos.md

@@ -12,10 +12,6 @@ Computes the arccosine of a number (in radians).
 acos(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/asin.md

@@ -12,10 +12,6 @@ Computes the arcsine of a number (in radians).
 asin(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/atan.md

@@ -12,10 +12,6 @@ Computes the arctangent of a number (in radians).
 atan(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/ceil.md

@@ -12,10 +12,6 @@ Computes the smallest integer greater than or equal to a number.
 ceil(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/cos.md

@@ -1,10 +1,10 @@
 ---
 title: "cos"
-excerpt: "Computes the cosine of a number (in radians)."
+excerpt: "Computes the sine of a number (in radians)."
 layout: manual
 ---
 
-Computes the cosine of a number (in radians).
+Computes the sine of a number (in radians).
 
 
 
@@ -12,10 +12,6 @@ Computes the cosine of a number (in radians).
 cos(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/e.md

@@ -12,10 +12,6 @@ Return the value of Euler’s number `e`.
 e() -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/floor.md

@@ -12,10 +12,6 @@ Computes the largest integer less than or equal to a number.
 floor(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/index.md

@@ -30,12 +30,10 @@ layout: manual
 * [`extrude`](kcl/extrude)
 * [`fillet`](kcl/fillet)
 * [`floor`](kcl/floor)
-* [`getEdge`](kcl/getEdge)
 * [`getExtrudeWallTransform`](kcl/getExtrudeWallTransform)
 * [`getNextAdjacentEdge`](kcl/getNextAdjacentEdge)
 * [`getOppositeEdge`](kcl/getOppositeEdge)
 * [`getPreviousAdjacentEdge`](kcl/getPreviousAdjacentEdge)
-* [`helix`](kcl/helix)
 * [`hole`](kcl/hole)
 * [`import`](kcl/import)
 * [`lastSegX`](kcl/lastSegX)
@@ -57,7 +55,6 @@ layout: manual
 * [`patternLinear3d`](kcl/patternLinear3d)
 * [`pi`](kcl/pi)
 * [`pow`](kcl/pow)
-* [`revolve`](kcl/revolve)
 * [`segAng`](kcl/segAng)
 * [`segEndX`](kcl/segEndX)
 * [`segEndY`](kcl/segEndY)

docs/kcl/legAngX.md

@@ -12,10 +12,6 @@ Returns the angle of the given leg for x.
 legAngX(hypotenuse: number, leg: number) -> number
 ```
 
-### Tags
-
-* `utilities`
-
 ### Examples
 
 ```js

docs/kcl/legAngY.md

@@ -12,10 +12,6 @@ Returns the angle of the given leg for y.
 legAngY(hypotenuse: number, leg: number) -> number
 ```
 
-### Tags
-
-* `utilities`
-
 ### Examples
 
 ```js

docs/kcl/legLen.md

@@ -12,10 +12,6 @@ Returns the length of the given leg.
 legLen(hypotenuse: number, leg: number) -> number
 ```
 
-### Tags
-
-* `utilities`
-
 ### Examples
 
 ```js

docs/kcl/ln.md

@@ -12,10 +12,6 @@ Computes the natural logarithm of the number.
 ln(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/log.md

@@ -12,10 +12,6 @@ The result might not be correctly rounded owing to implementation details; `log2
 log(num: number, base: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/log10.md

@@ -12,10 +12,6 @@ Computes the base 10 logarithm of the number.
 log10(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/log2.md

@@ -12,10 +12,6 @@ Computes the base 2 logarithm of the number.
 log2(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/max.md

@@ -12,10 +12,6 @@ Computes the maximum of the given arguments.
 max(args: [number]) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/min.md

@@ -12,10 +12,6 @@ Computes the minimum of the given arguments.
 min(args: [number]) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/pi.md

@@ -12,10 +12,6 @@ Return the value of `pi`. Archimedes’ constant (π).
 pi() -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/pow.md

@@ -12,10 +12,6 @@ Computes the number to a power.
 pow(num: number, pow: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/sin.md

@@ -12,10 +12,6 @@ Computes the sine of a number (in radians).
 sin(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/sqrt.md

@@ -12,10 +12,6 @@ Computes the square root of a number.
 sqrt(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/tan.md

@@ -12,10 +12,6 @@ Computes the tangent of a number (in radians).
 tan(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/tau.md

@@ -12,10 +12,6 @@ Return the value of `tau`. The full circle constant (τ). Equal to 2π.
 tau() -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/toDegrees.md

@@ -12,10 +12,6 @@ Converts a number from radians to degrees.
 toDegrees(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

docs/kcl/toRadians.md

@@ -12,10 +12,6 @@ Converts a number from degrees to radians.
 toRadians(num: number) -> number
 ```
 
-### Tags
-
-* `math`
-
 ### Examples
 
 ```js

e2e/playwright/flow-tests.spec.ts

@@ -1,16 +1,10 @@
 import { test, expect } from '@playwright/test'
+import { secrets } from './secrets'
 import { getUtils } from './test-utils'
 import waitOn from 'wait-on'
+import { Themes } from '../../src/lib/theme'
+import { initialSettings } from '../../src/lib/settings/initialSettings'
 import { roundOff } from 'lib/utils'
-import * as TOML from '@iarna/toml'
-import { SaveSettingsPayload } from 'lib/settings/settingsTypes'
-import { secrets } from './secrets'
-import {
-  TEST_SETTINGS,
-  TEST_SETTINGS_KEY,
-  TEST_SETTINGS_CORRUPTED,
-  TEST_SETTINGS_ONBOARDING,
-} from './storageStates'
 
 /*
 debug helper: unfortunately we do rely on exact coord mouse clicks in a few places
@@ -26,8 +20,6 @@ const commonPoints = {
   startAt: '[9.06, -12.22]',
   num1: 9.14,
   num2: 18.2,
-  // num1: 9.64,
-  // num2: 19.19,
 }
 
 test.beforeEach(async ({ context, page }) => {
@@ -36,19 +28,24 @@ test.beforeEach(async ({ context, page }) => {
     resources: ['tcp:3000'],
     timeout: 5000,
   })
-
+  await context.addInitScript(async (token) => {
-  await context.addInitScript(
+    localStorage.setItem('TOKEN_PERSIST_KEY', token)
-    async ({ token, settingsKey, settings }) => {
+    localStorage.setItem('persistCode', ``)
-      localStorage.setItem('TOKEN_PERSIST_KEY', token)
+    localStorage.setItem(
-      localStorage.setItem('persistCode', ``)
+      'SETTINGS_PERSIST_KEY',
-      localStorage.setItem(settingsKey, settings)
+      JSON.stringify({
-    },
+        baseUnit: 'in',
-    {
+        cameraControls: 'KittyCAD',
-      token: secrets.token,
+        defaultDirectory: '',
-      settingsKey: TEST_SETTINGS_KEY,
+        defaultProjectName: 'project-$nnn',
-      settings: TOML.stringify({ settings: TEST_SETTINGS }),
+        onboardingStatus: 'dismissed',
-    }
+        showDebugPanel: true,
-  )
+        textWrapping: 'On',
+        theme: 'system',
+        unitSystem: 'imperial',
+      })
+    )
+  }, secrets.token)
   // kill animations, speeds up tests and reduced flakiness
   await page.emulateMedia({ reducedMotion: 'reduce' })
 })
@@ -79,7 +76,6 @@ test('Basic sketch', async ({ page }) => {
   await expect(page.locator('.cm-content')).toHaveText(
     `const part001 = startSketchOn('-XZ')`
   )
-  await u.closeDebugPanel()
 
   await page.waitForTimeout(300) // TODO detect animation ending, or disable animation
 
@@ -90,6 +86,7 @@ test('Basic sketch', async ({ page }) => {
   |> startProfileAt(${commonPoints.startAt}, %)`)
   await page.waitForTimeout(100)
 
+  await u.closeDebugPanel()
   await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 10)
   await page.waitForTimeout(100)
 
@@ -145,7 +142,6 @@ test('Can moving camera', async ({ page, context }) => {
   await page.goto('/')
   await u.waitForAuthSkipAppStart()
   await u.openAndClearDebugPanel()
-  await u.closeKclCodePanel()
 
   const camPos: [number, number, number] = [0, 85, 85]
   const bakeInRetries = async (
@@ -179,8 +175,6 @@ test('Can moving camera', async ({ page, context }) => {
     }, 300)
 
     await u.openAndClearDebugPanel()
-    await page.getByTestId('cam-x-position').isVisible()
-
     const vals = await Promise.all([
       page.getByTestId('cam-x-position').inputValue(),
       page.getByTestId('cam-y-position').inputValue(),
@@ -328,9 +322,9 @@ test('if you write invalid kcl you get inlined errors', async ({ page }) => {
   await expect(page.locator('.cm-lint-marker-error')).not.toBeVisible()
 })
 
-test('executes on load', async ({ page }) => {
+test('executes on load', async ({ page, context }) => {
   const u = getUtils(page)
-  await page.addInitScript(async () => {
+  await context.addInitScript(async () => {
     localStorage.setItem(
       'persistCode',
       `const part001 = startSketchOn('-XZ')
@@ -345,11 +339,7 @@ test('executes on load', async ({ page }) => {
   await u.waitForAuthSkipAppStart()
 
   // expand variables section
-  const variablesTabButton = page.getByRole('tab', {
+  await page.getByText('Variables').click()
-    name: 'Variables',
-    exact: false,
-  })
-  await variablesTabButton.click()
 
   // can find part001 in the variables summary (pretty-json-container, makes sure we're not looking in the code editor)
   // part001 only shows up in the variables summary if it's been executed
@@ -364,20 +354,16 @@ test('executes on load', async ({ page }) => {
   ).toBeVisible()
 })
 
-test('re-executes', async ({ page }) => {
+test('re-executes', async ({ page, context }) => {
   const u = getUtils(page)
-  await page.addInitScript(async () => {
+  await context.addInitScript(async (token) => {
     localStorage.setItem('persistCode', `const myVar = 5`)
   })
   await page.setViewportSize({ width: 1000, height: 500 })
   await page.goto('/')
   await u.waitForAuthSkipAppStart()
 
-  const variablesTabButton = page.getByRole('tab', {
+  await page.getByText('Variables').click()
-    name: 'Variables',
-    exact: false,
-  })
-  await variablesTabButton.click()
   // expect to see "myVar:5"
   await expect(
     page.locator('.pretty-json-container >> text=myVar:5')
@@ -486,18 +472,8 @@ test('Auto complete works', async ({ page }) => {
   const u = getUtils(page)
   // const PUR = 400 / 37.5 //pixeltoUnitRatio
   await page.setViewportSize({ width: 1200, height: 500 })
-  const lspStartPromise = page.waitForEvent('console', async (message) => {
-    // it would be better to wait for a message that the kcl lsp has started by looking for the message  message.text().includes('[lsp] [window/logMessage]')
-    // but that doesn't seem to make it to the console for macos/safari :(
-    if (message.text().includes('start kcl lsp')) {
-      await new Promise((resolve) => setTimeout(resolve, 200))
-      return true
-    }
-    return false
-  })
   await page.goto('/')
   await u.waitForAuthSkipAppStart()
-  await lspStartPromise
 
   // this test might be brittle as we add and remove functions
   // but should also be easy to update.
@@ -510,8 +486,7 @@ test('Auto complete works', async ({ page }) => {
   // expect there to be three auto complete options
   await expect(page.locator('.cm-completionLabel')).toHaveCount(3)
   await page.getByText('startSketchOn').click()
-  await page.keyboard.type("'XY'")
+  await page.keyboard.type("('XY')")
-  await page.keyboard.press('Tab')
   await page.keyboard.press('Enter')
   await page.keyboard.type('  |> startProfi')
   // expect there be a single auto complete option that we can just hit enter on
@@ -519,10 +494,7 @@ test('Auto complete works', async ({ page }) => {
   await page.waitForTimeout(100)
   await page.keyboard.press('Enter') // accepting the auto complete, not a new line
 
-  await page.keyboard.press('Tab')
+  await page.keyboard.type('([0,0], %)')
-  await page.keyboard.press('Tab')
-  await page.keyboard.press('Tab')
-  await page.keyboard.press('Tab')
   await page.keyboard.press('Enter')
   await page.keyboard.type('  |> lin')
 
@@ -533,122 +505,81 @@ test('Auto complete works', async ({ page }) => {
   await page.keyboard.press('ArrowDown')
   await page.keyboard.press('Enter')
   // finish line with comment
-  await page.keyboard.type('5')
+  await page.keyboard.type('(5, %) // lin')
-  await page.keyboard.press('Tab')
-  await page.keyboard.press('Tab')
-  await page.keyboard.type(' // lin')
   await page.waitForTimeout(100)
   // there shouldn't be any auto complete options for 'lin' in the comment
   await expect(page.locator('.cm-completionLabel')).not.toBeVisible()
 
   await expect(page.locator('.cm-content'))
     .toHaveText(`const part001 = startSketchOn('XY')
-  |> startProfileAt([3.14, 3.14], %)
+  |> startProfileAt([0,0], %)
   |> xLine(5, %) // lin`)
 })
 
+// Stored settings validation test
 test('Stored settings are validated and fall back to defaults', async ({
   page,
   context,
 }) => {
-  const u = getUtils(page)
-
   // Override beforeEach test setup
   // with corrupted settings
-  await context.addInitScript(
+  await context.addInitScript(async () => {
-    async ({ settingsKey, settings }) => {
+    const storedSettings = JSON.parse(
-      localStorage.setItem(settingsKey, settings)
+      localStorage.getItem('SETTINGS_PERSIST_KEY') || '{}'
-    },
-    {
-      settingsKey: TEST_SETTINGS_KEY,
-      settings: TOML.stringify({ settings: TEST_SETTINGS_CORRUPTED }),
-    }
-  )
-
-  await page.setViewportSize({ width: 1200, height: 500 })
-  await page.goto('/')
-  await u.waitForAuthSkipAppStart()
-
-  // Check the settings were reset
-  const storedSettings = TOML.parse(
-    await page.evaluate(
-      ({ settingsKey }) => localStorage.getItem(settingsKey) || '{}',
-      { settingsKey: TEST_SETTINGS_KEY }
     )
-  ) as { settings: SaveSettingsPayload }
 
-  expect(storedSettings.settings.app?.theme).toBe('dark')
+    // Corrupt the settings
+    storedSettings.baseUnit = 'invalid'
+    storedSettings.cameraControls = `() => alert('hack the planet')`
+    storedSettings.defaultDirectory = 123
+    storedSettings.defaultProjectName = false
 
-  // Check that the invalid settings were removed
+    localStorage.setItem('SETTINGS_PERSIST_KEY', JSON.stringify(storedSettings))
-  expect(storedSettings.settings.modeling?.defaultUnit).toBe(undefined)
+  })
-  expect(storedSettings.settings.modeling?.mouseControls).toBe(undefined)
-  expect(storedSettings.settings.app?.projectDirectory).toBe(undefined)
-  expect(storedSettings.settings.projects?.defaultProjectName).toBe(undefined)
-})
 
-test('Project settings can be set and override user settings', async ({
-  page,
-}) => {
   await page.setViewportSize({ width: 1200, height: 500 })
   await page.goto('/', { waitUntil: 'domcontentloaded' })
-  await page
-    .getByRole('button', { name: 'Start Sketch' })
-    .waitFor({ state: 'visible' })
-
-  // Open the settings modal with the browser keyboard shortcut
-  await page.keyboard.press('Meta+Shift+,')
 
+  // Check the toast appeared
   await expect(
-    page.getByRole('heading', { name: 'Settings', exact: true })
+    page.getByText(`Error validating persisted settings:`, {
-  ).toBeVisible()
+      exact: false,
-  await page
-    .locator('select[name="app-theme"]')
-    .selectOption({ value: 'light' })
-
-  // Verify the toast appeared
-  await expect(
-    page.getByText(`Set theme to "light" for this project`)
-  ).toBeVisible()
-  // Check that the theme changed
-  await expect(page.locator('body')).not.toHaveClass(`body-bg dark`)
-
-  // Check that the user setting was not changed
-  await page.getByRole('radio', { name: 'User' }).click()
-  await expect(page.locator('select[name="app-theme"]')).toHaveValue('dark')
-
-  // Roll back to default "system" theme
-  await page
-    .getByText(
-      'themeRoll back themeRoll back to match defaultThe overall appearance of the appl'
-    )
-    .hover()
-  await page
-    .getByRole('button', {
-      name: 'Roll back theme ; Has tooltip: Roll back to match default',
     })
-    .click()
+  ).toBeVisible()
-  await expect(page.locator('select[name="app-theme"]')).toHaveValue('system')
 
-  // Check that the project setting did not change
+  // Check the settings were reset
-  await page.getByRole('radio', { name: 'Project' }).click()
+  const storedSettings = JSON.parse(
-  await expect(page.locator('select[name="app-theme"]')).toHaveValue('light')
+    await page.evaluate(
+      () => localStorage.getItem('SETTINGS_PERSIST_KEY') || '{}'
+    )
+  )
+  await expect(storedSettings.baseUnit).toBe(initialSettings.baseUnit)
+  await expect(storedSettings.cameraControls).toBe(
+    initialSettings.cameraControls
+  )
+  await expect(storedSettings.defaultDirectory).toBe(
+    initialSettings.defaultDirectory
+  )
+  await expect(storedSettings.defaultProjectName).toBe(
+    initialSettings.defaultProjectName
+  )
 })
 
-test('Onboarding redirects and code updating', async ({ page }) => {
+// Onboarding tests
+test('Onboarding redirects and code updating', async ({ page, context }) => {
   const u = getUtils(page)
 
   // Override beforeEach test setup
-  await page.addInitScript(
+  await context.addInitScript(async () => {
-    async ({ settingsKey, settings }) => {
+    // Give some initial code, so we can test that it's cleared
-      // Give some initial code, so we can test that it's cleared
+    localStorage.setItem('persistCode', 'const sigmaAllow = 15000')
-      localStorage.setItem('persistCode', 'const sigmaAllow = 15000')
+
-      localStorage.setItem(settingsKey, settings)
+    const storedSettings = JSON.parse(
-    },
+      localStorage.getItem('SETTINGS_PERSIST_KEY') || '{}'
-    {
+    )
-      settingsKey: TEST_SETTINGS_KEY,
+    storedSettings.onboardingStatus = '/export'
-      settings: TOML.stringify({ settings: TEST_SETTINGS_ONBOARDING }),
+    localStorage.setItem('SETTINGS_PERSIST_KEY', JSON.stringify(storedSettings))
-    }
+  })
-  )
 
   await page.setViewportSize({ width: 1200, height: 500 })
   await page.goto('/')
@@ -656,13 +587,13 @@ test('Onboarding redirects and code updating', async ({ page }) => {
 
   // Test that the redirect happened
   await expect(page.url().split(':3000').slice(-1)[0]).toBe(
-    `/file/%2Fbrowser%2Fmain.kcl/onboarding/export`
+    `/file/new/onboarding/export`
   )
 
   // Test that you come back to this page when you refresh
   await page.reload()
   await expect(page.url().split(':3000').slice(-1)[0]).toBe(
-    `/file/%2Fbrowser%2Fmain.kcl/onboarding/export`
+    `/file/new/onboarding/export`
   )
 
   // Test that the onboarding pane loaded
@@ -694,7 +625,7 @@ test('Selections work on fresh and edited sketch', async ({ page }) => {
   const emptySpaceClick = () =>
     page.mouse.click(728, 343).then(() => page.waitForTimeout(100))
   const topHorzSegmentClick = () =>
-    page.mouse.click(709, 290).then(() => page.waitForTimeout(100))
+    page.mouse.click(709, 289).then(() => page.waitForTimeout(100))
   const bottomHorzSegmentClick = () =>
     page.mouse.click(767, 396).then(() => page.waitForTimeout(100))
 
@@ -709,12 +640,13 @@ test('Selections work on fresh and edited sketch', async ({ page }) => {
   await page.waitForTimeout(700) // wait for animation
 
   const startXPx = 600
-  await u.closeDebugPanel()
   await page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10)
   await expect(page.locator('.cm-content'))
     .toHaveText(`const part001 = startSketchOn('-XZ')
   |> startProfileAt(${commonPoints.startAt}, %)`)
 
+  await u.closeDebugPanel()
+
   await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 10)
 
   await expect(page.locator('.cm-content'))
@@ -795,18 +727,13 @@ test('Selections work on fresh and edited sketch', async ({ page }) => {
     await emptySpaceClick()
 
     // select segment in editor than another segment in scene and check there are two cursors
-    // TODO change this back to shift click in the scene, not cmd click in the editor
-    await bottomHorzSegmentClick()
-
-    await expect(page.locator('.cm-cursor')).toHaveCount(1)
-
-    await page.keyboard.down(process.platform === 'linux' ? 'Control' : 'Meta')
-    await page.waitForTimeout(100)
     await page.getByText(`  |> line([-${commonPoints.num2}, 0], %)`).click()
-
+    await page.waitForTimeout(300)
+    await page.keyboard.down('Shift')
+    await expect(page.locator('.cm-cursor')).toHaveCount(1)
+    await bottomHorzSegmentClick()
+    await page.keyboard.up('Shift')
     await expect(page.locator('.cm-cursor')).toHaveCount(2)
-    await page.waitForTimeout(500)
-    await page.keyboard.up(process.platform === 'linux' ? 'Control' : 'Meta')
 
     // clear selection by clicking on nothing
     await emptySpaceClick()
@@ -836,136 +763,129 @@ test('Selections work on fresh and edited sketch', async ({ page }) => {
   await selectionSequence()
 })
 
-test.describe('Command bar tests', () => {
+test('Command bar works and can change a setting', async ({ page }) => {
-  test('Command bar works and can change a setting', async ({ page }) => {
+  // Brief boilerplate
-    // Brief boilerplate
+  const u = getUtils(page)
-    await page.setViewportSize({ width: 1200, height: 500 })
+  await page.setViewportSize({ width: 1200, height: 500 })
-    await page.goto('/', { waitUntil: 'domcontentloaded' })
+  await page.goto('/')
+  await u.waitForAuthSkipAppStart()
 
-    let cmdSearchBar = page.getByPlaceholder('Search commands')
+  let cmdSearchBar = page.getByPlaceholder('Search commands')
 
-    // First try opening the command bar and closing it
+  // First try opening the command bar and closing it
-    // It has a different label on mac and windows/linux, "Meta+K" and "Ctrl+/" respectively
+  // It has a different label on mac and windows/linux, "Meta+K" and "Ctrl+/" respectively
-    await page
+  await page
-      .getByRole('button', { name: 'Ctrl+/' })
+    .getByRole('button', { name: 'Ctrl+/' })
-      .or(page.getByRole('button', { name: '⌘K' }))
+    .or(page.getByRole('button', { name: '⌘K' }))
-      .click()
+    .click()
-    await expect(cmdSearchBar).toBeVisible()
+  await expect(cmdSearchBar).toBeVisible()
-    await page.keyboard.press('Escape')
+  await page.keyboard.press('Escape')
-    await expect(cmdSearchBar).not.toBeVisible()
+  await expect(cmdSearchBar).not.toBeVisible()
 
-    // Now try the same, but with the keyboard shortcut, check focus
+  // Now try the same, but with the keyboard shortcut, check focus
-    await page.keyboard.press('Meta+K')
+  await page.keyboard.press('Meta+K')
-    await expect(cmdSearchBar).toBeVisible()
+  await expect(cmdSearchBar).toBeVisible()
-    await expect(cmdSearchBar).toBeFocused()
+  await expect(cmdSearchBar).toBeFocused()
 
-    // Try typing in the command bar
+  // Try typing in the command bar
-    await page.keyboard.type('theme')
+  await page.keyboard.type('theme')
-    const themeOption = page.getByRole('option', {
+  const themeOption = page.getByRole('option', { name: 'Set Theme' })
-      name: 'Settings · app · theme',
+  await expect(themeOption).toBeVisible()
-    })
+  await themeOption.click()
-    await expect(themeOption).toBeVisible()
+  const themeInput = page.getByPlaceholder('system')
-    await themeOption.click()
+  await expect(themeInput).toBeVisible()
-    const themeInput = page.getByPlaceholder('Select an option')
+  await expect(themeInput).toBeFocused()
-    await expect(themeInput).toBeVisible()
+  // Select dark theme
-    await expect(themeInput).toBeFocused()
+  await page.keyboard.press('ArrowDown')
-    // Select dark theme
+  await page.keyboard.press('ArrowUp')
-    await page.keyboard.press('ArrowDown')
+  await expect(page.getByRole('option', { name: Themes.Dark })).toHaveAttribute(
-    await page.keyboard.press('ArrowDown')
+    'data-headlessui-state',
-    await page.keyboard.press('ArrowDown')
+    'active'
-    await expect(page.getByRole('option', { name: 'system' })).toHaveAttribute(
+  )
-      'data-headlessui-state',
+  await page.keyboard.press('Enter')
-      'active'
+
+  // Check the toast appeared
+  await expect(page.getByText(`Set Theme to "${Themes.Dark}"`)).toBeVisible()
+  // Check that the theme changed
+  await expect(page.locator('body')).toHaveClass(`body-bg ${Themes.Dark}`)
+})
+
+test('Can extrude from the command bar', async ({ page, context }) => {
+  await context.addInitScript(async (token) => {
+    localStorage.setItem(
+      'persistCode',
+      `
+      const distance = sqrt(20)
+      const part001 = startSketchOn('-XZ')
+        |> startProfileAt([-6.95, 4.98], %)
+        |> line([25.1, 0.41], %)
+        |> line([0.73, -14.93], %)
+        |> line([-23.44, 0.52], %)
+        |> close(%)
+      `
     )
-    await page.keyboard.press('Enter')
-
-    // Check the toast appeared
-    await expect(
-      page.getByText(`Set theme to "system" for this project`)
-    ).toBeVisible()
-    // Check that the theme changed
-    await expect(page.locator('body')).not.toHaveClass(`body-bg dark`)
   })
 
-  test('Can extrude from the command bar', async ({ page }) => {
+  const u = getUtils(page)
-    await page.addInitScript(async () => {
+  await page.setViewportSize({ width: 1200, height: 500 })
-      localStorage.setItem(
+  await page.goto('/')
-        'persistCode',
+  await u.waitForAuthSkipAppStart()
-        `const distance = sqrt(20)
+  await u.openDebugPanel()
-        const part001 = startSketchOn('-XZ')
+  await u.expectCmdLog('[data-message-type="execution-done"]')
+
+  let cmdSearchBar = page.getByPlaceholder('Search commands')
+  await page.keyboard.press('Meta+K')
+  await expect(cmdSearchBar).toBeVisible()
+
+  // Search for extrude command and choose it
+  await page.getByRole('option', { name: 'Extrude' }).click()
+  await expect(page.locator('#arg-form > label')).toContainText(
+    'Please select one face'
+  )
+  await expect(page.getByRole('button', { name: 'selection' })).toBeDisabled()
+
+  // Click to select face and set distance
+  await page.getByText('|> startProfileAt([-6.95, 4.98], %)').click()
+  await page.getByRole('button', { name: 'Continue' }).click()
+
+  // Assert that we're on the distance step
+  await expect(page.getByRole('button', { name: 'distance' })).toBeDisabled()
+
+  // Assert that the an alternative variable name is chosen,
+  // since the default variable name is already in use (distance)
+  await page.getByRole('button', { name: 'Create new variable' }).click()
+  await expect(page.getByPlaceholder('Variable name')).toHaveValue(
+    'distance001'
+  )
+  await expect(page.getByRole('button', { name: 'Continue' })).toBeEnabled()
+  await page.getByRole('button', { name: 'Continue' }).click()
+
+  // Review step and argument hotkeys
+  await expect(
+    page.getByRole('button', { name: 'Submit command' })
+  ).toBeEnabled()
+  await page.keyboard.press('Backspace')
+  await expect(
+    page.getByRole('button', { name: 'Distance 12', exact: false })
+  ).toBeDisabled()
+  await page.keyboard.press('Enter')
+
+  await expect(page.getByText('Confirm Extrude')).toBeVisible()
+
+  // Check that the code was updated
+  await page.keyboard.press('Enter')
+  // Unfortunately this indentation seems to matter for the test
+  await expect(page.locator('.cm-content')).toHaveText(
+    `const distance = sqrt(20)
+const distance001 = 5 + 7
+const part001 = startSketchOn('-XZ')
   |> startProfileAt([-6.95, 4.98], %)
   |> line([25.1, 0.41], %)
   |> line([0.73, -14.93], %)
   |> line([-23.44, 0.52], %)
   |> close(%)
-        `
+  |> extrude(distance001, %)`.replace(/(\r\n|\n|\r)/gm, '') // remove newlines
-      )
+  )
-    })
-
-    const u = getUtils(page)
-    await page.setViewportSize({ width: 1200, height: 500 })
-    await page.goto('/')
-    await u.waitForAuthSkipAppStart()
-
-    // Make sure the stream is up
-    await u.openDebugPanel()
-    await u.expectCmdLog('[data-message-type="execution-done"]')
-
-    await expect(
-      page.getByRole('button', { name: 'Start Sketch' })
-    ).not.toBeDisabled()
-    await u.clearCommandLogs()
-    await page.getByText('|> line([0.73, -14.93], %)').click()
-    await page.getByRole('button', { name: 'Extrude' }).isEnabled()
-
-    let cmdSearchBar = page.getByPlaceholder('Search commands')
-    await page.keyboard.press('Meta+K')
-    await expect(cmdSearchBar).toBeVisible()
-
-    // Search for extrude command and choose it
-    await page.getByRole('option', { name: 'Extrude' }).click()
-
-    // Assert that we're on the distance step
-    await expect(page.getByRole('button', { name: 'distance' })).toBeDisabled()
-
-    // Assert that the an alternative variable name is chosen,
-    // since the default variable name is already in use (distance)
-    await page.getByRole('button', { name: 'Create new variable' }).click()
-    await expect(page.getByPlaceholder('Variable name')).toHaveValue(
-      'distance001'
-    )
-
-    const continueButton = page.getByRole('button', { name: 'Continue' })
-    const submitButton = page.getByRole('button', { name: 'Submit command' })
-    await continueButton.click()
-
-    // Review step and argument hotkeys
-    await expect(submitButton).toBeEnabled()
-    await page.keyboard.press('Backspace')
-
-    // Assert we're back on the distance step
-    await expect(
-      page.getByRole('button', { name: 'Distance 12', exact: false })
-    ).toBeDisabled()
-
-    await continueButton.click()
-    await submitButton.click()
-
-    // Check that the code was updated
-    await u.waitForCmdReceive('extrude')
-    // Unfortunately this indentation seems to matter for the test
-    await expect(page.locator('.cm-content')).toHaveText(
-      `const distance = sqrt(20)
-const distance001 = 5 + 7
-const part001 = startSketchOn('-XZ')
-    |> startProfileAt([-6.95, 4.98], %)
-    |> line([25.1, 0.41], %)
-    |> line([0.73, -14.93], %)
-    |> line([-23.44, 0.52], %)
-    |> close(%)
-    |> extrude(distance001, %)`.replace(/(\r\n|\n|\r)/gm, '') // remove newlines
-    )
-  })
 })
 
 test('Can add multiple sketches', async ({ page }) => {
@@ -998,13 +918,13 @@ test('Can add multiple sketches', async ({ page }) => {
   await page.waitForTimeout(500) // TODO detect animation ending, or disable animation
 
   const startXPx = 600
-  await u.closeDebugPanel()
   await page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10)
   await expect(page.locator('.cm-content'))
     .toHaveText(`const part001 = startSketchOn('-XZ')
   |> startProfileAt(${commonPoints.startAt}, %)`)
   await page.waitForTimeout(100)
 
+  await u.closeDebugPanel()
   await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 10)
   await page.waitForTimeout(100)
 
@@ -1093,9 +1013,9 @@ const part002 = startSketchOn('XY')
   )
 })
 
-test('ProgramMemory can be serialised', async ({ page }) => {
+test('ProgramMemory can be serialised', async ({ page, context }) => {
   const u = getUtils(page)
-  await page.addInitScript(async () => {
+  await context.addInitScript(async () => {
     localStorage.setItem(
       'persistCode',
       `const part = startSketchOn('XY')
@@ -1105,7 +1025,7 @@ test('ProgramMemory can be serialised', async ({ page }) => {
   |> line([0, -1], %)
   |> close(%)
   |> extrude(1, %)
-  |> patternLinear3d({
+  |> patternLinear({
         axis: [1, 0, 1],
         repetitions: 3,
         distance: 6
@@ -1134,6 +1054,7 @@ test('ProgramMemory can be serialised', async ({ page }) => {
 
 test("Various pipe expressions should and shouldn't allow edit and or extrude", async ({
   page,
+  context,
 }) => {
   const u = getUtils(page)
   const selectionsSnippets = {
@@ -1142,7 +1063,7 @@ test("Various pipe expressions should and shouldn't allow edit and or extrude",
     extrudeAndEditAllowed: '|> startProfileAt([15.72, 4.7], %)',
     editOnly: '|> startProfileAt([15.79, -14.6], %)',
   }
-  await page.addInitScript(
+  await context.addInitScript(
     async ({
       extrudeAndEditBlocked,
       extrudeAndEditBlockedInFunction,
@@ -1175,11 +1096,11 @@ const part003 = startSketchOn('-XZ')
 
 fn yohey = (pos) => {
   const part004 = startSketchOn('-XZ')
-    ${extrudeAndEditBlockedInFunction}
+  ${extrudeAndEditBlockedInFunction}
-    |> line([27.55, -1.65], %)
+  |> line([27.55, -1.65], %)
-    |> line([4.95, -10.53], %)
+  |> line([4.95, -10.53], %)
-    |> line([-20.38, -8], %)
+  |> line([-20.38, -8], %)
-    |> line([-15.79, 17.08], %)
+  |> line([-15.79, 17.08], %)
   return ''
 }
 
@@ -1189,7 +1110,7 @@ fn yohey = (pos) => {
     },
     selectionsSnippets
   )
-  await page.setViewportSize({ width: 1200, height: 1000 })
+  await page.setViewportSize({ width: 1200, height: 500 })
   await page.goto('/')
   await u.waitForAuthSkipAppStart()
 
@@ -1302,9 +1223,12 @@ test('Deselecting line tool should mean nothing happens on click', async ({
   previousCodeContent = await page.locator('.cm-content').innerText()
 })
 
-test('Can edit segments by dragging their handles', async ({ page }) => {
+test('Can edit segments by dragging their handles', async ({
+  page,
+  context,
+}) => {
   const u = getUtils(page)
-  await page.addInitScript(async () => {
+  await context.addInitScript(async () => {
     localStorage.setItem(
       'persistCode',
       `const part001 = startSketchOn('-XZ')
@@ -1448,138 +1372,10 @@ test('Snap to close works (at any scale)', async ({ page }) => {
   ) => `const part001 = startSketchOn('XZ')
 |> startProfileAt([${roundOff(scale * 87.68)}, ${roundOff(scale * 43.84)}], %)
 |> line([${roundOff(scale * 175.36)}, 0], %)
-|> line([0, -${roundOff(scale * 175.36) + fudge}], %)
+|> line([0, -${roundOff(scale * 175.37) + fudge}], %)
 |> close(%)`
 
   await doSnapAtDifferentScales([0, 100, 100], codeTemplate(0.01, 0.01))
 
   await doSnapAtDifferentScales([0, 10000, 10000], codeTemplate())
 })
-
-test('Sketch on face', async ({ page }) => {
-  const u = getUtils(page)
-  await page.addInitScript(async () => {
-    localStorage.setItem(
-      'persistCode',
-      `const part001 = startSketchOn('-XZ')
-  |> startProfileAt([3.29, 7.86], %)
-  |> line([2.48, 2.44], %)
-  |> line([2.66, 1.17], %)
-  |> line([3.75, 0.46], %)
-  |> line([4.99, -0.46], %)
-  |> line([3.3, -2.12], %)
-  |> line([2.16, -3.33], %)
-  |> line([0.85, -3.08], %)
-  |> line([-0.18, -3.36], %)
-  |> line([-3.86, -2.73], %)
-  |> line([-17.67, 0.85], %)
-  |> close(%)
-  |> extrude(5 + 7, %)`
-    )
-  })
-
-  await page.setViewportSize({ width: 1200, height: 500 })
-  await page.goto('/')
-  await u.waitForAuthSkipAppStart()
-  await expect(
-    page.getByRole('button', { name: 'Start Sketch' })
-  ).not.toBeDisabled()
-
-  await page.getByRole('button', { name: 'Start Sketch' }).click()
-
-  let previousCodeContent = await page.locator('.cm-content').innerText()
-
-  await page.mouse.click(793, 133)
-
-  const firstClickPosition = [612, 238]
-  const secondClickPosition = [661, 242]
-  const thirdClickPosition = [609, 267]
-
-  await page.waitForTimeout(300)
-
-  await page.mouse.click(firstClickPosition[0], firstClickPosition[1])
-  await expect(page.locator('.cm-content')).not.toHaveText(previousCodeContent)
-  previousCodeContent = await page.locator('.cm-content').innerText()
-
-  await page.mouse.click(secondClickPosition[0], secondClickPosition[1])
-  await expect(page.locator('.cm-content')).not.toHaveText(previousCodeContent)
-  previousCodeContent = await page.locator('.cm-content').innerText()
-
-  await page.mouse.click(thirdClickPosition[0], thirdClickPosition[1])
-  await expect(page.locator('.cm-content')).not.toHaveText(previousCodeContent)
-  previousCodeContent = await page.locator('.cm-content').innerText()
-
-  await page.mouse.click(firstClickPosition[0], firstClickPosition[1])
-  await expect(page.locator('.cm-content')).not.toHaveText(previousCodeContent)
-  previousCodeContent = await page.locator('.cm-content').innerText()
-
-  await expect(page.locator('.cm-content'))
-    .toContainText(`const part002 = startSketchOn(part001, 'seg01')
-  |> startProfileAt([1.03, 1.03], %)
-  |> line([4.18, -0.35], %)
-  |> line([-4.44, -2.13], %)
-  |> close(%)`)
-
-  await u.openAndClearDebugPanel()
-  await page.getByRole('button', { name: 'Exit Sketch' }).click()
-  await u.expectCmdLog('[data-message-type="execution-done"]')
-
-  await u.updateCamPosition([1049, 239, 686])
-  await u.closeDebugPanel()
-
-  await page.getByText('startProfileAt([1.03, 1.03], %)').click()
-  await expect(page.getByRole('button', { name: 'Edit Sketch' })).toBeVisible()
-  await page.getByRole('button', { name: 'Edit Sketch' }).click()
-  await page.setViewportSize({ width: 1200, height: 1200 })
-  await u.openAndClearDebugPanel()
-  await u.updateCamPosition([452, -152, 1166])
-  await u.closeDebugPanel()
-  await page.waitForTimeout(200)
-
-  const pointToDragFirst = [787, 565]
-  await page.mouse.move(pointToDragFirst[0], pointToDragFirst[1])
-  await page.mouse.down()
-  await page.mouse.move(pointToDragFirst[0] - 20, pointToDragFirst[1], {
-    steps: 5,
-  })
-  await page.mouse.up()
-  await page.waitForTimeout(100)
-  await expect(page.locator('.cm-content')).not.toHaveText(previousCodeContent)
-  previousCodeContent = await page.locator('.cm-content').innerText()
-
-  await expect(page.locator('.cm-content'))
-    .toContainText(`const part002 = startSketchOn(part001, 'seg01')
-|> startProfileAt([1.03, 1.03], %)
-|> line([${process?.env?.CI ? 2.74 : 2.93}, -${
-    process?.env?.CI ? 0.24 : 0.2
-  }], %)
-|> line([-4.44, -2.13], %)
-|> close(%)`)
-
-  // exit sketch
-  await u.openAndClearDebugPanel()
-  await page.getByRole('button', { name: 'Exit Sketch' }).click()
-  await u.expectCmdLog('[data-message-type="execution-done"]')
-
-  await page.getByText('startProfileAt([1.03, 1.03], %)').click()
-
-  await expect(page.getByRole('button', { name: 'Extrude' })).not.toBeDisabled()
-  await page.getByRole('button', { name: 'Extrude' }).click()
-
-  await expect(page.getByTestId('command-bar')).toBeVisible()
-  await page.waitForTimeout(100)
-
-  await page.keyboard.press('Enter')
-  await expect(page.getByText('Confirm Extrude')).toBeVisible()
-  await page.keyboard.press('Enter')
-
-  await expect(page.locator('.cm-content'))
-    .toContainText(`const part002 = startSketchOn(part001, 'seg01')
-|> startProfileAt([1.03, 1.03], %)
-|> line([${process?.env?.CI ? 2.74 : 2.93}, -${
-    process?.env?.CI ? 0.24 : 0.2
-  }], %)
-|> line([-4.44, -2.13], %)
-|> close(%)
-|> extrude(5 + 7, %)`)
-})

e2e/playwright/snapshot-tests.spec.ts

@@ -7,26 +7,28 @@ import { spawn } from 'child_process'
 import { APP_NAME } from 'lib/constants'
 import JSZip from 'jszip'
 import path from 'path'
-import { TEST_SETTINGS, TEST_SETTINGS_KEY } from './storageStates'
-import * as TOML from '@iarna/toml'
 
-test.beforeEach(async ({ page }) => {
+test.beforeEach(async ({ context, page }) => {
+  await context.addInitScript(async (token) => {
+    localStorage.setItem('TOKEN_PERSIST_KEY', token)
+    localStorage.setItem('persistCode', ``)
+    localStorage.setItem(
+      'SETTINGS_PERSIST_KEY',
+      JSON.stringify({
+        baseUnit: 'in',
+        cameraControls: 'KittyCAD',
+        defaultDirectory: '',
+        defaultProjectName: 'project-$nnn',
+        onboardingStatus: 'dismissed',
+        showDebugPanel: true,
+        textWrapping: 'On',
+        theme: 'system',
+        unitSystem: 'imperial',
+      })
+    )
+  }, secrets.token)
   // reducedMotion kills animations, which speeds up tests and reduces flakiness
   await page.emulateMedia({ reducedMotion: 'reduce' })
-
-  // set the default settings
-  await page.addInitScript(
-    async ({ token, settingsKey, settings }) => {
-      localStorage.setItem('TOKEN_PERSIST_KEY', token)
-      localStorage.setItem('persistCode', ``)
-      localStorage.setItem(settingsKey, settings)
-    },
-    {
-      token: secrets.token,
-      settingsKey: TEST_SETTINGS_KEY,
-      settings: TOML.stringify({ settings: TEST_SETTINGS }),
-    }
-  )
 })
 
 test.setTimeout(60_000)
@@ -35,7 +37,7 @@ test('exports of each format should work', async ({ page, context }) => {
   // FYI this test doesn't work with only engine running locally
   // And you will need to have the KittyCAD CLI installed
   const u = getUtils(page)
-  await page.addInitScript(async () => {
+  await context.addInitScript(async () => {
     ;(window as any).playwrightSkipFilePicker = true
     localStorage.setItem(
       'persistCode',
@@ -79,7 +81,6 @@ const part001 = startSketchOn('-XZ')
   |> extrude(4, %)`
     )
   })
-
   await page.setViewportSize({ width: 1200, height: 500 })
   await page.goto('/')
   await u.waitForAuthSkipAppStart()
@@ -331,22 +332,6 @@ test('extrude on each default plane should be stable', async ({
   page,
   context,
 }) => {
-  await context.addInitScript(async () => {
-    localStorage.setItem(
-      'SETTINGS_PERSIST_KEY',
-      JSON.stringify({
-        baseUnit: 'in',
-        cameraControls: 'KittyCAD',
-        defaultDirectory: '',
-        defaultProjectName: 'project-$nnn',
-        onboardingStatus: 'dismissed',
-        showDebugPanel: true,
-        textWrapping: 'On',
-        theme: 'dark',
-        unitSystem: 'imperial',
-      })
-    )
-  })
   const u = getUtils(page)
   const makeCode = (plane = 'XY') => `const part001 = startSketchOn('${plane}')
   |> startProfileAt([7.00, 4.40], %)
@@ -368,28 +353,29 @@ test('extrude on each default plane should be stable', async ({
   await u.openDebugPanel()
   await u.expectCmdLog('[data-message-type="execution-done"]')
   await u.clearAndCloseDebugPanel()
-  await page.waitForTimeout(200)
+
+  await page.getByText('Code').click()
+  await expect(page).toHaveScreenshot({
+    maxDiffPixels: 100,
+  })
+  await page.getByText('Code').click()
 
   const runSnapshotsForOtherPlanes = async (plane = 'XY') => {
     // clear code
     await u.removeCurrentCode()
     // add makeCode('XZ')
-    await u.openAndClearDebugPanel()
+    await page.locator('.cm-content').fill(makeCode(plane))
-    await u.doAndWaitForImageDiff(
-      () => page.locator('.cm-content').fill(makeCode(plane)),
-      200
-    )
     // wait for execution done
+    await u.openDebugPanel()
     await u.expectCmdLog('[data-message-type="execution-done"]')
     await u.clearAndCloseDebugPanel()
 
-    await u.closeKclCodePanel()
+    await page.getByText('Code').click()
     await expect(page).toHaveScreenshot({
       maxDiffPixels: 100,
     })
-    await u.openKclCodePanel()
+    await page.getByText('Code').click()
   }
-  await runSnapshotsForOtherPlanes('XY')
   await runSnapshotsForOtherPlanes('-XY')
 
   await runSnapshotsForOtherPlanes('XZ')
@@ -400,6 +386,22 @@ test('extrude on each default plane should be stable', async ({
 })
 
 test('Draft segments should look right', async ({ page, context }) => {
+  await context.addInitScript(async () => {
+    localStorage.setItem(
+      'SETTINGS_PERSIST_KEY',
+      JSON.stringify({
+        baseUnit: 'in',
+        cameraControls: 'KittyCAD',
+        defaultDirectory: '',
+        defaultProjectName: 'project-$nnn',
+        onboardingStatus: 'dismissed',
+        showDebugPanel: true,
+        textWrapping: 'On',
+        theme: 'system',
+        unitSystem: 'imperial',
+      })
+    )
+  })
   const u = getUtils(page)
   await page.setViewportSize({ width: 1200, height: 500 })
   const PUR = 400 / 37.5 //pixeltoUnitRatio
@@ -458,241 +460,200 @@ test('Draft segments should look right', async ({ page, context }) => {
   })
 })
 
-test.describe('Client side scene scale should match engine scale', () => {
+test('Client side scene scale should match engine scale inch', async ({
-  test('Inch scale', async ({ page }) => {
+  page,
-    const u = getUtils(page)
+  context,
-    await page.setViewportSize({ width: 1200, height: 500 })
+}) => {
-    const PUR = 400 / 37.5 //pixeltoUnitRatio
-    await page.goto('/')
-    await u.waitForAuthSkipAppStart()
-    await u.openDebugPanel()
-
-    await expect(
-      page.getByRole('button', { name: 'Start Sketch' })
-    ).not.toBeDisabled()
-    await expect(
-      page.getByRole('button', { name: 'Start Sketch' })
-    ).toBeVisible()
-
-    // click on "Start Sketch" button
-    await u.clearCommandLogs()
-    await u.doAndWaitForImageDiff(
-      () => page.getByRole('button', { name: 'Start Sketch' }).click(),
-      200
-    )
-
-    // select a plane
-    await page.mouse.click(700, 200)
-
-    await expect(page.locator('.cm-content')).toHaveText(
-      `const part001 = startSketchOn('-XZ')`
-    )
-
-    await page.waitForTimeout(300) // TODO detect animation ending, or disable animation
-
-    const startXPx = 600
-    await page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10)
-    await expect(page.locator('.cm-content'))
-      .toHaveText(`const part001 = startSketchOn('-XZ')
-    |> startProfileAt([9.06, -12.22], %)`)
-    await page.waitForTimeout(100)
-
-    await u.closeDebugPanel()
-
-    await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 10)
-    await page.waitForTimeout(100)
-
-    await expect(page.locator('.cm-content'))
-      .toHaveText(`const part001 = startSketchOn('-XZ')
-    |> startProfileAt([9.06, -12.22], %)
-    |> line([9.14, 0], %)`)
-
-    await page.getByRole('button', { name: 'Tangential Arc' }).click()
-    await page.waitForTimeout(100)
-
-    await page.mouse.click(startXPx + PUR * 30, 500 - PUR * 20)
-
-    await expect(page.locator('.cm-content'))
-      .toHaveText(`const part001 = startSketchOn('-XZ')
-    |> startProfileAt([9.06, -12.22], %)
-    |> line([9.14, 0], %)
-    |> tangentialArcTo([27.34, -3.08], %)`)
-
-    // click tangential arc tool again to unequip it
-    await page.getByRole('button', { name: 'Tangential Arc' }).click()
-    await page.waitForTimeout(100)
-
-    // screen shot should show the sketch
-    await expect(page).toHaveScreenshot({
-      maxDiffPixels: 100,
-    })
-
-    // exit sketch
-    await u.openAndClearDebugPanel()
-    await page.getByRole('button', { name: 'Exit Sketch' }).click()
-
-    // wait for execution done
-    await u.expectCmdLog('[data-message-type="execution-done"]')
-    await u.clearAndCloseDebugPanel()
-    await page.waitForTimeout(200)
-
-    // second screen shot should look almost identical, i.e. scale should be the same.
-    await expect(page).toHaveScreenshot({
-      maxDiffPixels: 100,
-    })
-  })
-
-  test('Millimeter scale', async ({ page }) => {
-    await page.addInitScript(
-      async ({ settingsKey, settings }) => {
-        localStorage.setItem(settingsKey, settings)
-      },
-      {
-        settingsKey: TEST_SETTINGS_KEY,
-        settings: TOML.stringify({
-          settings: {
-            ...TEST_SETTINGS,
-            modeling: {
-              ...TEST_SETTINGS.modeling,
-              defaultUnit: 'mm',
-            },
-          },
-        }),
-      }
-    )
-    const u = getUtils(page)
-    await page.setViewportSize({ width: 1200, height: 500 })
-    const PUR = 400 / 37.5 //pixeltoUnitRatio
-    await page.goto('/')
-    await u.waitForAuthSkipAppStart()
-    await u.openDebugPanel()
-
-    await expect(
-      page.getByRole('button', { name: 'Start Sketch' })
-    ).not.toBeDisabled()
-    await expect(
-      page.getByRole('button', { name: 'Start Sketch' })
-    ).toBeVisible()
-
-    // click on "Start Sketch" button
-    await u.clearCommandLogs()
-    await u.doAndWaitForImageDiff(
-      () => page.getByRole('button', { name: 'Start Sketch' }).click(),
-      200
-    )
-
-    // select a plane
-    await page.mouse.click(700, 200)
-
-    await expect(page.locator('.cm-content')).toHaveText(
-      `const part001 = startSketchOn('-XZ')`
-    )
-
-    await page.waitForTimeout(300) // TODO detect animation ending, or disable animation
-
-    const startXPx = 600
-    await page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10)
-    await expect(page.locator('.cm-content'))
-      .toHaveText(`const part001 = startSketchOn('-XZ')
-      |> startProfileAt([230.03, -310.32], %)`)
-    await page.waitForTimeout(100)
-
-    await u.closeDebugPanel()
-
-    await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 10)
-    await page.waitForTimeout(100)
-
-    await expect(page.locator('.cm-content'))
-      .toHaveText(`const part001 = startSketchOn('-XZ')
-      |> startProfileAt([230.03, -310.32], %)
-      |> line([232.2, 0], %)`)
-
-    await page.getByRole('button', { name: 'Tangential Arc' }).click()
-    await page.waitForTimeout(100)
-
-    await page.mouse.click(startXPx + PUR * 30, 500 - PUR * 20)
-
-    await expect(page.locator('.cm-content'))
-      .toHaveText(`const part001 = startSketchOn('-XZ')
-      |> startProfileAt([230.03, -310.32], %)
-      |> line([232.2, 0], %)
-      |> tangentialArcTo([694.43, -78.12], %)`)
-
-    await page.getByRole('button', { name: 'Tangential Arc' }).click()
-    await page.waitForTimeout(100)
-
-    // screen shot should show the sketch
-    await expect(page).toHaveScreenshot({
-      maxDiffPixels: 100,
-    })
-
-    // exit sketch
-    await u.openAndClearDebugPanel()
-    await page.getByRole('button', { name: 'Exit Sketch' }).click()
-
-    // wait for execution done
-    await u.expectCmdLog('[data-message-type="execution-done"]')
-    await u.clearAndCloseDebugPanel()
-    await page.waitForTimeout(200)
-
-    // second screen shot should look almost identical, i.e. scale should be the same.
-    await expect(page).toHaveScreenshot({
-      maxDiffPixels: 100,
-    })
-  })
-})
-
-test('Sketch on face with none z-up', async ({ page, context }) => {
-  const u = getUtils(page)
   await context.addInitScript(async () => {
     localStorage.setItem(
-      'persistCode',
+      'SETTINGS_PERSIST_KEY',
-      `const part001 = startSketchOn('-XZ')
+      JSON.stringify({
-  |> startProfileAt([1.4, 2.47], %)
+        baseUnit: 'in',
-  |> line([9.31, 10.55], %, 'seg01')
+        cameraControls: 'KittyCAD',
-  |> line([11.91, -10.42], %)
+        defaultDirectory: '',
-  |> close(%)
+        defaultProjectName: 'project-$nnn',
-  |> extrude(5 + 7, %)
+        onboardingStatus: 'dismissed',
-const part002 = startSketchOn(part001, 'seg01')
+        showDebugPanel: true,
-  |> startProfileAt([8, 8], %)
+        textWrapping: 'On',
-  |> line([4.68, 3.05], %)
+        theme: 'system',
-  |> line([0, -7.79], %, 'seg02')
+        unitSystem: 'imperial',
-  |> close(%)
+      })
-  |> extrude(5 + 7, %)
-`
     )
   })
-
+  const u = getUtils(page)
   await page.setViewportSize({ width: 1200, height: 500 })
+  const PUR = 400 / 37.5 //pixeltoUnitRatio
   await page.goto('/')
   await u.waitForAuthSkipAppStart()
-
   await u.openDebugPanel()
-  // wait for execution done
-  await expect(
-    page.locator('[data-message-type="execution-done"]')
-  ).toHaveCount(2)
-  await u.closeDebugPanel()
-
-  // Wait for the second extrusion to appear
-  // TODO: Find a way to truly know that the objects have finished
-  // rendering, because an execution-done message is not sufficient.
-  await page.waitForTimeout(1000)
 
   await expect(
     page.getByRole('button', { name: 'Start Sketch' })
   ).not.toBeDisabled()
+  await expect(page.getByRole('button', { name: 'Start Sketch' })).toBeVisible()
 
-  await page.getByRole('button', { name: 'Start Sketch' }).click()
+  // click on "Start Sketch" button
-  let previousCodeContent = await page.locator('.cm-content').innerText()
+  await u.clearCommandLogs()
+  await u.doAndWaitForImageDiff(
+    () => page.getByRole('button', { name: 'Start Sketch' }).click(),
+    200
+  )
 
-  // click at 641, 135
+  // select a plane
-  await page.mouse.click(641, 135)
+  await page.mouse.click(700, 200)
-  await expect(page.locator('.cm-content')).not.toHaveText(previousCodeContent)
-  previousCodeContent = await page.locator('.cm-content').innerText()
 
-  await page.waitForTimeout(300)
+  await expect(page.locator('.cm-content')).toHaveText(
+    `const part001 = startSketchOn('-XZ')`
+  )
 
+  await page.waitForTimeout(300) // TODO detect animation ending, or disable animation
+
+  const startXPx = 600
+  await page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10)
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('-XZ')
+|> startProfileAt([9.06, -12.22], %)`)
+  await page.waitForTimeout(100)
+
+  await u.closeDebugPanel()
+
+  await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 10)
+  await page.waitForTimeout(100)
+
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('-XZ')
+|> startProfileAt([9.06, -12.22], %)
+|> line([9.14, 0], %)`)
+
+  await page.getByRole('button', { name: 'Tangential Arc' }).click()
+  await page.waitForTimeout(100)
+
+  await page.mouse.click(startXPx + PUR * 30, 500 - PUR * 20)
+
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('-XZ')
+|> startProfileAt([9.06, -12.22], %)
+|> line([9.14, 0], %)
+|> tangentialArcTo([27.34, -3.08], %)`)
+
+  // click tangential arc tool again to unequip it
+  await page.getByRole('button', { name: 'Tangential Arc' }).click()
+  await page.waitForTimeout(100)
+
+  // screen shot should show the sketch
+  await expect(page).toHaveScreenshot({
+    maxDiffPixels: 100,
+  })
+
+  // exit sketch
+  await u.openAndClearDebugPanel()
+  await page.getByRole('button', { name: 'Exit Sketch' }).click()
+
+  // wait for execution done
+  await u.expectCmdLog('[data-message-type="execution-done"]')
+  await u.clearAndCloseDebugPanel()
+  await page.waitForTimeout(200)
+
+  // second screen shot should look almost identical, i.e. scale should be the same.
+  await expect(page).toHaveScreenshot({
+    maxDiffPixels: 100,
+  })
+})
+
+test('Client side scene scale should match engine scale mm', async ({
+  page,
+  context,
+}) => {
+  await context.addInitScript(async () => {
+    localStorage.setItem(
+      'SETTINGS_PERSIST_KEY',
+      JSON.stringify({
+        baseUnit: 'mm',
+        cameraControls: 'KittyCAD',
+        defaultDirectory: '',
+        defaultProjectName: 'project-$nnn',
+        onboardingStatus: 'dismissed',
+        showDebugPanel: true,
+        textWrapping: 'On',
+        theme: 'system',
+        unitSystem: 'metric',
+      })
+    )
+  })
+  const u = getUtils(page)
+  await page.setViewportSize({ width: 1200, height: 500 })
+  const PUR = 400 / 37.5 //pixeltoUnitRatio
+  await page.goto('/')
+  await u.waitForAuthSkipAppStart()
+  await u.openDebugPanel()
+
+  await expect(
+    page.getByRole('button', { name: 'Start Sketch' })
+  ).not.toBeDisabled()
+  await expect(page.getByRole('button', { name: 'Start Sketch' })).toBeVisible()
+
+  // click on "Start Sketch" button
+  await u.clearCommandLogs()
+  await u.doAndWaitForImageDiff(
+    () => page.getByRole('button', { name: 'Start Sketch' }).click(),
+    200
+  )
+
+  // select a plane
+  await page.mouse.click(700, 200)
+
+  await expect(page.locator('.cm-content')).toHaveText(
+    `const part001 = startSketchOn('-XZ')`
+  )
+
+  await page.waitForTimeout(300) // TODO detect animation ending, or disable animation
+
+  const startXPx = 600
+  await page.mouse.click(startXPx + PUR * 10, 500 - PUR * 10)
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('-XZ')
+  |> startProfileAt([230.03, -310.33], %)`)
+  await page.waitForTimeout(100)
+
+  await u.closeDebugPanel()
+
+  await page.mouse.click(startXPx + PUR * 20, 500 - PUR * 10)
+  await page.waitForTimeout(100)
+
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('-XZ')
+  |> startProfileAt([230.03, -310.33], %)
+  |> line([232.2, 0], %)`)
+
+  await page.getByRole('button', { name: 'Tangential Arc' }).click()
+  await page.waitForTimeout(100)
+
+  await page.mouse.click(startXPx + PUR * 30, 500 - PUR * 20)
+
+  await expect(page.locator('.cm-content'))
+    .toHaveText(`const part001 = startSketchOn('-XZ')
+  |> startProfileAt([230.03, -310.33], %)
+  |> line([232.2, 0], %)
+  |> tangentialArcTo([694.43, -78.12], %)`)
+
+  await page.getByRole('button', { name: 'Tangential Arc' }).click()
+  await page.waitForTimeout(100)
+
+  // screen shot should show the sketch
+  await expect(page).toHaveScreenshot({
+    maxDiffPixels: 100,
+  })
+
+  // exit sketch
+  await u.openAndClearDebugPanel()
+  await page.getByRole('button', { name: 'Exit Sketch' }).click()
+
+  // wait for execution done
+  await u.expectCmdLog('[data-message-type="execution-done"]')
+  await u.clearAndCloseDebugPanel()
+  await page.waitForTimeout(200)
+
+  // second screen shot should look almost identical, i.e. scale should be the same.
   await expect(page).toHaveScreenshot({
     maxDiffPixels: 100,
   })