Make engine reconnection test pass every time (#3066)

* Ensure that isFreezeFrame is reset by isFirstRender, because it can't be a freeze frame if it's the first render

* `restart`-type engine starts should count as first renders

* Ensure we don't see a loading spinner after network is reconnected in test

* Make `waitForPageLoad` robust against if the page has already loaded
and make it actually wait for the Start Sketch button to be enabled

---------

Co-authored-by: 49fl <ircsurfer33@gmail.com>

e2e/playwright/flow-tests.spec.ts

@@ -7221,6 +7221,7 @@ test.describe('Test network and connection issues', () => {
 
     // Expect the network to be up
     await expect(page.getByText('Network Health (Connected)')).toBeVisible()
+    await expect(page.getByTestId('loading-stream')).not.toBeAttached()
 
     // Click off the code pane.
     await page.mouse.click(100, 100)

e2e/playwright/test-utils.ts

@@ -16,14 +16,14 @@ export const TEST_COLORS = {
 } as const
 
 async function waitForPageLoad(page: Page) {
-  // wait for 'Loading stream...' spinner
-  await page.getByTestId('loading-stream').waitFor()
   // wait for all spinners to be gone
-  await page
+  await expect(page.getByTestId('loading')).not.toBeAttached({
-    .getByTestId('loading')
+    timeout: 20_000,
-    .waitFor({ state: 'detached', timeout: 20_000 })
+  })
 
-  await page.getByTestId('start-sketch').waitFor()
+  await expect(page.getByTestId('start-sketch')).toBeEnabled({
+    timeout: 20_000,
+  })
 }
 
 async function removeCurrentCode(page: Page) {

src/components/Stream.tsx

@@ -157,6 +157,7 @@ export const Stream = () => {
   useEffect(() => {
     setIsFirstRender(kclManager.isFirstRender)
     if (!kclManager.isFirstRender) videoRef.current?.play()
+    setIsFreezeFrame(!kclManager.isFirstRender)
   }, [kclManager.isFirstRender])
 
   useEffect(() => {

src/hooks/useSetupEngineManager.ts

@@ -45,9 +45,6 @@ export function useSetupEngineManager(
       streamRef?.current?.offsetWidth ?? 0,
       streamRef?.current?.offsetHeight ?? 0
     )
-    if (restart) {
-      kclManager.isFirstRender = false
-    }
     engineCommandManager.start({
       restart,
       setMediaStream: (mediaStream) => setMediaStream(mediaStream),