Initial vitest setup

app/src/App.test.tsx

@@ -0,0 +1,16 @@
+import { describe, it, expect } from 'vitest';
+import { render } from '@/test/utils';
+
+describe('Testing Setup Sanity Check', () => {
+  it('should render a basic component', () => {
+    const TestComponent = () => <div>Hello, World!</div>;
+
+    const { getByText } = render(<TestComponent />);
+
+    expect(getByText('Hello, World!')).toBeInTheDocument();
+  });
+
+  it('should have access to global API_BASE_URL', () => {
+    expect(window.API_BASE_URL).toBe('http://localhost:8080/api/v1');
+  });
+});

app/src/test/setup.ts

@@ -0,0 +1,30 @@
+import '@testing-library/jest-dom';
+import { vi } from 'vitest';
+
+// Mock window.API_BASE_URL
+Object.defineProperty(window, 'API_BASE_URL', {
+  value: 'http://localhost:8080/api/v1',
+  writable: true,
+});
+
+// Mock matchMedia - required for Mantine components
+Object.defineProperty(window, 'matchMedia', {
+  writable: true,
+  value: vi.fn().mockImplementation((query: string) => ({
+    matches: false,
+    media: query,
+    onchange: null,
+    addListener: vi.fn(), // deprecated
+    removeListener: vi.fn(), // deprecated
+    addEventListener: vi.fn(),
+    removeEventListener: vi.fn(),
+    dispatchEvent: vi.fn(),
+  })),
+});
+
+// Mock ResizeObserver - sometimes needed for Mantine components
+global.ResizeObserver = vi.fn().mockImplementation(() => ({
+  observe: vi.fn(),
+  unobserve: vi.fn(),
+  disconnect: vi.fn(),
+}));

app/src/test/utils.tsx

@@ -0,0 +1,21 @@
+import React from 'react';
+import { render, type RenderOptions } from '@testing-library/react';
+import { MantineProvider } from '@mantine/core';
+
+// Create a custom render function that includes Mantine provider
+const AllTheProviders: React.FC<{ children: React.ReactNode }> = ({
+  children,
+}) => {
+  return (
+    <MantineProvider defaultColorScheme="light">{children}</MantineProvider>
+  );
+};
+
+const customRender = (
+  ui: React.ReactElement,
+  options?: Omit<RenderOptions, 'wrapper'>
+) => render(ui, { wrapper: AllTheProviders, ...options });
+
+// Re-export everything
+export * from '@testing-library/react';
+export { customRender as render };