test: move from jest to vitest

packages/svelte-lexical/package.json

@@ -30,8 +30,9 @@
     "prepublishOnly": "npm run package",
     "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --fail-on-warnings --compiler-warnings \"a11y-no-noninteractive-element-interactions:ignore,a11y-no-static-element-interactions:ignore\"",
     "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
-    "test": "jest src",
-    "test:watch": "pnpm run test -- --watch",
+    "test": "vitest run",
+    "test:ui": "vitest --ui",
+    "test:watch": "vitest",
     "lint": "prettier --check . && eslint .",
     "format": "prettier --write ."
   },
@@ -44,33 +45,36 @@
     "@rollup/plugin-commonjs": "^25.0.1",
     "@rollup/plugin-node-resolve": "^15.1.0",
     "@rollup/plugin-typescript": "^11.1.1",
+    "@sveltejs/adapter-auto": "^3.2.0",
+    "@sveltejs/kit": "^2.5.5",
+    "@sveltejs/package": "^2.3.0",
+    "@sveltejs/vite-plugin-svelte": "^3.0.2",
     "@testing-library/jest-dom": "^6.4.2",
     "@testing-library/svelte": "^4.1.0",
+    "@testing-library/user-event": "^14.5.2",
     "@tsconfig/svelte": "^5.0.4",
     "@types/lodash-es": "^4.17.12",
     "@typescript-eslint/eslint-plugin": "^5.59.9",
     "@typescript-eslint/parser": "^5.59.9",
-    "@sveltejs/adapter-auto": "^3.2.0",
-    "@sveltejs/kit": "^2.5.5",
-    "@sveltejs/package": "^2.3.0",
-    "@sveltejs/vite-plugin-svelte": "^3.0.2",
+    "@vitest/ui": "^1.4.0",
     "babel-jest": "^29.5.0",
     "eslint": "^8.42.0",
     "eslint-config-prettier": "^8.8.0",
     "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-svelte": "^2.35.1",
     "jest": "^29.5.0",
     "jest-environment-jsdom": "^29.5.0",
+    "jsdom": "^24.0.0",
     "prettier-plugin-organize-attributes": "^1.0.0",
     "prettier-plugin-svelte": "^3.2.2",
     "publint": "^0.1.9",
     "rollup": "^3.25.0",
     "rollup-plugin-css-only": "^4.3.0",
     "rollup-plugin-svelte": "^7.1.5",
+    "svelte": "^4.2.12",
     "svelte-check": "^3.4.3",
     "svelte-jester": "^2.3.2",
     "svelte-preprocess": "^5.0.4",
-    "svelte": "^4.2.12",
     "typescript": "^5.1.3",
     "vite": "^5.2.7",
     "vitest": "^1.4.0"
@@ -104,18 +108,5 @@
     "prettier": "^3.2.5",
     "y-websocket": "1.5.0",
     "yjs": "13.6.2"
-  },
-  "jest": {
-    "transform": {
-      "^.+\\.js$": "babel-jest",
-      "^.+\\.svelte$": "svelte-jester"
-    },
-    "moduleFileExtensions": [
-      "js",
-      "svelte"
-    ],
-    "setupFilesAfterEnv": [
-      "@testing-library/jest-dom/extend-expect"
-    ]
   }
 }

packages/svelte-lexical/src/lib/components/richtext/RichTextComposer.test.js

@@ -0,0 +1,14 @@
+/**
+ * @jest-environment jsdom
+ */
+import { expect, test } from 'vitest';
+import { render } from '@testing-library/svelte'
+//import userEvent from '@testing-library/user-event'
+
+import RichTextComposer from '$lib/components/richtext/RichTextComposer.svelte';
+
+test('have Bold button in toolbar', () => {
+  const { getByLabelText } = render(RichTextComposer, {});
+
+  expect(getByLabelText('Format text as bold. Shortcut: Ctrl+B')).toBeInTheDocument();
+});

packages/svelte-lexical/src/lib/index.ts

@@ -17,7 +17,7 @@ export {default as CollaborationPlugin} from './core/plugins/collaboration/Colla
 export {default as AutoLinkPluginCore} from './core/plugins/AutoLink/AutoLinkPluginCore.svelte';
 export {default as AutoLinkPlugin} from './core/plugins/AutoLink/AutoLinkPlugin.svelte';
 export {default as LinkPlugin} from './core/plugins/link/LinkPlugin.svelte';
-export * from '$lib/core/plugins/link/url.js';
+export {sanitizeUrl, validateUrl} from './core/plugins/link/url.ts';
 export {default as FloatingLinkEditorPlugin} from './core/plugins/link/FloatingLinkEditorPlugin.svelte';
 export {default as CodeHighlightPlugin} from './core/plugins/CodeBlock/CodeHighlightPlugin.svelte';
 export {default as CodeActionMenuPlugin} from './core/plugins/CodeBlock/CodeActionMenuPlugin/CodeActionMenuPlugin.svelte';

packages/svelte-lexical/tsconfig.json

@@ -11,5 +11,19 @@
     "strict": true,
     "module": "NodeNext",
     "moduleResolution": "NodeNext"
-  }
+  },
+  "include": [
+    "ambient.d.ts",
+    "non-ambient.d.ts",
+    "./types/**/$types.d.ts",
+    "../vite.config.js",
+    "../vite.config.ts",
+    "../src/**/*.js",
+    "../src/**/*.ts",
+    "../src/**/*.svelte",
+    "../tests/**/*.js",
+    "../tests/**/*.ts",
+    "../tests/**/*.svelte",
+    "./vitest-setup.ts"
+  ]
 }

packages/svelte-lexical/vite.config.ts

@@ -1,9 +1,13 @@
 import {sveltekit} from '@sveltejs/kit/vite';
 import {defineConfig} from 'vitest/config';
 
-export default defineConfig({
+export default defineConfig(({mode}) => ({
   plugins: [sveltekit()],
+  resolve: {
+    conditions: mode === 'test' ? ['browser'] : [],
+  },
   test: {
-    include: ['src/**/*.{test,spec}.{js,ts}'],
+    environment: 'jsdom',
+    setupFiles: ['./vitest-setup.ts'],
   },
-});
+}));

packages/svelte-lexical/vitest-setup.ts

@@ -0,0 +1,11 @@
+import '@testing-library/svelte/vitest';
+import '@testing-library/jest-dom/vitest';
+
+import {beforeAll, vi} from 'vitest';
+
+beforeAll(() => {
+  // jsdom doens't support html dialog yet - https://github.com/jsdom/jsdom/issues/3294
+  HTMLDialogElement.prototype.show = vi.fn();
+  HTMLDialogElement.prototype.showModal = vi.fn();
+  HTMLDialogElement.prototype.close = vi.fn();
+});