blacksmith-cli 0.1.5 → 0.1.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "blacksmith-cli",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "Fullstack Django + React framework — one command, one codebase, one mental model",
   "type": "module",
   "bin": {

package/src/templates/frontend/package.json.hbs

@@ -8,6 +8,9 @@
     "build": "tsc -b && vite build",
     "lint": "eslint .",
     "preview": "vite preview",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "test:coverage": "vitest run --coverage",
     "openapi-ts": "openapi-ts"
   },
   "dependencies": {
@@ -32,13 +35,18 @@
   },
   "devDependencies": {
     "@hey-api/openapi-ts": "^0.93.0",
+    "@testing-library/jest-dom": "^6.6.0",
+    "@testing-library/react": "^16.1.0",
+    "@testing-library/user-event": "^14.5.0",
     "@types/react": "^19.1.0",
     "@types/react-dom": "^19.1.0",
     "@vitejs/plugin-react": "^5.0.0",
     "autoprefixer": "^10.4.0",
+    "jsdom": "^25.0.0",
     "postcss": "^8.4.0",
     "tailwindcss-animate": "^1.0.7",
     "typescript": "~5.8.0",
-    "vite": "^6.3.0"
+    "vite": "^6.3.0",
+    "vitest": "^3.0.0"
   }
 }

package/src/templates/frontend/src/__tests__/setup.ts.hbs

@@ -0,0 +1,21 @@
+import '@testing-library/jest-dom/vitest'
+
+// Mock window.matchMedia (not implemented in jsdom)
+Object.defineProperty(window, 'matchMedia', {
+  writable: true,
+  value: vi.fn().mockImplementation((query: string) => ({
+    matches: false,
+    media: query,
+    onchange: null,
+    addListener: vi.fn(),
+    removeListener: vi.fn(),
+    addEventListener: vi.fn(),
+    removeEventListener: vi.fn(),
+    dispatchEvent: vi.fn(),
+  })),
+})
+
+// Clean up after each test
+afterEach(() => {
+  document.body.innerHTML = ''
+})

package/src/templates/frontend/src/__tests__/test-utils.tsx.hbs

@@ -0,0 +1,80 @@
+import { type ReactElement, type ReactNode } from 'react'
+import { render, type RenderOptions } from '@testing-library/react'
+import userEvent from '@testing-library/user-event'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { ThemeProvider } from '@blacksmith-ui/react'
+import { MemoryRouter } from 'react-router-dom'
+
+/**
+ * Creates a fresh QueryClient configured for tests.
+ * Disables retries and garbage collection to keep tests fast and deterministic.
+ */
+function createTestQueryClient() {
+  return new QueryClient({
+    defaultOptions: {
+      queries: {
+        retry: false,
+        gcTime: 0,
+      },
+      mutations: {
+        retry: false,
+      },
+    },
+  })
+}
+
+interface WrapperProps {
+  children: ReactNode
+}
+
+interface CustomRenderOptions extends Omit<RenderOptions, 'wrapper'> {
+  /** Initial route entries for MemoryRouter (defaults to ["/"]) */
+  routerEntries?: string[]
+  /** Provide your own QueryClient (a fresh one is created by default) */
+  queryClient?: QueryClient
+}
+
+/**
+ * Custom render that wraps components with all app providers:
+ * - ThemeProvider (light mode for consistent snapshots)
+ * - QueryClientProvider (with test-friendly defaults)
+ * - MemoryRouter (for components that use routing hooks)
+ *
+ * Also returns a `user` instance from @testing-library/user-event.
+ *
+ * @example
+ *   const { user } = renderWithProviders(<MyComponent />)
+ *   await user.click(screen.getByRole('button'))
+ */
+export function renderWithProviders(
+  ui: ReactElement,
+  {
+    routerEntries = ['/'],
+    queryClient = createTestQueryClient(),
+    ...renderOptions
+  }: CustomRenderOptions = {},
+) {
+  function Wrapper({ children }: WrapperProps) {
+    return (
+      <ThemeProvider defaultMode="light" storageKey="test-theme">
+        <QueryClientProvider client={queryClient}>
+          <MemoryRouter initialEntries={routerEntries}>
+            {children}
+          </MemoryRouter>
+        </QueryClientProvider>
+      </ThemeProvider>
+    )
+  }
+
+  return {
+    user: userEvent.setup(),
+    ...render(ui, { wrapper: Wrapper, ...renderOptions }),
+  }
+}
+
+export { createTestQueryClient }
+
+// Re-export everything from @testing-library/react for convenience
+export * from '@testing-library/react'
+// Override render with our custom version
+export { renderWithProviders as render }

package/src/templates/frontend/tsconfig.app.json.hbs

@@ -11,6 +11,7 @@
     "moduleDetection": "force",
     "noEmit": true,
     "jsx": "react-jsx",
+    "types": ["vitest/globals"],
     "strict": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,

package/src/templates/frontend/vite.config.ts.hbs

@@ -1,3 +1,4 @@
+/// <reference types="vitest/config" />
 import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
 import { resolve } from 'path'
@@ -18,4 +19,11 @@ export default defineConfig({
       },
     },
   },
+  test: {
+    globals: true,
+    environment: 'jsdom',
+    setupFiles: ['./src/__tests__/setup.ts'],
+    include: ['src/**/*.spec.{ts,tsx}'],
+    css: true,
+  },
 })