mirror of
https://github.com/affaan-m/everything-claude-code.git
synced 2026-06-16 16:36:53 +08:00
5108b20954
* feat(rules): add vue and nuxt rule sets Add rules/vue/ and rules/nuxt/, each with the standard 5-file layout (coding-style, hooks, patterns, security, testing) that extends common/, following the Adding a New Language convention in rules/README.md. Vue rules reference the frontend-patterns and vite-patterns skills. Nuxt rules reference the nuxt4-patterns and vite-patterns skills. Content is concise (1.5 to 4 KB per file) since rules load as always-on context. * fix(rules): address PR review on vue and nuxt rule sets - nuxt/coding-style: generalize the srcDir-override note (drop project-specific 'this repo' phrasing so it is correct for any Nuxt project). - vue/hooks: add **/*.ts and **/*.tsx to paths so the lint/typecheck guidance loads when editing composables and stores. - nuxt/hooks: add **/*.vue to paths (covers pages/layouts/components) and wrap nuxi typecheck in a timeout, mirroring web/hooks.md. - nuxt/security: tighten the /security-review auto-trigger scope to external fetch, credential handling, and sensitive mutations, with examples. - nuxt/testing: correct 'Vitest-only' to note built-in Playwright E2E, and drop the @nuxt/test-utils version pin. - README: register vue and nuxt in the structure tree and install examples. Skipped: 'X specific' -> 'X-specific' hyphenation (all existing rule sets use the unhyphenated form, changing only vue/nuxt would be inconsistent); repeating the 80%/TDD mandate in nuxt/testing (already inherited from common/testing.md).
50 lines
2.3 KiB
Markdown
50 lines
2.3 KiB
Markdown
---
|
|
paths:
|
|
- "**/nuxt.config.*"
|
|
- "**/server/**/*.ts"
|
|
- "**/pages/**"
|
|
- "**/layouts/**"
|
|
- "**/middleware/**"
|
|
---
|
|
|
|
# Nuxt Testing
|
|
|
|
> This file extends [common/testing.md](../common/testing.md) with Nuxt specific content.
|
|
|
|
Package: `@nuxt/test-utils`. Vitest-first for unit and component tests, with built-in Playwright browser E2E support. nuxt-vitest and vitest-environment-nuxt are superseded and folded into it.
|
|
|
|
## Setup
|
|
|
|
- Install dev deps: `@nuxt/test-utils vitest @vue/test-utils happy-dom playwright-core`.
|
|
- Config: `defineVitestConfig({ test: { environment: 'nuxt' } })` from `@nuxt/test-utils/config`. Use `defineVitestProject` for multi-project (separate unit / nuxt / e2e environments).
|
|
- Add `@nuxt/test-utils/module` to `nuxt.config`. Per-file opt-in via `// @vitest-environment nuxt`.
|
|
|
|
## Runtime helpers
|
|
|
|
Import from `@nuxt/test-utils/runtime`.
|
|
|
|
- `mountSuspended(component, opts)` mounts in the Nuxt env with async setup + plugin injection (accepts `@vue/test-utils` mount options + `route`).
|
|
- `renderSuspended(component, opts)` is the Testing Library variant (needs `@testing-library/vue`).
|
|
- `mockNuxtImport(name, factory)` mocks auto-imports (e.g. `useState`). Once per import per file, use `vi.hoisted()`.
|
|
- `mockComponent(name, factory)` mocks by PascalCase name or path.
|
|
- `registerEndpoint(path, handler|opts)` mocks a Nitro endpoint to test server routes or stub the backend. Supports method + `once`.
|
|
|
|
## E2E helpers
|
|
|
|
Import from `@nuxt/test-utils/e2e`.
|
|
|
|
- `await setup({ rootDir, server, browser, ... })` inside the describe block (manages beforeAll/afterAll).
|
|
- Then `$fetch(url)` (rendered HTML), `fetch(url)` (response object), `url(path)` (full URL with port), `createPage(url)` (Playwright).
|
|
- Playwright integration: import `expect` / `test` from `@nuxt/test-utils/playwright`.
|
|
|
|
## What to test how
|
|
|
|
- Composables: mock auto-imports with `mockNuxtImport`, mount a host component via `mountSuspended` to exercise `useState` / `useFetch` in the Nuxt runtime.
|
|
- Server routes: `registerEndpoint` to stub, or e2e `$fetch` / `fetch` against the real Nitro server.
|
|
|
|
## Reference
|
|
|
|
- ECC skills: `nuxt4-patterns`, `e2e-testing`, `vite-patterns`.
|
|
- [Nuxt testing docs](https://nuxt.com/docs/getting-started/testing)
|
|
- [@nuxt/test-utils npm](https://www.npmjs.com/package/@nuxt/test-utils)
|