Wait for agent ready

coder · mtojek · Apr 19, 2023 · Apr 19, 2023 · Apr 19, 2023 · Apr 20, 2023
commit 5396dcdbcf967581dd76d440cb23a11a828b4ef8
diff --git a/site/e2e/playwright.config.ts b/site/e2e/playwright.config.ts
@@ -20,6 +20,7 @@ const config: PlaywrightTestConfig = {
     port,
     reuseExistingServer: false,
   },
+  timeout: 120 * 1000,
 }
 
 export default config
diff --git a/site/e2e/pom/CreateTemplatePage.ts b/site/e2e/pom/CreateTemplatePage.ts
@@ -21,10 +21,12 @@ export class CreateTemplatePage extends BasePom {
 
   async submitForm() {
     await this.createTemplateForm
-    .getByTestId("form-template-upload")
-    .setInputFiles("./e2e/testdata/docker.tar")
+      .getByTestId("form-template-upload")
+      .setInputFiles("./e2e/testdata/docker.tar")
     await this.createTemplateForm.getByLabel("Name *").fill("my-first-template")
-    await this.createTemplateForm.getByLabel("Display name").fill("My First Template")
+    await this.createTemplateForm
+      .getByLabel("Display name")
+      .fill("My First Template")
     await this.createTemplateForm
       .getByLabel("Description")
       .fill("This is my first template.")

diff --git a/site/e2e/pom/CreateWorkspacePage.ts b/site/e2e/pom/CreateWorkspacePage.ts
@@ -20,7 +20,9 @@ export class CreateWorkspacePage extends BasePom {
   }
 
   async submitForm() {
-    await this.createWorkspaceForm.getByLabel("Workspace Name").fill("my-first-workspace")
+    await this.createWorkspaceForm
+      .getByLabel("Workspace Name")
+      .fill("my-first-workspace")
 
     await this.submitButton.click()
   }

diff --git a/site/e2e/pom/WorkspacePage.ts b/site/e2e/pom/WorkspacePage.ts
@@ -4,13 +4,23 @@ import { BasePom } from "./BasePom"
 export class WorkspacePage extends BasePom {
   readonly workspaceRunningBadge: Locator
   readonly workspaceStoppedBadge: Locator
+  readonly terminalButton: Locator
+  readonly agentVersion: Locator
+  readonly agentLifecycleReady: Locator
   readonly stopWorkspaceButton: Locator
 
   constructor(baseURL: string | undefined, page: Page) {
     super(baseURL, `/templates/docker/workspace`, page)
 
-    this.workspaceRunningBadge = page.getByTestId("badge-workspace-status-running")
-    this.workspaceStoppedBadge = page.getByTestId("badge-workspace-status-stopped")
+    this.workspaceRunningBadge = page.getByTestId(
+      "badge-workspace-status-running",
+    )
+    this.workspaceStoppedBadge = page.getByTestId(
+      "badge-workspace-status-stopped",
+    )
+    this.terminalButton = page.getByTestId("button-terminal")
+    this.agentVersion = page.getByTestId("agent-version")
+    this.agentLifecycleReady = page.getByTestId("agent-lifecycle-ready")
     this.stopWorkspaceButton = page.getByTestId("button-stop-workspace")
   }
 
@@ -21,6 +31,10 @@ export class WorkspacePage extends BasePom {
 
   async isRunning() {
     await this.workspaceRunningBadge.waitFor({ state: "visible" })
+    await this.terminalButton.waitFor({ state: "visible" })
+    await this.agentVersion.waitFor({ state: "visible" })
+    await this.agentLifecycleReady.waitFor({ state: "visible" })
+    await this.page.waitForTimeout(1000) // Wait for 1s to snapshot the agent status on the video
   }
 
   async stop() {

diff --git a/site/e2e/tests/basicScenario.spec.ts b/site/e2e/tests/basicScenario.spec.ts
@@ -28,27 +28,27 @@ test("Basic scenario", async ({ page, baseURL }) => {
     await templatePage.loaded()
   })
 
-  await test.step("Start a workspace", async() => {
+  await test.step("Start a workspace", async () => {
     await templatePage.createWorkspace()
     await createWorkspacePage.loaded()
 
     await createWorkspacePage.submitForm()
     await workspacePage.loaded()
   })
 
-  await test.step("Workspace is up and running", async() => {
+  await test.step("Workspace is up and running", async () => {
     await workspacePage.isRunning()
   })
 
-  await test.step("Stop the workspace", async() => {
+  await test.step("Stop the workspace", async () => {
     await workspacePage.stop()
   })
 
-  await test.step("Workspace is stopped", async() => {
+  await test.step("Workspace is stopped", async () => {
     await workspacePage.isStopped()
   })
 
-  await test.step("Finally", async() => {
+  await test.step("Finally", async () => {
     await page.waitForTimeout(5 * 60 * 1000) // FIXME
   })
 })
diff --git a/site/src/components/Resources/AgentStatus.tsx b/site/src/components/Resources/AgentStatus.tsx
@@ -28,6 +28,7 @@ const ReadyLifecycle: React.FC = () => {
       role="status"
       aria-label={t("agentStatus.connected.ready")}
       className={combineClasses([styles.status, styles.connected])}
+      data-testid="agent-lifecycle-ready"
     />
   )
 }

diff --git a/site/src/components/Resources/AgentVersion.tsx b/site/src/components/Resources/AgentVersion.tsx
@@ -19,7 +19,7 @@ export const AgentVersion: FC<{
   )
 
   if (!outdated) {
-    return <span>{displayVersion}</span>
+    return <span data-testid="agent-version">{displayVersion}</span>
   }
 
   return (
@@ -31,6 +31,7 @@ export const AgentVersion: FC<{
         onMouseEnter={() => setIsOpen(true)}
         onMouseLeave={() => setIsOpen(false)}
         className={styles.trigger}
+        data-testid="agent-version"
       >
         Agent Outdated
       </span>

diff --git a/site/src/components/TerminalLink/TerminalLink.tsx b/site/src/components/TerminalLink/TerminalLink.tsx
@@ -42,6 +42,7 @@ export const TerminalLink: FC<React.PropsWithChildren<TerminalLinkProps>> = ({
       href={href}
       className={combineClasses([styles.link, className])}
       target="_blank"
+      data-testid="button-terminal"
       onClick={(event) => {
         event.preventDefault()
         window.open(

diff --git a/site/src/components/WorkspaceStatusBadge/WorkspaceStatusBadge.tsx b/site/src/components/WorkspaceStatusBadge/WorkspaceStatusBadge.tsx
@@ -100,6 +100,13 @@ export const WorkspaceStatusBadge: FC<
   PropsWithChildren<WorkspaceStatusBadgeProps>
 > = ({ build, className }) => {
   const { text, icon, type } = getStatus(build.status)
-  return <Pill className={className} icon={icon} text={text} type={type} dataTestId={"badge-workspace-status-" + build.status }
-  />
+  return (
+    <Pill
+      className={className}
+      icon={icon}
+      text={text}
+      type={type}
+      dataTestId={"badge-workspace-status-" + build.status}
+    />
+  )
 }
diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx
@@ -211,7 +211,10 @@ export const CreateWorkspacePageView: FC<
 
   return (
     <FullPageHorizontalForm title="New workspace" onCancel={props.onCancel}>
-      <HorizontalForm onSubmit={form.handleSubmit} data-testid="form-create-workspace">
+      <HorizontalForm
+        onSubmit={form.handleSubmit}
+        data-testid="form-create-workspace"
+      >
         {/* General info */}
         <FormSection
           title="General info"

diff --git a/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPageView.tsx b/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPageView.tsx
@@ -51,7 +51,7 @@ export const TemplateSummaryPageView: FC<TemplateSummaryPageViewProps> = ({
     <Stack spacing={4}>
       <TemplateStats template={template} activeVersion={activeVersion} />
       {daus && <DAUChart daus={daus} />}
-      <TemplateResourcesTable resources={getStartedResources(resources)}/>
+      <TemplateResourcesTable resources={getStartedResources(resources)} />
     </Stack>
   )
 }