tests: add tests infrastructure + first unit and e2e tests (#6)

.env.e2e

@@ -0,0 +1 @@
+DATABASE_URL=file:/tmp/aibyss-test.db

.github/workflows/validate.yaml

@@ -18,3 +18,15 @@ jobs:
       - run: npm ci
       - run: npm run lint
       - run: npm run build
+
+  test:
+    runs-on: ubuntu-22.04
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '20.x'
+      - run: npm ci
+      - run: npm run test:e2e:install
+      - run: npm run test
+      - run: npm run test:e2e

.gitignore

@@ -22,7 +22,10 @@ logs
 .env
 .env.*
 !.env.example
+!.env.e2e
 
 # Data Base
 dev.db
 dev.db-journal
+
+test-results

README.md

@@ -15,9 +15,25 @@ Start the development server on `http://localhost:3000`:
 npm run dev
 ```
 
+## Running the tests
+
+### unit tests
+
+```bash
+npm run test
+```
+
+### e2e tests
+
+First, setup e2e tests by running `npm run test:e2e:install`, then run the tests with:
+
+```bash
+npm run test:e2e
+```
+
 ## Contributors guide
 
-- we follow [conventional commits](https://www.conventionalcommits.org/en/v1.0.0/), name your PRs accordingly
+We follow [conventional commits](https://www.conventionalcommits.org/en/v1.0.0/), name your PRs accordingly
 
 ## Production
 

bin/seed-test-users.ts

@@ -0,0 +1,3 @@
+import { seedTestUsers } from "../tests/utils/seed-test-users";
+
+seedTestUsers();

components/CodeEditor.vue

@@ -73,7 +73,10 @@ function onSubmit(event: Event) {
 </script>
 
 <template>
-  <div class="w-full h-full font-sans">
+  <div
+    class="w-full h-full font-sans"
+    data-testid="code-editor"
+  >
     <form
       class="flex h-full flex-col"
       @submit="onSubmit"

components/GameScreen.vue

@@ -59,7 +59,10 @@ watch(gameState, (newState) => {
 </script>
 
 <template>
-  <div class="h-full w-full">
+  <div
+    class="h-full w-full"
+    data-testid="game-screen"
+  >
     <canvas ref="canvas" />
   </div>
 </template>

components/GlobalHeader.nuxt.spec.ts

@@ -0,0 +1,10 @@
+import { mountSuspended } from "@nuxt/test-utils/runtime";
+
+import { it, expect } from "vitest";
+
+import GlobalHeader from "./GlobalHeader.vue";
+
+it("mounts the GlobalHeader component", async () => {
+  const component = await mountSuspended(GlobalHeader);
+  expect(component.text()).toEqual("Aibyss");
+});

nuxt.config.ts

@@ -1,4 +1,3 @@
-// https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
   app: {
     head: {
@@ -9,11 +8,15 @@ export default defineNuxtConfig({
   },
   devtools: { enabled: true },
   css: ["~/assets/css/main.css"],
-  modules: ["nuxt-monaco-editor", "@nuxt/eslint"],
+  modules: ["nuxt-monaco-editor", "@nuxt/eslint", "@nuxt/test-utils/module"],
   nitro: {
     hooks: {
       "dev:reload": () => require("isolated-vm"),
     },
+    serverAssets: [{
+      baseName: "botApis",
+      dir: "./botApis",
+    }],
   },
   postcss: {
     plugins: {