feat(ui): add a bunch of tests

packages/ui/vite.config.ts

@@ -1,5 +1,6 @@
 import { sveltekit } from '@sveltejs/kit/vite';
 import tailwindcss from '@tailwindcss/vite';
+import { playwright } from '@vitest/browser-playwright';
 import { exec } from 'node:child_process';
 import { readFileSync } from 'node:fs';
 import { defineConfig } from 'vitest/config';
@@ -21,6 +22,31 @@ const postDevPackagePlugin = () => {
 export default defineConfig({
   plugins: [tailwindcss(), sveltekit(), postDevPackagePlugin()],
   test: {
-    include: ['src/**/*.{test,spec}.{js,ts}']
+    expect: { requireAssertions: true },
+    projects: [
+      {
+        extends: './vite.config.ts',
+        test: {
+          name: 'client',
+          browser: {
+            enabled: true,
+            provider: playwright(),
+            instances: [{ browser: 'firefox', headless: true }]
+          },
+          include: ['src/**/*.svelte.ts'],
+          exclude: ['src/lib/server/**']
+        }
+      },
+
+      {
+        extends: './vite.config.ts',
+        test: {
+          name: 'server',
+          environment: 'node',
+          include: ['src/**/*.{test,spec}.{js,ts}'],
+          exclude: ['src/**/*.svelte.{test,spec}.{js,ts}']
+        }
+      }
+    ]
   }
 });