Implement DatePickerSingle

Author: KoolADE85

components/dash-core-components/jest.config.js

@@ -1,14 +1,29 @@
 module.exports = {
     preset: 'ts-jest',
-    testEnvironment: 'node',
+    testEnvironment: 'jsdom',
     roots: ['<rootDir>/tests'],
-    testMatch: ['**/__tests__/**/*.ts', '**/?(*.)+(spec|test).ts'],
+    testMatch: ['**/__tests__/**/*.{ts,tsx}', '**/?(*.)+(spec|test).{ts,tsx}'],
     transform: {
-        '^.+\\.ts$': 'ts-jest',
+        '^.+\\.(ts|tsx)$': ['ts-jest', {
+            tsconfig: {
+                jsx: 'react',
+                esModuleInterop: true,
+                allowSyntheticDefaultImports: true,
+                types: ['jest', '@testing-library/jest-dom'],
+            },
+        }],
+        '^.+\\.js$': ['ts-jest', {
+            tsconfig: {
+                allowJs: true,
+            },
+        }],
     },
     collectCoverageFrom: ['src/**/*.{ts,tsx}', '!src/**/*.d.ts'],
     moduleNameMapper: {
         '^@/(.*)$': '<rootDir>/src/$1',
+        '\\.(css|less|scss|sass)$': 'identity-obj-proxy',
     },
     setupFilesAfterEnv: ['<rootDir>/jest.setup.js'],
+    // Disable caching to ensure TypeScript type changes are always picked up
+    cache: false,
 };

components/dash-core-components/jest.setup.js

@@ -1,2 +1,11 @@
 // Jest setup file
-// This file is loaded before every test file
+// This file is loaded before every test file
+import '@testing-library/jest-dom';
+
+// Mock window.dash_component_api for components that use Dash context
+global.window = global.window || {};
+global.window.dash_component_api = {
+    useDashContext: () => ({
+        useLoading: () => false,
+    }),
+};