get type setup in order for app

gnosisguild · Jan 8, 2025 · 1e76155 · 1e76155
1 parent ec59a90
commit 1e76155
Show file tree

Hide file tree

Showing 8 changed files with 36 additions and 26 deletions.
diff --git a/deployables/app/app/routes/edit-route.spec.ts b/deployables/app/app/routes/edit-route.spec.ts
@@ -8,7 +8,7 @@ describe('Edit route', () => {
   it('shows the name of a route', async () => {
     const route = createMockExecutionRoute({ label: 'Test route' })
 
-    await render(
+    await render<typeof import('./edit-route')>(
       '/edit-route',
       { path: '/edit-route', Component: EditRoute, loader },
       { searchParams: { route: btoa(JSON.stringify(route)) } },

diff --git a/deployables/app/test-utils/render.tsx b/deployables/app/test-utils/render.tsx
@@ -1,8 +1,8 @@
 import {
-  FrameworkRoute,
   renderFramework,
-  RenderOptions,
-  RouteModule,
+  type FrameworkRoute,
+  type RenderOptions,
+  type RouteModule,
 } from '@zodiac/test-utils'
 
 export function render<Module extends RouteModule>(

diff --git a/deployables/app/tsconfig.cloudflare.json b/deployables/app/tsconfig.cloudflare.json
@@ -2,24 +2,23 @@
   "extends": "./tsconfig.json",
   "include": [
     ".react-router/types/**/*",
+    "vitest.setup.ts",
     "app/**/*",
     "app/**/.server/**/*",
     "app/**/.client/**/*",
-    "workers/**/*"
+    "workers/**/*",
+    "test-utils/**/*"
   ],
   "compilerOptions": {
     "composite": true,
-    "strict": true,
     "lib": ["DOM", "DOM.Iterable", "ES2022"],
     "types": ["@cloudflare/workers-types", "vite/client"],
-    "target": "ES2022",
-    "module": "ES2022",
-    "moduleResolution": "bundler",
     "jsx": "react-jsx",
     "baseUrl": ".",
     "rootDirs": [".", "./.react-router/types"],
     "paths": {
-      "~/*": ["./app/*"]
+      "~/*": ["./app/*"],
+      "@/test-utils": ["./test-utils/index.ts"]
     },
     "esModuleInterop": true,
     "resolveJsonModule": true

diff --git a/deployables/app/tsconfig.json b/deployables/app/tsconfig.json
@@ -5,13 +5,14 @@
     { "path": "./tsconfig.cloudflare.json" }
   ],
   "compilerOptions": {
+    "target": "ES2022",
+    "module": "ES2022",
     "checkJs": true,
     "verbatimModuleSyntax": true,
     "skipLibCheck": true,
     "strict": true,
     "noEmit": true,
-    "paths": {
-      "@/test-utils": ["./test-utils/index.ts"]
-    }
+    "moduleResolution": "bundler",
+    "types": ["@testing-library/jest-dom"]
   }
 }
diff --git a/deployables/app/tsconfig.node.json b/deployables/app/tsconfig.node.json
@@ -1,13 +1,12 @@
 {
   "extends": "./tsconfig.json",
-  "include": ["tailwind.config.ts", "vite.config.ts", "vitest.setup.mts"],
+  "include": ["tailwind.config.ts", "vite.config.ts", "vitest.setup.ts"],
   "compilerOptions": {
     "composite": true,
-    "strict": true,
     "types": ["node"],
     "lib": ["ES2022"],
-    "target": "ES2022",
-    "module": "ES2022",
-    "moduleResolution": "bundler"
+    "paths": {
+      "@/test-utils": ["./test-utils/index.ts"]
+    }
   }
 }
diff --git a/deployables/app/vitest.config.ts b/deployables/app/vitest.config.ts
@@ -2,7 +2,7 @@
 
 import { fileURLToPath } from 'url'
 import { defineConfig } from 'vitest/config'
-import tsConfig from './tsconfig.json'
+import tsConfig from './tsconfig.node.json'
 
 const alias = Object.entries(tsConfig.compilerOptions.paths).reduce(
   (result, [key, value]) => ({
@@ -18,7 +18,7 @@ export default defineConfig({
   test: {
     alias,
     environment: 'happy-dom',
-    setupFiles: ['./vitest.setup.mts'],
+    setupFiles: ['./vitest.setup.ts'],
     include: ['./app/**/*.{spec,test}.{ts,tsx}'],
     mockReset: true,
     clearMocks: true,

diff --git a/deployables/app/vitest.setup.mts → deployables/app/vitest.setup.ts b/deployables/app/vitest.setup.mts → deployables/app/vitest.setup.ts
diff --git a/packages/test-utils/src/renderFramework.tsx b/packages/test-utils/src/renderFramework.tsx
@@ -1,4 +1,4 @@
-import { render } from '@testing-library/react'
+import { render, type RenderResult } from '@testing-library/react'
 import type { ComponentType } from 'react'
 import { createRoutesStub, useLoaderData, useParams } from 'react-router'
 import type {
@@ -29,10 +29,21 @@ export type RouteModule = {
 }
 
 type Info<Module extends RouteModule> = {
-  parents: []
-  id: 'routes/test-route'
-  file: 'routes/test-route-not-real.tsx'
-  path: '/test-route-not-real'
+  parents: [
+    {
+      parents: []
+      id: 'root'
+      file: 'root.tsx'
+      path: ''
+      params: {} & { [key: string]: string | undefined }
+      module: Module
+      loaderData: CreateLoaderData<{}>
+      actionData: CreateActionData<{}>
+    },
+  ]
+  id: any
+  file: any
+  path: any
   params: {} & { [key: string]: string | undefined }
   module: Module
   loaderData: CreateLoaderData<Module>
@@ -54,7 +65,7 @@ export async function renderFramework<Module extends RouteModule>(
   currentPath: string,
   route: FrameworkRoute<Module>,
   { inspectRoutes = [], ...options }: RenderOptions,
-) {
+): Promise<RenderResult> {
   const Stub = createRoutesStub([
     {
       path: '/',