mirror of
https://github.com/luxfi/explore.git
synced 2026-09-24 00:28:18 +00:00
fce9bd8f96
* add export for address txs * transfer all export from page to dialog * remove old route and components * improve file name and fix loading state of icon button * basic implementation * refetch item status * status indicator for download items * changes for multichain * handle too many requests for downloads error * update button styles and spacing * fix tests * disable async export for multichain * Fix CSV export cancel flow and stabilize context updates Applied via @cursor push command * test and review fixes * move file to client folder * round 3 * add glossary * migration tasks and skill * move skills to .agents folder * rename migrate skill * refine project rules * move MIGRATION_TASKS.md to client directory * update sym links * refine migration skills * fixes after merging the main branch --------- Co-authored-by: Hanzo Dev <[email protected]>
76 lines
2.3 KiB
Plaintext
76 lines
2.3 KiB
Plaintext
---
|
|
description: Vitest unit tests — purpose, setup, utilities, and conventions
|
|
globs: "*.spec.ts,*.spec.tsx"
|
|
alwaysApply: false
|
|
---
|
|
# Unit Tests (Vitest)
|
|
|
|
## Purpose
|
|
|
|
Unit tests cover logic that is independent of visual presentation: utility functions, custom hooks, and component behavior (state transitions, conditional rendering, event handling). If a change has no visual output to verify, prefer a Vitest test over a Playwright one — it is faster and cheaper.
|
|
|
|
## File naming and location
|
|
|
|
Test files must be named `*.spec.ts` or `*.spec.tsx` and placed alongside the code they test. Run all tests:
|
|
|
|
```bash
|
|
pnpm test:vitest
|
|
```
|
|
|
|
Run a single file:
|
|
|
|
```bash
|
|
pnpm test:vitest path/to/file.spec.ts
|
|
```
|
|
|
|
## Setup
|
|
|
|
`vitest/setup.ts` runs before each test file and provides:
|
|
- **Environment variables** — loaded from `.env.vitest` via dotenv; accessible as `window.__envs` in test code.
|
|
- **Fetch mocking** — `vitest-fetch-mock` is initialized globally; all `fetch` calls are interceptable.
|
|
|
|
`vitest/global-setup.ts` runs once before the entire test suite and loads `.env.vitest`.
|
|
|
|
## Rendering components
|
|
|
|
**Never import from `@testing-library/react` directly.** Use the project's custom wrapper instead:
|
|
|
|
```tsx
|
|
import { render, screen } from 'vitest/lib';
|
|
```
|
|
|
|
`vitest/lib.tsx` re-exports everything from `@testing-library/react` and replaces `render` with a custom version that wraps the component in the full app context:
|
|
- `QueryClientProvider` (no retry, no window-focus refetch)
|
|
- `AppContextProvider`
|
|
- `GrowthBookProvider`
|
|
- `SocketProvider`
|
|
|
|
The `wrapper` export is also available if you need to pass it separately to RTL hooks:
|
|
|
|
```tsx
|
|
import { wrapper } from 'vitest/lib';
|
|
const { result } = renderHook(() => useMyHook(), { wrapper });
|
|
```
|
|
|
|
## Utilities
|
|
|
|
**`vitest/utils/flushPromises.ts`** — call after an action that triggers async effects (e.g. a state update followed by a data fetch) to flush all pending microtasks before asserting:
|
|
|
|
```tsx
|
|
import flushPromises from 'vitest/utils/flushPromises';
|
|
|
|
await userEvent.click(button);
|
|
await flushPromises();
|
|
expect(screen.getByText('Loaded')).toBeInTheDocument();
|
|
```
|
|
|
|
## Mocking fetch responses
|
|
|
|
`vitest-fetch-mock` is active globally. Mock responses before the code under test runs:
|
|
|
|
```tsx
|
|
fetchMock.mockResponseOnce(JSON.stringify({ data: 'value' }));
|
|
```
|
|
|
|
Reset mocks between tests using `beforeEach` / `afterEach` if needed.
|