- Tanstack Router:
main
branch - React Router:
using-react-router
branch
- https://bun.sh
- https://vitejs.dev
- https://react-hook-form.com
- https://zod.dev
- https://tanstack.com/router/latest
- https://tailwindcss.com
- https://zustand-demo.pmnd.rs
- https://tanstack.com
- https://vitest.dev
- https://playwright.dev
$ git clone https://github.com/webmasterdevlin/zustand-immer-react-query-course.git
$ cd zustand-immer-react-query-course
$ bun install
$ bun run start
$ npx playwright install
$ bun run test:e2e
The React app, and the fake web service will run concurrently.
- routeTree.gen.ts is an auto generated route tree
- bun i -D msw
- the msw is a mocking library which will intercept the requests and responses in the integration tests
- create ./src/mocks/handler/todoHandler.ts
- create ./src/mocks/handler/index.ts
- create ./src/mocks/server.ts
- update the ./src/setupTests.ts
- write integration tests for the fetch todos function of WorkTodosPage.tsx by creating ./src/pages/tests/WorkTodosPage.test.ts
- run the tests, pnpm run test, and see if the todos are rendered
- the beforeEach does not work
beforeEach(() => {
queryClient.clear();
});