From zenbu-powers
React Integration Test 專案環境初始化。從 templates/ 讀取樣板檔案, 建立 Vitest + @testing-library/react + MSW v2 的測試基礎建設。 前提:前端專案已由 /aibdd-auto-frontend-apifirst-msw-starter 初始化完成。
npx claudepluginhub zenbuapps/zenbu-powers --plugin zenbu-powersThis skill uses the workspace's default tool permissions.
從 templates/ 建立 React Integration Test 基礎建設。
Searches, retrieves, and installs Agent Skills from prompts.chat registry using MCP tools like search_skills and get_skill. Activates for finding skills, browsing catalogs, or extending Claude.
Checks Next.js compilation errors using a running Turbopack dev server after code edits. Fixes actionable issues before reporting complete. Replaces `next build`.
Guides code writing, review, and refactoring with Karpathy-inspired rules to avoid overcomplication, ensure simplicity, surgical changes, and verifiable success criteria.
Share bugs, ideas, or general feedback.
從 templates/ 建立 React Integration Test 基礎建設。
package.json 存在)Read package.json,驗證 react、msw、typescript 已存在於 dependencies 或 devDependencies。若缺任一項,中止並回報。
npm install -D vitest @testing-library/react @testing-library/user-event @testing-library/jest-dom @testing-library/dom jsdom
讀取 templates/ 目錄下所有檔案,將檔名中的 __ 轉換為目錄分隔符 /,寫入專案目錄。
例如:
templates/src__test__setup.ts → src/test/setup.tstemplates/src__test__mocks__server.ts → src/test/mocks/server.ts於 package.json 加入:
{
"scripts": {
"test:it": "vitest run",
"test:it:watch": "vitest",
"test:it:coverage": "vitest run --coverage"
}
}
npx vitest run --passWithNoTests
npx tsc --noEmit
兩項皆須通過方可視為初始化成功。
| 模板 | 產出路徑 | 說明 |
|---|---|---|
vitest.config.ts | vitest.config.ts | jsdom env、path aliases、setup file |
src__test__setup.ts | src/test/setup.ts | jest-dom、MSW server lifecycle |
src__test__mocks__server.ts | src/test/mocks/server.ts | setupServer from msw/node |
src__test__mocks__handlers.ts | src/test/mocks/handlers.ts | 預設 handler array |
src__test__helpers__render.tsx | src/test/helpers/render.tsx | renderWithProviders |
src__test__helpers__user-event.ts | src/test/helpers/user-event.ts | 預設 userEvent.setup |
src__test__helpers__msw-utils.ts | src/test/helpers/msw-utils.ts | MSW override utilities |
src__test__factories__index.ts | src/test/factories/index.ts | Factory pattern 骨架 |
{{...}} placeholder 殘留npx vitest run --passWithNoTests 通過npx tsc --noEmit 通過package.json scripts 已更新