cp

Author: slavingia

.github/workflows/test.yml

@@ -0,0 +1,28 @@
+name: "Test"
+on:
+  push:
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+
+    permissions:
+      contents: read
+      pull-requests: write
+
+    steps:
+      - name: Check out repository code
+        uses: actions/checkout@v4
+
+      - uses: pnpm/action-setup@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: "pnpm"
+
+      - shell: bash
+        run: pnpm install
+      - name: Install @vitest/coverage-v8
+        run: pnpm add -D @vitest/coverage-v8
+      - name: "Test"
+        run: npx vitest --coverage.enabled true

README.md

@@ -71,3 +71,11 @@ When you're ready to deploy your SaaS application to production, follow these st
 ### Add environment variables
 
 In your Vercel project settings (or during deployment), add all the necessary environment variables. Make sure to update the values for the production environment.
+
+## Running Tests
+
+To run specs:
+
+```bash
+pnpm vitest
+```

app/(dashboard)/page.test.tsx

@@ -0,0 +1,37 @@
+import React from "react";
+import { describe, it, expect, vi } from "vitest";
+import { render, screen } from "@testing-library/react";
+import Homepage from "./page";
+import { ClerkProvider, SignedOut, SignedIn } from "@clerk/nextjs";
+
+vi.mock("@/components/ui/button", () => ({
+  Button: ({ children }: { children: React.ReactNode }) => (
+    <button>{children}</button>
+  ),
+}));
+
+vi.mock("@clerk/nextjs", async (importOriginal) => {
+  const actual = await importOriginal();
+  return {
+    ...actual,
+    ClerkProvider: ({ children }: { children: React.ReactNode }) => (
+      <>{children}</>
+    ),
+    SignedOut: ({ children }: { children: React.ReactNode }) => <>{children}</>,
+    SignedIn: ({ children }: { children: React.ReactNode }) => <>{children}</>,
+  };
+});
+
+describe("Homepage", () => {
+  it("renders the correct heading", () => {
+    render(
+      <ClerkProvider>
+        <Homepage />
+      </ClerkProvider>
+    );
+
+    expect(screen.getByRole("heading", { level: 1 })).toHaveTextContent(
+      "Write Your Tests"
+    );
+  });
+});

package.json

@@ -1,5 +1,7 @@
 {
   "private": true,
+  "type": "module",
+  "packageManager": "pnpm@9.7.1",
   "scripts": {
     "dev": "next dev --turbo",
     "build": "next build",
@@ -8,7 +10,8 @@
     "db:seed": "npx tsx lib/db/seed.ts",
     "db:generate": "drizzle-kit generate",
     "db:migrate": "npx tsx lib/db/migrate.ts",
-    "db:studio": "drizzle-kit studio"
+    "db:studio": "drizzle-kit studio",
+    "test": "vitest"
   },
   "dependencies": {
     "@ai-sdk/openai": "^0.0.61",
@@ -57,9 +60,16 @@
     "tailwindcss-react-aria-components": "1.1.5",
     "typescript": "^5.6.2",
     "vaul": "^0.9.4",
+    "vite-tsconfig-paths": "^5.0.1",
     "zod": "^3.23.8"
   },
   "devDependencies": {
-    "smee-client": "^2.0.3"
+    "@testing-library/jest-dom": "^6.5.0",
+    "@testing-library/react": "^16.0.1",
+    "@vitejs/plugin-react": "^4.3.1",
+    "happy-dom": "^15.7.4",
+    "jsdom": "^25.0.1",
+    "smee-client": "^2.0.3",
+    "vitest": "^2.1.1"
   }
 }