WIP

coder · mtojek · Apr 19, 2023 · Apr 19, 2023 · Apr 19, 2023 · Apr 20, 2023
commit 3cac0ee4fe7e94b5a3f3346fddae26b55b5cb096
diff --git a/site/e2e/pom/WorkspacePage.ts b/site/e2e/pom/WorkspacePage.ts
@@ -2,21 +2,32 @@ import { expect, Locator, Page } from "@playwright/test"
 import { BasePom } from "./BasePom"
 
 export class WorkspacePage extends BasePom {
+  readonly workspaceRunningBadge: Locator
+  readonly workspaceStoppedBadge: 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.stopWorkspaceButton = page.getByTestId("button-stop-workspace")
   }
 
   async loaded() {
     await this.stopWorkspaceButton.waitFor({ state: "visible" })
+    await expect(this.page).toHaveTitle("admin/my-first-workspace - Coder")
+  }
 
-    await expect(this.page).toHaveTitle("admin/workspace-1 - Coder")
+  async isRunning() {
+    await this.workspaceRunningBadge.waitFor({ state: "visible" })
   }
 
   async stop() {
     await this.stopWorkspaceButton.click()
   }
+
+  async isStopped() {
+    await this.workspaceStoppedBadge.waitFor({ state: "visible" })
+  }
 }
diff --git a/site/e2e/tests/basicScenario.spec.ts b/site/e2e/tests/basicScenario.spec.ts
@@ -36,9 +36,17 @@ test("Basic scenario", async ({ page, baseURL }) => {
     await workspacePage.loaded()
   })
 
-  // await test.step("Workspace is up and running", async() => {
-  //   await workspacePage.isRunning()
-  // })
+  await test.step("Workspace is up and running", async() => {
+    await workspacePage.isRunning()
+  })
+
+  await test.step("Stop the workspace", async() => {
+    await workspacePage.stop()
+  })
+
+  await test.step("Workspace is stopped", async() => {
+    await workspacePage.isStopped()
+  })
 
   await test.step("Finally", async() => {
     await page.waitForTimeout(5 * 60 * 1000) // FIXME

diff --git a/site/src/components/Pill/Pill.tsx b/site/src/components/Pill/Pill.tsx
@@ -10,16 +10,18 @@ export interface PillProps {
   type?: PaletteIndex
   lightBorder?: boolean
   title?: string
+  dataTestId?: string
 }
 
 export const Pill: FC<PillProps> = (props) => {
-  const { className, icon, text = false, title } = props
+  const { className, icon, text = false, title, dataTestId } = props
   const styles = useStyles(props)
   return (
     <div
       className={combineClasses([styles.wrapper, styles.pillColor, className])}
       role="status"
       title={title}
+      data-testid={dataTestId}
     >
       {icon && <div className={styles.iconWrapper}>{icon}</div>}
       {text}

diff --git a/site/src/components/WorkspaceActions/Buttons.tsx b/site/src/components/WorkspaceActions/Buttons.tsx
@@ -61,6 +61,7 @@ export const StopButton: FC<PropsWithChildren<WorkspaceAction>> = ({
       startIcon={<CropSquareIcon />}
       onClick={handleAction}
       className={styles.fixedWidth}
+      data-testid="button-stop-workspace"
     >
       {t("actionButton.stop")}
     </Button>

diff --git a/site/src/components/WorkspaceStatusBadge/WorkspaceStatusBadge.tsx b/site/src/components/WorkspaceStatusBadge/WorkspaceStatusBadge.tsx
@@ -100,6 +100,6 @@ 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} data-testid={"workspace-status-" + type }
+  return <Pill className={className} icon={icon} text={text} type={type} dataTestId={"badge-workspace-status-" + build.status }
   />
 }