initial playwright setup and test (#1039)

* initial playwright setup and test

* try verbose logging

* double check resolution

* double check token

* remove logs

* try running on ubuntu and macos

* move e2e tests

* vitest ignores playwright tests

* add a series of tests

* tweak yarn setup

* typo

* update fmt

* action typo

* rust toolchain?

* remove .only from playwright test

* A snapshot a day keeps the bugs away! 📷🐛

* A snapshot a day keeps the bugs away! 📷🐛

* add pan and zoom back

* try puting os in commit message

* A snapshot a day keeps the bugs away! 📷🐛 .os

* A snapshot a day keeps the bugs away! 📷🐛 .os

* fix commit message

* A snapshot a day keeps the bugs away! 📷🐛 (OS: macos-latest)

* add command logs to UI for axis tests

* typo

* fmt

* remove .only

* add auto complete test

* remove .only

* update queries to be more playwright recommended

* move test utils

* remove waits from first test

* remove old snapshots

* re-arrange files and tests

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

* trigger CI

* refactor plane test

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

* remove .only

* try longer wait

* try snap shoting

* fmt

* better CI names

* fix

* fix linux

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

* try make executes on load a bit more robust

* fix

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

* stabilise snapshots

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

* A snapshot a day keeps the bugs away! 📷🐛 (OS: macos-latest)

* make tests run linearly

* update naming

* tidy

* .only

* update readme

* trigger CI

* add set tool

* util clean up

* update readme

* readme tweaks

* self-review clean up

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

* tweak

* update readme

* Ensure Vite preview server is running before running any Playwright tests (#1114)

* Ensure that Vite is serving before tests run

* Don't break secrets if developer has extra blank line in env file

* @mxschmitt's suggestions

* fix

* add wait-on types

* tsconfig fix

* update readme

* code template for sktech on each plane test

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: Frank Noirot <frank@kittycad.io>

src/lang/std/engineConnection.ts

@@ -590,12 +590,36 @@ interface Subscription<T extends ModelTypes> {
   ) => void
 }
 
+export type CommandLog =
+  | {
+      type: 'send-modeling'
+      data: EngineCommand
+    }
+  | {
+      type: 'send-scene'
+      data: EngineCommand
+    }
+  | {
+      type: 'receive-reliable'
+      data: WebSocketResponse
+      id: string
+      cmd_type?: string
+    }
+  | {
+      type: 'execution-done'
+      data: null
+    }
+
+type CommandLogTypes = Extract<CommandLog, { type: string }>['type']
+
 export class EngineCommandManager {
   artifactMap: ArtifactMap = {}
   outSequence = 1
   inSequence = 1
   engineConnection?: EngineConnection
   defaultPlanes: DefaultPlanes = { xy: '', yz: '', xz: '' }
+  _commandLogs: CommandLog[] = []
+  _commandLogCallBack: (command: CommandLog[]) => void = () => {}
   // Folks should realize that wait for ready does not get called _everytime_
   // the connection resets and restarts, it only gets called the first time.
   // Be careful what you put here.
@@ -786,6 +810,12 @@ export class EngineCommandManager {
       return
     }
     const modelingResponse = message.data.modeling_response
+    this.addCommandLog({
+      type: 'receive-reliable',
+      data: message,
+      id,
+      cmd_type: this.artifactMap[id]?.commandType,
+    })
     Object.values(this.subscriptions[modelingResponse.type] || {}).forEach(
       (callback) => callback(modelingResponse)
     )
@@ -923,6 +953,21 @@ export class EngineCommandManager {
       this.engineConnection?.send(deletCmd)
     })
   }
+  addCommandLog(message: CommandLog) {
+    if (this._commandLogs.length > 500) {
+      this._commandLogs.shift()
+    }
+    this._commandLogs.push(message)
+
+    this._commandLogCallBack([...this._commandLogs])
+  }
+  clearCommandLogs() {
+    this._commandLogs = []
+    this._commandLogCallBack(this._commandLogs)
+  }
+  registerCommandLogCallback(callback: (command: CommandLog[]) => void) {
+    this._commandLogCallBack = callback
+  }
   sendSceneCommand(command: EngineCommand): Promise<any> {
     if (this.engineConnection === undefined) {
       return Promise.resolve()
@@ -932,6 +977,20 @@ export class EngineCommandManager {
       return Promise.resolve()
     }
 
+    if (
+      !(
+        command.type === 'modeling_cmd_req' &&
+        (command.cmd.type === 'highlight_set_entity' ||
+          command.cmd.type === 'mouse_move')
+      )
+    ) {
+      // highlight_set_entity and mouse_move are sent over the unreliable channel and are too noisy
+      this.addCommandLog({
+        type: 'send-scene',
+        data: command,
+      })
+    }
+
     if (
       command.type === 'modeling_cmd_req' &&
       command.cmd.type !== lastMessage
@@ -987,6 +1046,17 @@ export class EngineCommandManager {
     if (!this.engineConnection?.isReady()) {
       return Promise.resolve()
     }
+    if (typeof command !== 'string') {
+      this.addCommandLog({
+        type: 'send-modeling',
+        data: command,
+      })
+    } else {
+      this.addCommandLog({
+        type: 'send-modeling',
+        data: JSON.parse(command),
+      })
+    }
     this.engineConnection?.send(command)
     if (typeof command !== 'string' && command.type === 'modeling_cmd_req') {
       return this.handlePendingCommand(id, command?.cmd, range)