svelte-test — Claude Code command: tests for Svelte
This command creates tests for Svelte components and SvelteKit routes, from component behavior to end-to-end flows. Use it to cover user actions, form handling, and error states.
npx claude-code-templates@latest --command svelte/svelte-testWhat svelte-test does
The command examines a component, route, store, or utility, then chooses a suitable test approach. It checks existing patterns in the project and can draft tests for interactions, prop variations, events, route loaders, and form actions.
Component and unit tests can use Vitest; Playwright is the option for end-to-end user flows. The command also considers accessibility, edge cases, and errors. It can suggest performance and visual regression checks too, so review those against the needs of your project before adding them.
What it helps with
- test a component's view and edit modes
- cover route loaders and form actions
- check store updates and derived values
- write an end-to-end user flow
- add accessibility and error-state checks
Example prompts for the agent
- Create tests for the user profile component's edit mode.
- Test this route's loader and error handling.
- Add a Playwright test for form submission and navigation.
How to install svelte-test
1claude-code-templates
npx claude-code-templates@latest --command svelte/svelte-test2Manually: put the files in place
.claude/commands/svelte-test.mdCall it with /svelte-test. For all projects use ~/.claude/commands/
Manually: put the files in place
~/.codex/prompts/svelte-test.mdCall it with /prompts:svelte-test. Codex marks this format deprecated in favour of skills
Manually: put the files in place
.github/prompts/svelte-test.prompt.mdManually: put the files in place
.gemini/commands/svelte-test.tomlGemini stores commands as TOML: the prompt text goes into the prompt field
Questions about svelte-test
How do I install svelte-test in Claude Code?
Run npx claude-code-templates@latest --command svelte/svelte-test, then use .claude/commands/svelte-test.md.
What does svelte-test do?
It examines Svelte or SvelteKit code and creates suitable tests for components, routes, stores, or user flows.
Which testing tools does the command use?
It suggests Vitest for unit and component tests, and Playwright for end-to-end tests.
Source text
svelte-test.md · MIT
---
description: "Create comprehensive tests for Svelte components and SvelteKit routes, including unit tests, component tests, and E2E tests."
---
# /svelte:test
Create comprehensive tests for Svelte components and SvelteKit routes, including unit tests, component tests, and E2E tests.
## Instructions
You are acting as the Svelte Testing Specialist Agent. When creating tests:
1. **Analyze the Target**:
- Identify what needs testing (component, route, store, utility)
- Determine appropriate test types (unit, integration, E2E)
- Review existing test patterns in the codebase
2. **Test Creation Strategy**:
- **Component Tests**: User interactions, prop variations, slots, events
- **Route Tests**: Load functions, form actions, error handling
- **Store Tests**: State changes, derived values, subscriptions
- **E2E Tests**: User flows, navigation, form submissions
3. **Test Structure**:
```javascript
// Component Test Example
import { render, fireEvent } from '@testing-library/svelte';
import { expect, test, describe } from 'vitest';
describe('Component', () => {
test('user interaction', async () => {
// Arrange
// Act
// Assert
});
});
```
4. **Coverage Areas**:
- Happy path scenarios
- Edge cases and error states
- Accessibility requirements
- Performance constraints
- Security considerations
5. **Test Types to Generate**:
- Vitest unit/component tests
- Playwright E2E tests
- Accessibility tests
- Performance tests
- Visual regression tests
## Example Usage
User: "Create tests for my UserProfile component that has edit mode"
Assistant will:
- Analyze UserProfile component structure
- Create comprehensive component tests
- Test view/edit mode transitions
- Test form validation in edit mode
- Add accessibility tests
- Create E2E test for full user flow
- Suggest additional test scenarios
© davila7 · MIT · davila7/claude-code-templates