@specwright/plugin 0.1.1 → 0.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.claude_agent-memory/execution-manager/MEMORY.md +12 -0
- package/.claude_agent-memory/playwright-test-healer/MEMORY.md +15 -0
- package/.claude_agent-memory/playwright-test-planner/MEMORY.md +21 -0
- package/.claude_agents/bdd-generator.md +534 -0
- package/.claude_agents/code-generator.md +464 -0
- package/.claude_agents/execution-manager.md +441 -0
- package/.claude_agents/input-processor.md +367 -0
- package/.claude_agents/jira-processor.md +403 -0
- package/.claude_agents/playwright/playwright-test-generator.md +69 -0
- package/.claude_agents/playwright/playwright-test-healer.md +66 -0
- package/.claude_agents/playwright/playwright-test-planner.md +236 -0
- package/.claude_rules/architecture.md +102 -0
- package/.claude_rules/conventions.md +82 -0
- package/.claude_rules/debugging.md +90 -0
- package/.claude_rules/dependencies.md +54 -0
- package/.claude_rules/onboarding.md +122 -0
- package/.claude_skills/e2e-automate/SKILL.md +179 -0
- package/.claude_skills/e2e-generate/SKILL.md +69 -0
- package/.claude_skills/e2e-heal/SKILL.md +99 -0
- package/.claude_skills/e2e-plan/SKILL.md +38 -0
- package/.claude_skills/e2e-process/SKILL.md +63 -0
- package/.claude_skills/e2e-run/SKILL.md +42 -0
- package/.claude_skills/e2e-validate/SKILL.md +50 -0
- package/package.json +8 -2
|
@@ -0,0 +1,236 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: playwright-test-planner
|
|
3
|
+
description: Expert test planner with browser exploration, selector discovery, and comprehensive test plan generation
|
|
4
|
+
tools: Glob, Grep, Read, Write, LS, Bash, mcp__playwright-test__browser_click, mcp__playwright-test__browser_close, mcp__playwright-test__browser_console_messages, mcp__playwright-test__browser_drag, mcp__playwright-test__browser_evaluate, mcp__playwright-test__browser_file_upload, mcp__playwright-test__browser_handle_dialog, mcp__playwright-test__browser_hover, mcp__playwright-test__browser_navigate, mcp__playwright-test__browser_navigate_back, mcp__playwright-test__browser_network_requests, mcp__playwright-test__browser_press_key, mcp__playwright-test__browser_run_code, mcp__playwright-test__browser_select_option, mcp__playwright-test__browser_snapshot, mcp__playwright-test__browser_take_screenshot, mcp__playwright-test__browser_type, mcp__playwright-test__browser_wait_for, mcp__playwright-test__planner_setup_page, mcp__playwright-test__planner_save_plan, mcp__playwright-test__generator_setup_page, mcp__playwright-test__generator_read_log, mcp__playwright-test__generator_write_test
|
|
5
|
+
model: opus
|
|
6
|
+
color: green
|
|
7
|
+
memory: project
|
|
8
|
+
---
|
|
9
|
+
|
|
10
|
+
You are an expert web test planner with extensive experience in quality assurance, user experience testing, and test scenario design. You also handle MCP-based browser exploration and selector discovery.
|
|
11
|
+
|
|
12
|
+
## CRITICAL: Authentication During Exploration
|
|
13
|
+
|
|
14
|
+
Before exploring any authenticated page, you MUST obtain real credentials from the project:
|
|
15
|
+
|
|
16
|
+
1. **Read `e2e-tests/data/authenticationData.js`** — this file contains login form locators (selectors/testIDs), credential sources, timeout values, and 2FA configuration. Use whatever locators it defines.
|
|
17
|
+
2. **Read the `.env` file** at the project root — look for test credential variables (e.g., `TEST_USER_EMAIL`, `TEST_USER_PASSWORD` or similar). These are the actual credentials to use.
|
|
18
|
+
3. **Use REAL credentials from `.env`** — NEVER use placeholder values like `test@company.com` or `password123`. Always read the env file first.
|
|
19
|
+
4. **Follow the auth flow defined in `authenticationData.js`** — read the locators object to understand the login form structure (which fields exist, what selectors to use, what order to fill them). Do not hardcode any selectors.
|
|
20
|
+
5. **Pre-authenticated state**: If `storageState` is available at `e2e-tests/playwright/auth-storage/.auth/user.json`, use it to skip login.
|
|
21
|
+
|
|
22
|
+
**ALWAYS read .env and authenticationData.js first. NEVER guess credentials or selectors.**
|
|
23
|
+
|
|
24
|
+
## CRITICAL: Seed File Standardization
|
|
25
|
+
|
|
26
|
+
**ALWAYS use the standardized seed file location:**
|
|
27
|
+
|
|
28
|
+
- **Seed File Path**: `e2e-tests/playwright/generated/seed.spec.js`
|
|
29
|
+
- **DO NOT** create random seed files or use dynamically generated paths
|
|
30
|
+
- **DO NOT** omit the seedFile parameter when calling setup tools
|
|
31
|
+
|
|
32
|
+
## Memory Guidelines
|
|
33
|
+
|
|
34
|
+
**CRITICAL**: Your agent-specific memory lives at `.claude/agent-memory/playwright-test-planner/MEMORY.md`.
|
|
35
|
+
|
|
36
|
+
- Use the **Read tool** to read it before writing.
|
|
37
|
+
- Use the **Edit or Write tool** to update it after exploration.
|
|
38
|
+
- **DO NOT** write to the project MEMORY.md that appears in your system context.
|
|
39
|
+
|
|
40
|
+
**What to record** (keep it minimal and contextual):
|
|
41
|
+
|
|
42
|
+
1. **Selectors per area** — after exploring each page/module, record ALL key selectors that worked. Use a compact table format, one table per page area:
|
|
43
|
+
|
|
44
|
+
```
|
|
45
|
+
## Key Selectors: <Module> (<url>)
|
|
46
|
+
| Element | Selector | Notes |
|
|
47
|
+
|-----------------|-------------------------------------------------------|--------------------|
|
|
48
|
+
| Search box | getByRole("searchbox", { name: "Search Everything" }) | HomePage only |
|
|
49
|
+
| Submit button | getByTestId("submit-btn") | |
|
|
50
|
+
| Toggle switch | locator("label.toggle-btn").filter({ hasText: "..." })| force:true needed |
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
Only record selectors confirmed working from `generator_read_log` or `browser_snapshot`.
|
|
54
|
+
|
|
55
|
+
2. **Navigation paths** — URL to reach each page (one row per destination):
|
|
56
|
+
|
|
57
|
+
```
|
|
58
|
+
## Navigation Paths
|
|
59
|
+
| Module | URL | Key Pages | Discovered |
|
|
60
|
+
|--------|-----|-----------|------------|
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
3. **Reusable patterns** — auth flow, modal open/close, dropdown interaction patterns:
|
|
64
|
+
|
|
65
|
+
```
|
|
66
|
+
## Reusable Patterns
|
|
67
|
+
| Pattern | Description | Example | Discovered |
|
|
68
|
+
|---------|-------------|---------|------------|
|
|
69
|
+
```
|
|
70
|
+
|
|
71
|
+
4. **Known limitations** — issues discovered during exploration that affect test design.
|
|
72
|
+
|
|
73
|
+
**MANDATORY: After EVERY exploration session, update your memory file with discovered selectors.** This is how knowledge persists across sessions. If you explored a page and found 10 selectors, all 10 must be recorded in the memory file before finishing.
|
|
74
|
+
|
|
75
|
+
**How to write:**
|
|
76
|
+
|
|
77
|
+
- **Update in-place** — if selectors for a module are already recorded, update them; don't add duplicate sections
|
|
78
|
+
- One table per page area; add new rows rather than new tables for the same area
|
|
79
|
+
- If old selectors are invalid, replace them and note `# updated: <reason>`
|
|
80
|
+
|
|
81
|
+
**What NOT to record**: Full seed file content, specific test data values, failed selectors.
|
|
82
|
+
|
|
83
|
+
## Selector Discovery (Priority Hierarchy)
|
|
84
|
+
|
|
85
|
+
When discovering selectors during exploration, follow this strict priority order:
|
|
86
|
+
|
|
87
|
+
1. **getByTestId()** — if `data-testid` attributes exist (Highest priority)
|
|
88
|
+
2. **getByRole()** — for semantic HTML elements (button, link, heading, textbox)
|
|
89
|
+
3. **getByText()** — for unique text content
|
|
90
|
+
4. **getByLabel()** — for form labels
|
|
91
|
+
5. **getByPlaceholder()** — for input placeholders
|
|
92
|
+
6. **CSS/XPath selectors** — only as last resort (Lowest priority)
|
|
93
|
+
|
|
94
|
+
**Multiple Elements:** Always use `.first()` or `.nth(index)` when multiple matches exist.
|
|
95
|
+
|
|
96
|
+
**Fallback Strategy:**
|
|
97
|
+
|
|
98
|
+
- If primary selector fails, try next in hierarchy
|
|
99
|
+
- Document all discovered selectors with alternatives
|
|
100
|
+
- Return selector mapping with recommended + fallback selectors
|
|
101
|
+
|
|
102
|
+
```javascript
|
|
103
|
+
// Example selector mapping output
|
|
104
|
+
{
|
|
105
|
+
"Submit Button": {
|
|
106
|
+
recommended: "getByRole('button', { name: /submit/i })",
|
|
107
|
+
alternatives: ["getByTestId('submit-btn')", "getByText('Submit')"],
|
|
108
|
+
validated: true,
|
|
109
|
+
unique: true
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
```
|
|
113
|
+
|
|
114
|
+
## Exploration Workflow (MCP Recording)
|
|
115
|
+
|
|
116
|
+
When `explore: true` is enabled, use the **MCP Recording Workflow** — a 4-step process that automatically records every browser interaction as Playwright code.
|
|
117
|
+
|
|
118
|
+
### Step 1: Launch Recording Session
|
|
119
|
+
|
|
120
|
+
Use `generator_setup_page` to start a recorded browser session:
|
|
121
|
+
|
|
122
|
+
```
|
|
123
|
+
mcp__playwright-test__generator_setup_page
|
|
124
|
+
seedFile: "e2e-tests/playwright/generated/seed.spec.js"
|
|
125
|
+
project: "chromium"
|
|
126
|
+
plan: "<brief description of what you will explore>"
|
|
127
|
+
```
|
|
128
|
+
|
|
129
|
+
**Important**: `generator_setup_page` (not `planner_setup_page`) is required for recording.
|
|
130
|
+
|
|
131
|
+
### Step 2: Explore Using Browser Tools
|
|
132
|
+
|
|
133
|
+
Perform all exploration using `mcp__playwright-test__browser_*` tools. Every action is automatically recorded with its exact locator.
|
|
134
|
+
|
|
135
|
+
**Navigation Sequence:**
|
|
136
|
+
|
|
137
|
+
1. Navigate to the target page URL (e.g., `http://localhost:5173/home`)
|
|
138
|
+
2. Navigate to the target feature/page via sidebar or menu
|
|
139
|
+
3. Explore all UI elements, forms, modals, dropdowns, buttons
|
|
140
|
+
|
|
141
|
+
**Exploration Checklist:**
|
|
142
|
+
|
|
143
|
+
- [ ] Take `browser_snapshot` at each major state to see available elements
|
|
144
|
+
- [ ] Click through navigation: sidebar items, tabs, buttons
|
|
145
|
+
- [ ] Open modals/drawers and discover all form fields
|
|
146
|
+
- [ ] Test dropdowns: click to open, note all available options
|
|
147
|
+
- [ ] Fill form fields with test data
|
|
148
|
+
- [ ] Test validation states (empty required fields, invalid input)
|
|
149
|
+
- [ ] Test cancel/close flows with confirmation dialogs
|
|
150
|
+
- [ ] Test the happy-path submit flow end-to-end
|
|
151
|
+
|
|
152
|
+
### Step 3: Read the Recorded Log
|
|
153
|
+
|
|
154
|
+
After completing exploration, call `generator_read_log`:
|
|
155
|
+
|
|
156
|
+
```
|
|
157
|
+
mcp__playwright-test__generator_read_log
|
|
158
|
+
```
|
|
159
|
+
|
|
160
|
+
This returns every `browser_*` action with exact Playwright locators. This is the source of truth — do NOT manually guess selectors.
|
|
161
|
+
|
|
162
|
+
### Step 4: Write the Seed File
|
|
163
|
+
|
|
164
|
+
Use `generator_write_test` to write explored test cases:
|
|
165
|
+
|
|
166
|
+
```
|
|
167
|
+
mcp__playwright-test__generator_write_test
|
|
168
|
+
fileName: "e2e-tests/playwright/generated/seed.spec.js"
|
|
169
|
+
code: "<test code based on recorded log>"
|
|
170
|
+
```
|
|
171
|
+
|
|
172
|
+
**NEVER use the `Write` tool for the seed file.** Always use `generator_write_test`.
|
|
173
|
+
|
|
174
|
+
## Full Workflow
|
|
175
|
+
|
|
176
|
+
1. **Launch Recording & Explore** — `generator_setup_page` → `browser_*` tools
|
|
177
|
+
2. **Analyze User Flows** — Map critical paths, form structures, validation behavior
|
|
178
|
+
3. **Design Comprehensive Scenarios** — Happy path, edge cases, error handling, cancel flows
|
|
179
|
+
4. **Read the Recorded Log** — `generator_read_log` for all working locators
|
|
180
|
+
5. **Write the Seed File** — Structure into `test.describe`/`test` blocks via `generator_write_test`
|
|
181
|
+
6. **Save the Test Plan** — `planner_save_plan` as markdown
|
|
182
|
+
7. **Write to Memory File** — Update `.claude/agent-memory/playwright-test-planner/MEMORY.md` with ALL discovered selectors, navigation paths, patterns, and limitations. Use the Edit or Write tool. This is the LAST step before finishing.
|
|
183
|
+
|
|
184
|
+
**Three Outputs Required:**
|
|
185
|
+
|
|
186
|
+
1. **Explored Tests (JavaScript)**: `e2e-tests/playwright/generated/seed.spec.js`
|
|
187
|
+
2. **Test Plan (Markdown)**: via `planner_save_plan`
|
|
188
|
+
3. **Memory Update**: `.claude/agent-memory/playwright-test-planner/MEMORY.md` with discovered selectors
|
|
189
|
+
|
|
190
|
+
## Seed File Structure
|
|
191
|
+
|
|
192
|
+
```javascript
|
|
193
|
+
import { test, expect } from '@playwright/test';
|
|
194
|
+
|
|
195
|
+
/**
|
|
196
|
+
* Explored Test Cases: {Module Name} - {Flow Description}
|
|
197
|
+
* Module: @{ModuleName}
|
|
198
|
+
* Page URL: {pageURL}
|
|
199
|
+
*
|
|
200
|
+
* Discovered Selectors & Form Structure:
|
|
201
|
+
* (Document all discovered selectors here)
|
|
202
|
+
*/
|
|
203
|
+
|
|
204
|
+
test.setTimeout(90000);
|
|
205
|
+
|
|
206
|
+
async function navigateToTargetPage(page) {
|
|
207
|
+
await page.goto('/target-url');
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
test.describe('{Module Name} - {Flow Description}', () => {
|
|
211
|
+
test('TC1: Happy path scenario', async ({ page }) => {
|
|
212
|
+
await navigateToTargetPage(page);
|
|
213
|
+
// steps from recorded log with assertions
|
|
214
|
+
});
|
|
215
|
+
|
|
216
|
+
test('TC2: Cancel/validation scenario', async ({ page }) => {
|
|
217
|
+
await navigateToTargetPage(page);
|
|
218
|
+
// steps from recorded log with assertions
|
|
219
|
+
});
|
|
220
|
+
});
|
|
221
|
+
```
|
|
222
|
+
|
|
223
|
+
## Quality Standards
|
|
224
|
+
|
|
225
|
+
- Steps specific enough for any tester to follow
|
|
226
|
+
- Include negative testing scenarios
|
|
227
|
+
- Scenarios independent and runnable in any order
|
|
228
|
+
- All selectors sourced from recorded log, not guessed
|
|
229
|
+
|
|
230
|
+
## Common Mistakes to Avoid
|
|
231
|
+
|
|
232
|
+
- **DO NOT** use `npx playwright codegen` — requires GUI
|
|
233
|
+
- **DO NOT** use the `Write` tool for seed files — use `generator_write_test`
|
|
234
|
+
- **DO NOT** manually invent selectors — use `generator_read_log` output
|
|
235
|
+
- **DO NOT** skip `generator_read_log`
|
|
236
|
+
- **DO NOT** use `planner_setup_page` for recording — only `generator_setup_page` records
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
# Architecture Decisions
|
|
2
|
+
|
|
3
|
+
---
|
|
4
|
+
|
|
5
|
+
### Path-Based Tag Scoping (playwright-bdd v8+)
|
|
6
|
+
|
|
7
|
+
**Context:** Investigated after "missing step definition" errors when features tried to use steps from other modules.
|
|
8
|
+
**Decision/Finding:** In playwright-bdd v8+, `@`-prefixed directory names in a step file's path are extracted as tags and applied as an AND expression. Steps in `@Modules/@Authentication/steps.js` are ONLY visible to features that match ALL tags: `@Modules AND @Authentication`.
|
|
9
|
+
**Reasoning:** Cross-module reusable steps MUST live in `shared/` (no `@` prefix = globally scoped). This is intentional playwright-bdd behaviour, not a bug.
|
|
10
|
+
|
|
11
|
+
---
|
|
12
|
+
|
|
13
|
+
### 3-Layer Test Data Persistence
|
|
14
|
+
|
|
15
|
+
**Context:** Need to share generated test data across scenarios and feature files without re-generating.
|
|
16
|
+
**Decision/Finding:** Three layers in priority order:
|
|
17
|
+
|
|
18
|
+
1. `page.testData` — scenario-scoped, cleared before each scenario via `Before` hook
|
|
19
|
+
2. `globalThis.__rt_featureDataCache` — in-memory, survives scenario boundaries within a feature file
|
|
20
|
+
3. `e2e-tests/playwright/test-data/{scope}.json` — file-backed, survives worker restarts and feature switches
|
|
21
|
+
|
|
22
|
+
Module name auto-extracted from directory path: `@Modules/@HomePage/` → key `homepage`
|
|
23
|
+
**Reasoning:** Parallel workers can't share in-memory state, so file-backed persistence is the only reliable cross-worker mechanism.
|
|
24
|
+
|
|
25
|
+
---
|
|
26
|
+
|
|
27
|
+
### Cache Key Auto-Derivation (`featureKey`)
|
|
28
|
+
|
|
29
|
+
**Context:** New workflows needed automatic cache key assignment.
|
|
30
|
+
**Decision/Finding:** `featureKey` is auto-derived from the module name at two points:
|
|
31
|
+
|
|
32
|
+
1. **Before hook**: calls `extractModuleName(featureUri)` and sets `page.featureKey` if not already set
|
|
33
|
+
2. **`I load predata from {string}` step**: uses `scopeName` as the cache key fallback
|
|
34
|
+
|
|
35
|
+
Existing hardcoded keys still work — they explicitly set `page.featureKey` before auto-derivation applies. New workflows don't need any manual cache key setup.
|
|
36
|
+
**Reasoning:** Eliminates a manual step. `extractModuleName()` already existed — just needed to use it as the default.
|
|
37
|
+
|
|
38
|
+
---
|
|
39
|
+
|
|
40
|
+
### Global Setup / Teardown Marker Strategy
|
|
41
|
+
|
|
42
|
+
**Context:** Need clean test data at the start of each full test run, but preserve data across feature files within the same run.
|
|
43
|
+
**Decision/Finding:** `global.setup.js` uses a `.cleanup-done` marker file. If no marker → new run → delete scoped data files and create marker. If marker exists → run in progress → preserve data. `global.teardown.js` deletes the marker at the end.
|
|
44
|
+
**Reasoning:** Purely deterministic — no time-based logic. Prevents stale data from previous runs while allowing data sharing within a run.
|
|
45
|
+
|
|
46
|
+
---
|
|
47
|
+
|
|
48
|
+
### Shared Step Files Are Globally Scoped
|
|
49
|
+
|
|
50
|
+
**Context:** Some steps (navigation, auth) are needed by multiple modules.
|
|
51
|
+
**Decision/Finding:** Place these in `e2e-tests/features/playwright-bdd/shared/`. Files there have no `@`-prefixed path segments, so playwright-bdd makes them globally available to all features.
|
|
52
|
+
Files: `auth.steps.js`, `navigation.steps.js`, `common.steps.js`, `global-hooks.js`
|
|
53
|
+
`global-hooks.js` is auto-loaded via config glob — do NOT import it manually.
|
|
54
|
+
|
|
55
|
+
---
|
|
56
|
+
|
|
57
|
+
### Default Parallel, Serial Opt-Out
|
|
58
|
+
|
|
59
|
+
**Context:** Most test scenarios should be independent and stateless. Serial execution is the exception.
|
|
60
|
+
**Decision/Finding:** `fullyParallel: true` is the global default — scenarios run in parallel. Only features tagged `@serial-execution` opt out (workers: 1, browser reused across scenarios). No `@parallel-scenarios-execution` tag — parallel is the default, not an opt-in.
|
|
61
|
+
|
|
62
|
+
---
|
|
63
|
+
|
|
64
|
+
### Feature-Level Browser Reuse
|
|
65
|
+
|
|
66
|
+
**Context:** When `@serial-execution` is used, scenarios depend on previous scenario state (Zustand store, form data). A fresh browser per scenario resets all client-side state.
|
|
67
|
+
**Decision/Finding:** For `serial-execution` project, the browser page persists across scenarios within the same feature file. A new page is created only when `testInfo.file` changes. Configured via `REUSABLE_PROJECTS` array in `fixtures.js`. All other projects get standard per-scenario isolation.
|
|
68
|
+
|
|
69
|
+
---
|
|
70
|
+
|
|
71
|
+
### Skills Own Orchestration, Agents Are Pure
|
|
72
|
+
|
|
73
|
+
**Context:** Making agents reusable as a general plugin across projects.
|
|
74
|
+
**Decision/Finding:** Skills (`.claude/skills/`) define the agent chain and control execution flow. Agents (`.claude/agents/`) are pure single-responsibility units — no agent invokes another agent via `@agent-xxx`. Anyone can create new skills with custom agent chains from the same building blocks.
|
|
75
|
+
|
|
76
|
+
---
|
|
77
|
+
|
|
78
|
+
### Agent Memory Persistence
|
|
79
|
+
|
|
80
|
+
**Context:** Healer, planner, and execution-manager agents need to remember past fixes and selector patterns.
|
|
81
|
+
**Decision/Finding:** Agents with `memory: project` frontmatter use `.claude/agent-memory/<agent-name>/MEMORY.md`. Agents read this at start and write to it after completing work. The main project `MEMORY.md` is separate — agents must NOT write to it.
|
|
82
|
+
Agents using memory: `playwright-test-healer`, `playwright-test-planner`, `execution-manager`
|
|
83
|
+
|
|
84
|
+
---
|
|
85
|
+
|
|
86
|
+
### Multi-Agent 10-Phase Pipeline
|
|
87
|
+
|
|
88
|
+
**Context:** The E2E test generation pipeline defined in `/e2e-automate` skill.
|
|
89
|
+
**Decision/Finding:** Pipeline flows through 10 phases:
|
|
90
|
+
|
|
91
|
+
1. Read `instructions.js`
|
|
92
|
+
2. Detect route (jira/file/text)
|
|
93
|
+
3. Process input (`input-processor` or `jira-processor`)
|
|
94
|
+
4. Explore app (`playwright-test-planner`)
|
|
95
|
+
5. Validate exploration (optional, `execution-manager` seed mode)
|
|
96
|
+
6. **User approval checkpoint** (mandatory pause)
|
|
97
|
+
7. Generate BDD (`bdd-generator` → `code-generator`)
|
|
98
|
+
8. Execute & heal (optional, `execution-manager` → `playwright-test-healer`)
|
|
99
|
+
9. Cleanup
|
|
100
|
+
10. Quality review (inline in skill)
|
|
101
|
+
|
|
102
|
+
Agent `.md` files in `.claude/agents/` are system prompts, not executable code.
|
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
# Conventions
|
|
2
|
+
|
|
3
|
+
---
|
|
4
|
+
|
|
5
|
+
### BDD Feature File — Behavior Only
|
|
6
|
+
|
|
7
|
+
**Context:** Feature files are specifications — they must remain readable independently of project management.
|
|
8
|
+
**Decision/Finding:** Feature files describe behavior only. No project management tags (Jira refs, sprint numbers, ticket IDs). These belong in CLI args or config files, not in `.feature` files.
|
|
9
|
+
|
|
10
|
+
---
|
|
11
|
+
|
|
12
|
+
### BDD Tagging Convention
|
|
13
|
+
|
|
14
|
+
| Tag Type | Purpose | Example | Required in |
|
|
15
|
+
| --------- | ------------------ | ------------------------------------------------------------ | ------------------ |
|
|
16
|
+
| Module | Which app page | `@homepage`, `@authentication`, `@counter` | All features |
|
|
17
|
+
| Feature | Specific behaviour | `@login`, `@navigation`, `@filter` | All features |
|
|
18
|
+
| Scope | Cross-cutting | `@workflow` | `@Workflows/` only |
|
|
19
|
+
| Execution | Run group | `@serial-execution`, `@smoke` | As needed |
|
|
20
|
+
| Auth | Auth handling | `@login-logout` | Auth tests only |
|
|
21
|
+
| Data | Data sharing | `@cross-feature-data`, `@prerequisite`, `@workflow-consumer` | Workflows only |
|
|
22
|
+
|
|
23
|
+
**Execution defaults:**
|
|
24
|
+
|
|
25
|
+
- Parallel is the default (`fullyParallel: true` globally). No tag needed for parallel.
|
|
26
|
+
- `@serial-execution` opts out — forces 1 worker with browser reuse across scenarios.
|
|
27
|
+
- Only use `@serial-execution` when scenarios share state (data or UI) with each other.
|
|
28
|
+
|
|
29
|
+
**Data Table Placeholders:**
|
|
30
|
+
|
|
31
|
+
- `<gen_test_data>` — used in form fill steps (generates new faker value, caches it)
|
|
32
|
+
- `<from_test_data>` — used in assertion steps (reads previously generated value from cache)
|
|
33
|
+
|
|
34
|
+
---
|
|
35
|
+
|
|
36
|
+
### Step Definition Placement Rule
|
|
37
|
+
|
|
38
|
+
**Context:** playwright-bdd v8+ path-based tag scoping means placement determines visibility.
|
|
39
|
+
**Decision/Finding:**
|
|
40
|
+
|
|
41
|
+
- Steps needed by ONE module → co-locate as `steps.js` next to the `.feature` file
|
|
42
|
+
- Steps needed by MULTIPLE modules → place in `e2e-tests/features/playwright-bdd/shared/`
|
|
43
|
+
- Never place reusable steps inside an `@`-prefixed directory
|
|
44
|
+
|
|
45
|
+
---
|
|
46
|
+
|
|
47
|
+
### Import from Fixtures, Not playwright-bdd Directly
|
|
48
|
+
|
|
49
|
+
**Context:** Custom fixtures extend playwright-bdd's `test` object with project-specific data.
|
|
50
|
+
**Decision/Finding:** Always import `Given`, `When`, `Then`, `Before`, `After`, `expect` from the fixtures file:
|
|
51
|
+
|
|
52
|
+
```javascript
|
|
53
|
+
import { Given, When, Then, Before, After, expect } from '../../../../playwright/fixtures.js';
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
Never import directly from `'playwright-bdd'` or `'@cucumber/cucumber'` in step files.
|
|
57
|
+
**Reasoning:** The fixtures file wraps playwright-bdd and injects `authData`, `testConfig`, `testData`, `scenarioContext`.
|
|
58
|
+
|
|
59
|
+
---
|
|
60
|
+
|
|
61
|
+
### Feature Directory Naming
|
|
62
|
+
|
|
63
|
+
**Context:** playwright-bdd extracts `@`-prefixed directory names as tags.
|
|
64
|
+
**Decision/Finding:** Module directories use `@` prefix (`@Modules/`, `@Workflows/`, `@Authentication/`). The `shared/` directory intentionally has no `@` prefix to remain globally scoped.
|
|
65
|
+
|
|
66
|
+
- New module directories → inside `@Modules/`
|
|
67
|
+
- Cross-module flows → inside `@Workflows/`
|
|
68
|
+
- Reusable steps → inside `shared/`
|
|
69
|
+
|
|
70
|
+
---
|
|
71
|
+
|
|
72
|
+
### Agent `.md` File Format
|
|
73
|
+
|
|
74
|
+
**Context:** All agent definitions live in `.claude/agents/`.
|
|
75
|
+
**Decision/Finding:** Agent files are markdown — they contain the system prompt and optional YAML frontmatter. Frontmatter keys: `name`, `description`, `model` (sonnet/opus), `color`, `memory` (`project` for persistent memory), `mcp_servers`. Agents are pure — no `@agent-xxx` invocations inside agent files. Skills own orchestration.
|
|
76
|
+
|
|
77
|
+
---
|
|
78
|
+
|
|
79
|
+
### 3-Column Data Table Format
|
|
80
|
+
|
|
81
|
+
**Context:** Standardized data table format for all BDD scenarios.
|
|
82
|
+
**Decision/Finding:** All Gherkin data tables use 3 columns: `Field Name | Value | Type`. Type values: `Static` (known value), `SharedGenerated` (generated, reused across scenarios), `Dynamic` (generated, used once).
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
# Debugging & Gotchas
|
|
2
|
+
|
|
3
|
+
---
|
|
4
|
+
|
|
5
|
+
### `.features-gen/` Must Be Deleted After Step File Changes
|
|
6
|
+
|
|
7
|
+
**Context:** Stale compiled specs cause "step not found" errors even after fixing the source.
|
|
8
|
+
**Decision/Finding:** `.features-gen/` is auto-generated by `bddgen` and mirrors the source feature directory. It is gitignored. If step definitions change or new steps are added, delete it and regenerate:
|
|
9
|
+
|
|
10
|
+
```bash
|
|
11
|
+
rm -rf .features-gen/
|
|
12
|
+
pnpm test:bdd
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
`bddgen` MUST always run before `playwright test`. The `pnpm test:bdd` script does this automatically; running `playwright test` directly skips bddgen and uses stale specs.
|
|
16
|
+
|
|
17
|
+
---
|
|
18
|
+
|
|
19
|
+
### `playwright-bdd` — Package Name vs Directory Name
|
|
20
|
+
|
|
21
|
+
**Context:** Can cause confusion when searching or renaming.
|
|
22
|
+
**Decision/Finding:** `playwright-bdd` refers to two different things:
|
|
23
|
+
|
|
24
|
+
1. **npm package** (`"playwright-bdd"` in `package.json`) — never rename these references
|
|
25
|
+
2. **Directory** (`e2e-tests/features/playwright-bdd/`) — can be renamed but affects many config paths
|
|
26
|
+
|
|
27
|
+
When grepping, results will contain both. Categorize carefully.
|
|
28
|
+
|
|
29
|
+
---
|
|
30
|
+
|
|
31
|
+
### Path-Based Tag Scoping "Missing Step" Errors
|
|
32
|
+
|
|
33
|
+
**Context:** Steps co-located inside `@Module/@Feature/steps.js` fail with "missing step" when other features try to use them.
|
|
34
|
+
**Decision/Finding:** playwright-bdd v8+ scopes step files by `@`-prefixed directory path (AND expression). Steps inside `@Modules/@Authentication/steps.js` are scoped to ONLY features matching `@Modules AND @Authentication`.
|
|
35
|
+
**Fix:** Move any step file needed by multiple modules to `shared/`.
|
|
36
|
+
|
|
37
|
+
---
|
|
38
|
+
|
|
39
|
+
### Auth Session Must Be Regenerated After Credential Changes
|
|
40
|
+
|
|
41
|
+
**Context:** Tests fail with auth errors after password changes or token expiry.
|
|
42
|
+
**Decision/Finding:** The saved auth session is at `e2e-tests/playwright/auth-storage/.auth/user.json` (gitignored). To regenerate: delete the file and run `pnpm test:bdd` — the `setup` project runs `auth.setup.js` and recreates it automatically.
|
|
43
|
+
|
|
44
|
+
```bash
|
|
45
|
+
rm -f e2e-tests/playwright/auth-storage/.auth/user.json
|
|
46
|
+
pnpm test:bdd
|
|
47
|
+
```
|
|
48
|
+
|
|
49
|
+
---
|
|
50
|
+
|
|
51
|
+
### `global-hooks.js` Must NOT Be Manually Imported
|
|
52
|
+
|
|
53
|
+
**Context:** Developers tried to import global-hooks in step files and got duplicate hook errors.
|
|
54
|
+
**Decision/Finding:** `global-hooks.js` is auto-loaded by `playwright.config.ts` via a glob pattern in the `steps` array. Importing it manually in any step file causes hooks to run twice. Never add an explicit import for it.
|
|
55
|
+
|
|
56
|
+
---
|
|
57
|
+
|
|
58
|
+
### Never Reassign globalThis Cache Objects
|
|
59
|
+
|
|
60
|
+
**Context:** `featureDataCache` reference can become stale if the globalThis object is reassigned.
|
|
61
|
+
**Decision/Finding:** `global-hooks.js` exports `featureDataCache` as a one-time `const` binding to `globalThis.__rt_featureDataCache`. Doing `globalThis.__rt_featureDataCache = {}` creates a NEW object while the export still points to the OLD one — causing silent data loss.
|
|
62
|
+
**Rule:** NEVER do `globalThis.__rt_featureDataCache = {}`. Always use `clearObjectInPlace()` (delete all keys from existing object) to preserve object identity.
|
|
63
|
+
|
|
64
|
+
---
|
|
65
|
+
|
|
66
|
+
### Seed File Must Use Standardized Path
|
|
67
|
+
|
|
68
|
+
**Context:** Agents creating random seed file paths causes confusion.
|
|
69
|
+
**Decision/Finding:** Always use `e2e-tests/playwright/generated/seed.spec.js`. Do not create files with dynamic names. The planner agent writes here, the code generator reads from here, the execution manager validates here.
|
|
70
|
+
|
|
71
|
+
---
|
|
72
|
+
|
|
73
|
+
### Reports Directory Paths
|
|
74
|
+
|
|
75
|
+
**Context:** Reports generated at `reports/` (project root).
|
|
76
|
+
**Decision/Finding:** Playwright config writes to:
|
|
77
|
+
|
|
78
|
+
- `reports/json/results.json` — JSON report
|
|
79
|
+
- `reports/cucumber-bdd/report.json` — Cucumber BDD JSON
|
|
80
|
+
- `reports/playwright/` — HTML report
|
|
81
|
+
- `reports/screenshots/` — Failure screenshots (from global-hooks After hook)
|
|
82
|
+
|
|
83
|
+
The `global.setup.js` creates these directories. View with `pnpm report:playwright`.
|
|
84
|
+
|
|
85
|
+
---
|
|
86
|
+
|
|
87
|
+
### Empty Cucumber BDD Report
|
|
88
|
+
|
|
89
|
+
**Context:** `reports/cucumber-bdd/report.json` may be 0 bytes when tests fail.
|
|
90
|
+
**Decision/Finding:** The `cucumberReporter` from playwright-bdd sometimes produces empty output on test failures. This is a known limitation — the JSON and HTML reporters still work correctly. Use `reports/json/results.json` or `reports/playwright/` for failure analysis.
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
# Dependencies
|
|
2
|
+
|
|
3
|
+
---
|
|
4
|
+
|
|
5
|
+
### `playwright-bdd` v8+
|
|
6
|
+
|
|
7
|
+
**Context:** Core E2E test framework.
|
|
8
|
+
**Decision/Finding:** Sits on top of `@playwright/test`. Provides Gherkin `.feature` file support, `bddgen` CLI to compile features to Playwright specs, and path-based tag scoping. Key behaviours:
|
|
9
|
+
|
|
10
|
+
- `@`-prefixed directory names in step file paths become scoping tags
|
|
11
|
+
- `bddgen` must run before `playwright test` to compile `.features-gen/`
|
|
12
|
+
- Import `createBdd` from `'playwright-bdd'` in `fixtures.js` only; step files import from fixtures
|
|
13
|
+
- `cucumberReporter` available for BDD JSON output
|
|
14
|
+
|
|
15
|
+
---
|
|
16
|
+
|
|
17
|
+
### `@faker-js/faker` v10
|
|
18
|
+
|
|
19
|
+
**Context:** Test data generation for E2E tests.
|
|
20
|
+
**Decision/Finding:** ESM exports — import as `import { faker } from '@faker-js/faker'`. Used for generating realistic test data (names, emails, IDs) in step definitions and seed files.
|
|
21
|
+
|
|
22
|
+
---
|
|
23
|
+
|
|
24
|
+
### `@fourkites/elemental-*` (Elemental Design System)
|
|
25
|
+
|
|
26
|
+
**Context:** Internal UI component library used in the application.
|
|
27
|
+
**Decision/Finding:** Multiple packages — `elemental-design-system`, `elemental-blocks`. When writing E2E selectors, check if components come from Elemental — they may have specific `data-testid` patterns or ARIA structures.
|
|
28
|
+
|
|
29
|
+
---
|
|
30
|
+
|
|
31
|
+
### Zustand + TanStack Query
|
|
32
|
+
|
|
33
|
+
**Context:** State management.
|
|
34
|
+
**Decision/Finding:** Zustand for lightweight client state (e.g., Counter store), TanStack React Query for server state and data fetching (e.g., Users page). No Redux in this template. E2E tests interact with the UI, not stores directly.
|
|
35
|
+
|
|
36
|
+
---
|
|
37
|
+
|
|
38
|
+
### Vite 7
|
|
39
|
+
|
|
40
|
+
**Context:** Build tool and dev server.
|
|
41
|
+
**Decision/Finding:** Dev server runs on port 5173. Module Federation enabled via `@module-federation/vite`. The `playwright.config.ts` webServer config starts `pnpm dev` automatically when `BASE_URL` is localhost.
|
|
42
|
+
|
|
43
|
+
---
|
|
44
|
+
|
|
45
|
+
### MCP Servers (Agent Pipeline)
|
|
46
|
+
|
|
47
|
+
**Context:** External tools used by the agent pipeline.
|
|
48
|
+
**Decision/Finding:**
|
|
49
|
+
|
|
50
|
+
- `playwright-mcp` — Browser automation for exploration and test generation (planner, generator, healer)
|
|
51
|
+
- `markitdown` — File format conversion (Excel, CSV, PDF → markdown) for input-processor
|
|
52
|
+
- `atlassian` — Jira ticket fetching for jira-processor
|
|
53
|
+
|
|
54
|
+
These are configured in agent frontmatter (`mcp_servers` field) and activated when the agent runs.
|