Make sure tests are typechecked too

Author: pimterry

tests/html.test.tsx

@@ -100,7 +100,7 @@ const storyTests: Record<string, (result: RenderResult) => void | Promise<void>>
   'CanSetPropsRemotelyWhilstMoving': async ({ container, getAllByText }) => {
     expect(container.textContent).toContain('Count is 0');
 
-    const counterDiv = container.querySelector('div[style*="background-color"]');
+    const counterDiv = container.querySelector('div[style*="background-color"]') as HTMLElement;
     expect(counterDiv?.style.backgroundColor).toBe('rgb(170, 255, 170)');
 
     const incrementButton = counterDiv?.querySelector('button');
@@ -116,7 +116,7 @@ const storyTests: Record<string, (result: RenderResult) => void | Promise<void>>
 
     expect(container.textContent).toContain('Count is 1');
 
-    const counterDivAfter = container.querySelector('div[style*="background-color"]');
+    const counterDivAfter = container.querySelector('div[style*="background-color"]') as HTMLElement;
     expect(counterDivAfter?.style.backgroundColor).toBe('rgb(170, 170, 255)');
 
     const incrementButtonAfter = counterDivAfter?.querySelector('button');

vite.config.ts

@@ -1,9 +1,13 @@
 /// <reference types="vitest/config" />
 import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
+import checker from 'vite-plugin-checker';
 
 export default defineConfig({
-  plugins: [react()],
+  plugins: [
+    react(),
+    checker({ typescript: true })
+  ],
   test: {
     include: ['tests/**/*.test.{ts,tsx}'],
     browser: {
@@ -18,6 +22,9 @@ export default defineConfig({
         }
       }]
     },
-    setupFiles: ['.storybook/vitest.setup.ts']
+    setupFiles: ['.storybook/vitest.setup.ts'],
+    typecheck: {
+      enabled: true
+    }
   }
 });