iswa/budget-app
1
0
Fork 0
Code Issues Pull Requests 7 Actions Packages Projects Releases Wiki Activity

Add unit testing infrastructure with Vitest

Browse Source 
Set up Vitest for both server (Node + Supertest) and client (jsdom + React
Testing Library). Extract Express app into app.js for testability. Add example
tests covering bills validation, bills route CRUD, ThemeContext, and App nav
rendering. Update CLAUDE.md with testing docs and requirement to write tests
with features.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Iswa Iswa
2026-03-19 21:03:29 -04:00
parent 10f8debdf5
commit e9f5a48f2d
15 changed files with 3851 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
CLAUDE.md
View File

@@ -5,6 +5,7 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
## Agent Workflow Rules
- **Commit after every task**: When a task is complete, stage all changed files and create a git commit before marking the task done.
- **Write tests with features**: New features and bug fixes must include unit tests. Run `npm test` in both `server/` and `client/` before committing.
- **Keep documentation current**: Update `CLAUDE.md` after every task that adds, changes, or removes a feature, API endpoint, or architectural pattern. This is mandatory, not optional. Update `PRD.md` only if scope/design decisions changed.
- **Mark tasks in td**: `td start <id>` when beginning, `td close <id>` when done.
- **Run td commands one at a time**: Never chain `td` commands with `&&` or `;`. Each `td` call must be its own separate shell invocation.
@@ -50,6 +51,32 @@ cd client && npm install && npm run dev
cd server && npm install && npm run dev
```
## Testing
Unit tests are required when adding or modifying features. Both server and client use [Vitest](https://vitest.dev/).
**Run all tests:**
```bash
cd server && npm test # server unit tests
cd client && npm test # client unit tests
```
**Watch mode (re-runs on file change):**
```bash
cd server && npm run test:watch
cd client && npm run test:watch
```
**Server tests** (`server/src/__tests__/`): Use Vitest + [Supertest](https://github.com/ladakh/supertest) for route testing. The CJS server code requires mocking `db.pool.query` directly (replace the method on the shared pool object) rather than using `vi.mock` for CJS modules. Validation and pure logic functions are exported and tested directly. See `bills.validation.test.js` and `bills.routes.test.js` for patterns.
**Client tests** (`client/src/__tests__/`): Use Vitest + [React Testing Library](https://testing-library.com/docs/react-testing-library/intro/). jsdom environment is configured via `client/vitest.config.js`. The test setup file (`client/src/test/setup.js`) provides `@testing-library/jest-dom` matchers and polyfills like `window.matchMedia`. See `ThemeContext.test.jsx` and `App.test.jsx` for patterns.
**When adding features:**
- Add unit tests for new validation logic, utility functions, and API routes
- Add component tests for new React components or significant UI changes
- Export pure functions (validators, formatters, etc.) for direct testing
- Run `npm test` in both `server/` and `client/` before committing
## Application Structure
The default route `/` renders the paycheck-centric main view (`client/src/pages/PaycheckView.jsx`). It shows the current month's two paychecks side-by-side with bills, paid status, one-time expenses, and remaining balance. Month navigation (prev/next) fetches data via `GET /api/paychecks?year=&month=`.