diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 344adf6..3790004 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -38,3 +38,6 @@ jobs: - name: Build run: vp run build + + - name: Test dev server + run: vp run test:dev diff --git a/apps/dashboard/vite.config.ts b/apps/dashboard/vite.config.ts index 92a3eef..5a9a9ac 100644 --- a/apps/dashboard/vite.config.ts +++ b/apps/dashboard/vite.config.ts @@ -5,6 +5,10 @@ import { defineConfig } from "vite-plus"; // https://vite.dev/config/ export default defineConfig({ plugins: [tailwindcss()], + experimental: { + // Vitest does not support bundled dev mode: https://github.com/vitest-dev/vitest/issues/11052 + bundledDev: !process.env.VITEST, + }, build: { rolldownOptions: { output: { diff --git a/package.json b/package.json index 01419bc..8aea062 100644 --- a/package.json +++ b/package.json @@ -8,6 +8,7 @@ "prepare": "vp config", "dev": "vp run @vibe/dashboard#dev", "build": "vp run @vibe/dashboard#build", + "test:dev": "playwright test", "deploy": "vp run build && void deploy --platform void --project vibe-dashboard --dir apps/dashboard/dist --spa", "generate": "node tools/override-vite.mjs --stats" }, diff --git a/playwright.config.ts b/playwright.config.ts new file mode 100644 index 0000000..cba294e --- /dev/null +++ b/playwright.config.ts @@ -0,0 +1,23 @@ +import { defineConfig } from "playwright/test"; + +const baseURL = "http://127.0.0.1:4173"; + +export default defineConfig({ + testDir: "./tests/dev", + outputDir: ".cache/playwright", + forbidOnly: true, + workers: 1, + reporter: "list", + use: { + browserName: "chromium", + baseURL, + }, + webServer: { + command: "vp dev apps/dashboard --host 127.0.0.1 --port 4173 --strictPort", + url: baseURL, + reuseExistingServer: false, + timeout: 60_000, + stdout: "pipe", + env: { VITEST: "" }, + }, +}); diff --git a/tests/dev/dashboard.spec.ts b/tests/dev/dashboard.spec.ts new file mode 100644 index 0000000..d812959 --- /dev/null +++ b/tests/dev/dashboard.spec.ts @@ -0,0 +1,28 @@ +import { expect, test } from "playwright/test"; + +test("vp dev renders the dashboard and lazy routes", async ({ page }) => { + const errors: string[] = []; + page.on("pageerror", (error) => errors.push(error.message)); + page.on("console", (message) => { + if (message.type() === "error") errors.push(message.text()); + }); + + const response = await page.goto("/"); + expect(response?.ok()).toBe(true); + await expect( + page.getByRole("heading", { name: "VoidZero Dashboard", exact: true }), + ).toBeVisible(); + + await page + .getByRole("main") + .getByRole("link", { name: /Minification Benchmarks/ }) + .click(); + await expect(page).toHaveURL("/#/minification"); + const heading = page.getByRole("heading", { name: "Minification Benchmarks", exact: true }); + await expect(heading).toBeVisible(); + + const reloadResponse = await page.reload(); + expect(reloadResponse?.ok()).toBe(true); + await expect(heading).toBeVisible(); + expect(errors).toEqual([]); +});