Use vitest instead of bun:test in remix app

Author: yamalight

.gitignore

@@ -3,4 +3,7 @@ node_modules
 /.cache
 /build
 .env
-.env.local
+.env.local
+
+# tests results
+coverage

app/components/markdown/Markdown.test.tsx

@@ -1,5 +1,5 @@
 import { render, screen } from '@testing-library/react';
-import { expect, test } from 'bun:test';
+import { expect, test } from 'vitest';
 import { CustomMarkdown } from './Markdown';
 
 test('Renders basic markdown', () => {

bun.lockb

@@ -9,7 +9,8 @@
     "lint": "eslint --ignore-path .gitignore --cache --cache-location ./node_modules/.cache/eslint .",
     "start": "remix-serve ./build/server/index.js",
     "typecheck": "tsc",
-    "test": "bun test"
+    "test": "vitest",
+    "test:ci": "vitest --coverage --run"
   },
   "dependencies": {
     "@headlessui/react": "^2.1.8",
@@ -39,7 +40,6 @@
     "turndown": "^7.2.0"
   },
   "devDependencies": {
-    "@happy-dom/global-registrator": "^15.7.4",
     "@remix-run/dev": "^2.12.1",
     "@tailwindcss/typography": "^0.5.15",
     "@testing-library/dom": "^10.4.0",

bunfig.toml

@@ -1,10 +1,9 @@
 import * as matchers from '@testing-library/jest-dom/matchers';
 import { cleanup } from '@testing-library/react';
-import { afterEach, expect } from 'bun:test';
+import { afterEach, expect } from 'vitest';
 
 expect.extend(matchers);
 
-// Optional: cleans up `render` after each test
 afterEach(() => {
   cleanup();
 });

happydom.ts

@@ -9,7 +9,14 @@
   ],
   "compilerOptions": {
     "lib": ["DOM", "DOM.Iterable", "ES2022"],
-    "types": ["@remix-run/node", "vite/client", "@webgpu/types", "@types/bun"],
+    "types": [
+      "@remix-run/node",
+      "vite/client",
+      "@webgpu/types",
+      "@types/bun",
+      "vitest/globals",
+      "@testing-library/jest-dom"
+    ],
     "isolatedModules": true,
     "esModuleInterop": true,
     "jsx": "react-jsx",

matchers.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="vitest" />
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+  test: {
+    globals: true,
+    environment: 'happy-dom',
+    setupFiles: './test/setup.ts',
+  },
+});