refactor: CodeServer methods to be mroe stable

Author: jsjoeio

test/e2e/models/CodeServer.ts

@@ -5,6 +5,7 @@ import { CODE_SERVER_ADDRESS } from "../../utils/constants"
 // See Playwright docs: https://playwright.dev/docs/pom/
 export class CodeServer {
   page: Page
+  editorSelector = "div.monaco-workbench"
 
   constructor(page: Page) {
     this.page = page
@@ -30,15 +31,18 @@ export class CodeServer {
     // but usually a reload or two fixes it
     // TODO@jsjoeio @oxy look into Firefox reconnection/timeout issues
     while (!editorIsVisible) {
+      // When a reload happens, we want to wait for all resources to be
+      // loaded completely. Hence why we use that instead of DOMContentLoaded
+      // Read more: https://thisthat.dev/dom-content-loaded-vs-load/
+      await this.page.waitForLoadState("load")
+      // Give it an extra second just in case it's feeling extra slow
+      await this.page.waitForTimeout(1000)
       reloadCount += 1
       if (await this.isEditorVisible()) {
         console.log(`    Editor became visible after ${reloadCount} reloads`)
         break
       }
-      // When a reload happens, we want to wait for all resources to be
-      // loaded completely. Hence why we use that instead of DOMContentLoaded
-      // Read more: https://thisthat.dev/dom-content-loaded-vs-load/
-      await this.page.reload({ waitUntil: "load" })
+      await this.page.reload()
     }
   }
 
@@ -49,7 +53,7 @@ export class CodeServer {
     // Make sure the editor actually loaded
     // If it's not visible after 5 seconds, something is wrong
     await this.page.waitForLoadState("networkidle")
-    return await this.page.isVisible("div.monaco-workbench", { timeout: 5000 })
+    return await this.page.isVisible(this.editorSelector)
   }
 
   /**
@@ -63,7 +67,9 @@ export class CodeServer {
     const isTerminalVisible = await this.page.isVisible("#terminal")
     if (isTerminalVisible) {
       await this.page.keyboard.press(`Control+Backquote`)
-      // TODO fix this
+
+      // Make sure everything is laoded
+      await this.page.waitForLoadState("load")
       // Wait for terminal to receive focus
       await this.page.waitForSelector("div.terminal.xterm.focus")
       // Sometimes the terminal reloads