@sun-asterisk/sungen 2.4.2 → 2.4.3

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.
Files changed (72) hide show
  1. package/dist/cli/commands/add.js +2 -2
  2. package/dist/cli/commands/add.js.map +1 -1
  3. package/dist/cli/index.js +1 -1
  4. package/dist/generators/test-generator/code-generator.d.ts.map +1 -1
  5. package/dist/generators/test-generator/code-generator.js +27 -4
  6. package/dist/generators/test-generator/code-generator.js.map +1 -1
  7. package/dist/orchestrator/ai-rules-updater.d.ts.map +1 -1
  8. package/dist/orchestrator/ai-rules-updater.js +2 -0
  9. package/dist/orchestrator/ai-rules-updater.js.map +1 -1
  10. package/dist/orchestrator/project-initializer.d.ts +4 -0
  11. package/dist/orchestrator/project-initializer.d.ts.map +1 -1
  12. package/dist/orchestrator/project-initializer.js +20 -3
  13. package/dist/orchestrator/project-initializer.js.map +1 -1
  14. package/dist/orchestrator/screen-manager.d.ts +8 -0
  15. package/dist/orchestrator/screen-manager.d.ts.map +1 -1
  16. package/dist/orchestrator/screen-manager.js +120 -0
  17. package/dist/orchestrator/screen-manager.js.map +1 -1
  18. package/dist/orchestrator/templates/ai-instructions/claude-cmd-add-screen.md +6 -14
  19. package/dist/orchestrator/templates/ai-instructions/claude-cmd-create-test.md +10 -2
  20. package/dist/orchestrator/templates/ai-instructions/claude-cmd-review.md +5 -0
  21. package/dist/orchestrator/templates/ai-instructions/claude-cmd-run-test.md +21 -13
  22. package/dist/orchestrator/templates/ai-instructions/claude-config.md +4 -97
  23. package/dist/orchestrator/templates/ai-instructions/claude-skill-gherkin-syntax.md +48 -122
  24. package/dist/orchestrator/templates/ai-instructions/claude-skill-selector-fix.md +87 -23
  25. package/dist/orchestrator/templates/ai-instructions/claude-skill-tc-generation.md +62 -34
  26. package/dist/orchestrator/templates/ai-instructions/claude-skill-tc-review.md +19 -14
  27. package/dist/orchestrator/templates/ai-instructions/claude-skill-test-design-techniques.md +99 -0
  28. package/dist/orchestrator/templates/ai-instructions/claude-skill-viewpoint.md +151 -64
  29. package/dist/orchestrator/templates/ai-instructions/copilot-cmd-add-screen.md +5 -10
  30. package/dist/orchestrator/templates/ai-instructions/copilot-cmd-create-test.md +10 -3
  31. package/dist/orchestrator/templates/ai-instructions/copilot-cmd-review.md +5 -0
  32. package/dist/orchestrator/templates/ai-instructions/copilot-cmd-run-test.md +21 -13
  33. package/dist/orchestrator/templates/ai-instructions/copilot-config.md +4 -97
  34. package/dist/orchestrator/templates/ai-instructions/github-skill-sungen-gherkin-syntax.md +48 -122
  35. package/dist/orchestrator/templates/ai-instructions/github-skill-sungen-selector-fix.md +87 -23
  36. package/dist/orchestrator/templates/ai-instructions/github-skill-sungen-tc-generation.md +63 -29
  37. package/dist/orchestrator/templates/ai-instructions/github-skill-sungen-tc-review.md +19 -14
  38. package/dist/orchestrator/templates/ai-instructions/github-skill-sungen-test-design-techniques.md +99 -0
  39. package/dist/orchestrator/templates/ai-instructions/github-skill-sungen-viewpoint.md +151 -64
  40. package/dist/orchestrator/templates/readme.md +1 -1
  41. package/dist/orchestrator/templates/tsconfig.json +21 -0
  42. package/package.json +1 -1
  43. package/src/cli/commands/add.ts +2 -2
  44. package/src/cli/index.ts +1 -1
  45. package/src/generators/test-generator/code-generator.ts +29 -4
  46. package/src/orchestrator/ai-rules-updater.ts +2 -0
  47. package/src/orchestrator/project-initializer.ts +24 -3
  48. package/src/orchestrator/screen-manager.ts +124 -0
  49. package/src/orchestrator/templates/ai-instructions/claude-cmd-add-screen.md +6 -14
  50. package/src/orchestrator/templates/ai-instructions/claude-cmd-create-test.md +10 -2
  51. package/src/orchestrator/templates/ai-instructions/claude-cmd-review.md +5 -0
  52. package/src/orchestrator/templates/ai-instructions/claude-cmd-run-test.md +21 -13
  53. package/src/orchestrator/templates/ai-instructions/claude-config.md +4 -97
  54. package/src/orchestrator/templates/ai-instructions/claude-skill-gherkin-syntax.md +48 -122
  55. package/src/orchestrator/templates/ai-instructions/claude-skill-selector-fix.md +87 -23
  56. package/src/orchestrator/templates/ai-instructions/claude-skill-tc-generation.md +62 -34
  57. package/src/orchestrator/templates/ai-instructions/claude-skill-tc-review.md +19 -14
  58. package/src/orchestrator/templates/ai-instructions/claude-skill-test-design-techniques.md +99 -0
  59. package/src/orchestrator/templates/ai-instructions/claude-skill-viewpoint.md +151 -64
  60. package/src/orchestrator/templates/ai-instructions/copilot-cmd-add-screen.md +5 -10
  61. package/src/orchestrator/templates/ai-instructions/copilot-cmd-create-test.md +10 -3
  62. package/src/orchestrator/templates/ai-instructions/copilot-cmd-review.md +5 -0
  63. package/src/orchestrator/templates/ai-instructions/copilot-cmd-run-test.md +21 -13
  64. package/src/orchestrator/templates/ai-instructions/copilot-config.md +4 -97
  65. package/src/orchestrator/templates/ai-instructions/github-skill-sungen-gherkin-syntax.md +48 -122
  66. package/src/orchestrator/templates/ai-instructions/github-skill-sungen-selector-fix.md +87 -23
  67. package/src/orchestrator/templates/ai-instructions/github-skill-sungen-tc-generation.md +63 -29
  68. package/src/orchestrator/templates/ai-instructions/github-skill-sungen-tc-review.md +19 -14
  69. package/src/orchestrator/templates/ai-instructions/github-skill-sungen-test-design-techniques.md +99 -0
  70. package/src/orchestrator/templates/ai-instructions/github-skill-sungen-viewpoint.md +151 -64
  71. package/src/orchestrator/templates/readme.md +1 -1
  72. package/src/orchestrator/templates/tsconfig.json +21 -0
@@ -22,7 +22,7 @@ For append: read highest `VP-<CAT>-<NNN>`, continue from next number. Never modi
22
22
  When `qa/screens/<screen>/requirements/` exists:
23
23
  - **`spec.md`** — primary: sections, field constraints, validation messages, business rules, states
24
24
  - **`ui/`** — supplementary: screenshots for layout/visual context
25
- - **`notes.md`** — supplementary: edge cases, known issues
25
+ - **`test-viewpoint.md`** — supplementary: edge cases, known issues
26
26
 
27
27
  Requirements improve every viewpoint: exact error messages for VAL, business rules for LOGIC, role permissions for SEC.
28
28
 
@@ -47,16 +47,64 @@ When exploring live page or reading Figma designs, actively collect to hardcode
47
47
 
48
48
  ## Section Identification
49
49
 
50
- Identify sections from page patterns. Use `sungen-viewpoint` skill for the 7 pattern types (Form, Table, Search, Filter, Pagination, Modal, List/Card). Present sections and ask user which to focus on.
50
+ Identify sections from page patterns. Use `sungen-viewpoint` skill for the 10 pattern types (Form & Inputs, Data Table, Create/Add, Update/Edit, Delete, Search, Filter, Pagination, Modal/Dialog, List/Card). Present sections and ask user which to focus on.
51
51
 
52
- ## Viewpoint & Coverage
52
+ ## Test Generation Strategy
53
+
54
+ ### Step 1 — Spec-first extraction (always do this first)
55
+
56
+ Before applying any checklist, extract test conditions from `spec.md` (and `test-viewpoint.md` if present):
57
+ - **Validation rules**: field constraints, error messages, required/optional
58
+ - **Business rules**: eligibility, calculation logic, permission-based behavior
59
+ - **State lifecycle**: allowed transitions, blocked transitions
60
+ - **Edge cases**: boundary values, empty states, concurrent conditions
61
+
62
+ These spec-extracted conditions drive **which scenarios exist** — `sungen-viewpoint` only supplements with generic web UI coverage that spec doesn't explicitly state.
63
+
64
+ ### Step 2 — Apply test design techniques
65
+
66
+ Apply `sungen-test-design-techniques` to spec-extracted conditions:
67
+
68
+ | Technique | Apply when spec mentions |
69
+ |---|---|
70
+ | EP | Valid/invalid ranges, categories → **one** scenario per class, not per value |
71
+ | BVA | Numeric range, string length → `min-1`, `min`, `max`, `max+1` (compact 4-point default) |
72
+ | Decision Table | 2+ dependent conditions → one scenario per combination (cap at distinct outcomes if >3 conditions) |
73
+ | State Transition | Entity lifecycle → one scenario per valid transition + key invalid transitions |
74
+
75
+ ### Step 3 — Fill coverage gaps with viewpoint checklists
53
76
 
54
77
  Use `sungen-viewpoint` skill for per-pattern checklists across 4 viewpoints: UI/UX, Data & Validate, Logic, Security.
55
78
 
56
- Generate **20+ scenarios per applicable viewpoint**. Skip viewpoints truly N/A.
79
+ Add scenarios for generic UI coverage that spec didn't explicitly state (empty states, loading states, keyboard nav, hover effects). Skip viewpoints truly N/A.
57
80
 
58
81
  **Validation rule**: capture actual error messages from live page or spec.md. Use `User see {{error_var}}` — never assert just "is visible".
59
82
 
83
+ ## Priority Tags (auto-assign)
84
+
85
+ Every scenario **MUST** have exactly one priority tag. Add it before the scenario line (after `@extend:` if present).
86
+
87
+ | Tag | When to use |
88
+ |---|---|
89
+ | `@critical` | System unusable if fails — login/logout, authentication redirect, main create/submit/delete, permission denied |
90
+ | `@high` | Major feature broken — required field validation, core business rules, data displays correctly, key navigation |
91
+ | `@normal` | Degraded experience — UI layout/element presence, secondary flows, optional field validation, search/filter |
92
+ | `@low` | Minor/cosmetic — tooltips, hover states, empty states, default sort, placeholder text |
93
+
94
+ ### Auto-assign heuristics
95
+
96
+ | Viewpoint + Pattern | Default priority |
97
+ |---|---|
98
+ | VP-SEC-* (all security scenarios) | `@critical` |
99
+ | VP-LOGIC-* with create/submit/delete/login | `@critical` |
100
+ | VP-LOGIC-* other state changes | `@high` |
101
+ | VP-VAL-* required field / submit empty | `@high` |
102
+ | VP-VAL-* format, boundary, optional fields | `@normal` |
103
+ | VP-UI-* form fields present, table columns | `@normal` |
104
+ | VP-UI-* hover, tooltip, empty state, placeholder | `@low` |
105
+
106
+ **`@steps:` scenarios** do NOT get a priority tag (they are setup blocks, not test cases).
107
+
60
108
  ## SPA Wait-For Steps
61
109
 
62
110
  ```gherkin
@@ -74,54 +122,40 @@ And User wait for [Page Title] heading is visible
74
122
  @auth:role
75
123
  Feature: <Screen> Screen
76
124
 
77
- # Shared setup — use @steps, not Background
125
+ # Shared setup — NO priority tag on @steps
78
126
  @steps:open_form
79
127
  Scenario: Open form
80
128
  Given User is on [Screen] page
81
- And User wait for [Screen Title] heading is visible
82
129
  When User click [Create] button
83
130
  Then User see [Form] dialog
84
131
 
85
- # ============================================================
86
- # Section: Create User Form
87
- # ============================================================
88
-
89
- # --- UI/UX ---
132
+ # --- Section: Create User Form ---
90
133
 
91
- @extend:open_form
134
+ @normal @extend:open_form
92
135
  Scenario: VP-UI-001 Form displays all fields with correct defaults
93
136
  Given User is on [Form] dialog
94
137
  Then User see [Name] field
95
- And User see [Email] field
96
138
  And User see [Submit] button is disabled
97
139
 
98
- # --- Validation ---
99
-
100
- @extend:open_form
140
+ @high @extend:open_form
101
141
  Scenario: VP-VAL-001 Submit with all empty fields shows errors
102
142
  Given User is on [Form] dialog
103
143
  When User click [Submit] button
104
144
  Then User see [Name error] message with {{name_required_error}}
105
145
 
106
- # ============================================================
107
- # Section: User Table
108
- # ============================================================
109
-
110
- # --- UI/UX ---
146
+ # --- Section: User Table ---
111
147
 
148
+ @normal
112
149
  Scenario: VP-UI-010 Table displays all columns
113
150
  Then User see [Name] column in [Users] table
114
- And User see [Email] column in [Users] table
115
- And User see [Status] column in [Users] table
116
-
117
- # --- Data & Validate ---
118
151
 
152
+ @high
119
153
  Scenario: VP-VAL-010 Table displays correct data
120
154
  Then User see [Users] table match data:
121
- | Name | Email | Status |
122
- | {{name_1}} | {{email_1}} | {{status_1}} |
123
- | {{name_2}} | {{email_2}} | {{status_2}} |
155
+ | Name | Email |
156
+ | {{name_1}} | {{email_1}} |
124
157
 
158
+ @high
125
159
  Scenario: VP-VAL-011 Edit button targets correct row
126
160
  Given User see [Target] row in [Users] table with {{name_1}}
127
161
  When User click [Edit] button in [Users] table with {{name_1}}
@@ -135,7 +169,7 @@ Feature: <Screen> Screen
135
169
  | `table match data:` + DataTable | Verifying **multiple rows** exist with expected values |
136
170
  | `row in [Table] table with {{v}}` + `column with {{v}}` | Checking **single row** details or **acting** on a row (click, edit) |
137
171
 
138
- **Naming**: `VP-<CATEGORY>-<NNN>` prefix.
172
+ **Naming**: `VP-<CATEGORY>-<NNN>` prefix. Scenario name must use the **same element type** as the steps — e.g., if the step uses `dialog`, write "dialog opens" not "modal opens".
139
173
 
140
174
  **Test data** — `qa/screens/<screen>/test-data/<screen>.yaml`, grouped by section.
141
175
 
@@ -20,16 +20,16 @@ user-invocable: false
20
20
 
21
21
  ### Coverage (40 pts)
22
22
 
23
- | Dimension | Pts | Min scenarios |
24
- |---|---|---|
25
- | Happy paths | 8 | 3-5 |
26
- | Negative cases | 8 | 3-5 |
27
- | Edge cases | 8 | 5-8 |
28
- | Boundary values | 6 | 3-5 |
29
- | State transitions | 5 | 2-4 |
30
- | Combinatorial | 5 | 2-4 |
23
+ | Dimension | Technique | Pts | What to check |
24
+ |---|---|---|---|
25
+ | Happy paths | — | 8 | Core success flows exist |
26
+ | Negative cases | EP | 8 | One scenario per invalid class, no redundant same-class scenarios |
27
+ | Edge cases | EP | 6 | Empty, null, whitespace, special chars covered |
28
+ | Boundary values | BVA | 8 | `min-1`, `min`, `max`, `max+1` for each spec range |
29
+ | State transitions | ST | 5 | Valid transitions + key blocked paths from spec |
30
+ | Condition combos | DT | 5 | Dependent conditions covered, distinct outcomes tested |
31
31
 
32
- Score: `(dimensions_covered / 6) * 40`. Per-pattern checklists → `sungen-viewpoint` skill.
32
+ Score: `(dimensions_covered / 6) * 40`. Validate technique application with `sungen-test-design-techniques`. Per-pattern checklists → `sungen-viewpoint` skill.
33
33
 
34
34
  ### Viewpoint (30 pts)
35
35
 
@@ -37,7 +37,8 @@ Score: `(dimensions_covered / 6) * 40`. Per-pattern checklists → `sungen-viewp
37
37
  |---|---|
38
38
  | All applicable VP present (UI/VAL/LOGIC/SEC) | 10 |
39
39
  | Correct classification | 8 |
40
- | `VP-<CAT>-<NNN>` naming + section grouping | 8 |
40
+ | `VP-<CAT>-<NNN>` naming + section grouping | 4 |
41
+ | Priority tag present and correct (`@critical`/`@high`/`@normal`/`@low`) | 4 |
41
42
  | Assertion quality (see rules below) | 4 |
42
43
 
43
44
  **Classification**: UI = static/always-same appearance. VAL = input validation/errors. LOGIC = behavior/state changes (includes persisted state without When). SEC = auth/permissions.
@@ -58,6 +59,7 @@ Score: `(dimensions_covered / 6) * 40`. Per-pattern checklists → `sungen-viewp
58
59
  2. **`When fill [X]`** → Then must assert the **visible result** (search results, validation error). Don't re-assert the field value.
59
60
  3. **UI-only scenarios** (no action needed) → use Given + Then without When.
60
61
  4. **Scenario name must match the assertion**, not the action.
62
+ 5. **Scenario name must use the same element type as the steps** — e.g., "dialog opens" + `[X] dialog`, never "modal opens" + `[X] dialog`.
61
63
 
62
64
  ### @manual Rules
63
65
 
@@ -72,13 +74,16 @@ Do NOT mark `@manual` when data is visible in snapshot or documented in spec —
72
74
 
73
75
  ## Checklist (auto-fix on detection)
74
76
 
75
- 1. **Redundant scenarios** — keep stronger assertion, remove weaker duplicate
77
+ 1. **Redundant scenarios (EP violation)** — multiple scenarios testing same equivalence class? Keep one representative, remove rest
76
78
  2. **Misclassified VP** — UI tests behavior? Move to LOGIC. Logic tests appearance? Move to UI
77
79
  3. **Dynamic content** — exact match on counters/timestamps? Use `contains` instead
78
80
  4. **Duplicate across sections** — SEC scenario identical to UI? Remove duplicate
79
- 5. **Always-enabled elements** — `is enabled` on never-disabled element? Remove
80
- 6. **Test-data completeness** — every `{{var}}` must exist in test-data.yaml
81
- 7. **Missing negative/boundary** — every form section needs at least: empty field, invalid format, boundary value
81
+ 5. **Missing/wrong priority tag** — every non-`@steps` scenario needs exactly one of `@critical`/`@high`/`@normal`/`@low`. SEC→`@critical`, VAL required→`@high`, UI layout→`@normal`, hover/tooltip→`@low`
82
+ 6. **Always-enabled elements** — `is enabled` on never-disabled element? Remove
83
+ 7. **Test-data completeness** — every `{{var}}` must exist in test-data.yaml
84
+ 8. **Missing BVA boundaries** — spec defines min/max range but scenarios only test midpoint? Add `min-1`, `min`, `max`, `max+1`
85
+ 9. **Missing state transitions** — spec defines lifecycle states but only happy path tested? Add blocked transitions
86
+ 10. **Uncovered condition combos** — spec has 2+ dependent conditions but only partial combinations tested? Build decision table
82
87
 
83
88
  ---
84
89
 
@@ -0,0 +1,99 @@
1
+ ---
2
+ name: sungen-test-design-techniques
3
+ description: 'Test design techniques (EP, BVA, Decision Table, State Transition) for systematic scenario generation from spec constraints. Auto-loaded by create-test command.'
4
+ user-invocable: false
5
+ ---
6
+
7
+ ## When to Apply
8
+
9
+ | Technique | Apply when spec mentions |
10
+ |---|---|
11
+ | EP (Equivalence Partitioning) | Input types, categories, roles, valid/invalid ranges |
12
+ | BVA (Boundary Value Analysis) | Numeric range, string length, date range, count limit |
13
+ | Decision Table | 2+ mutually dependent conditions with different outcomes |
14
+ | State Transition | Entity lifecycle, workflow states, status changes |
15
+
16
+ **Rule:** These techniques determine **how many** and **which** scenarios to generate. `sungen-viewpoint` determines **which viewpoints** to cover.
17
+
18
+ ---
19
+
20
+ ## 1. Equivalence Partitioning (EP)
21
+
22
+ **Goal:** One representative per input class. If one value in a partition passes, all values in that partition pass.
23
+
24
+ **How to apply:**
25
+ 1. Extract partitions from `spec.md` constraints (e.g., field accepts 1-100)
26
+ 2. Valid class: 1 <= value <= 100
27
+ 3. Invalid class (below): value < 1
28
+ 4. Invalid class (above): value > 100
29
+ 5. Write **one** scenario per class
30
+
31
+ **Anti-pattern:**
32
+ ```gherkin
33
+ # BAD — 3 scenarios, same class, same result:
34
+ Scenario: VP-VAL-001 Enter value 10
35
+ Scenario: VP-VAL-002 Enter value 50
36
+ Scenario: VP-VAL-003 Enter value 80
37
+ ```
38
+ ```gherkin
39
+ # GOOD — one representative per class:
40
+ Scenario: VP-VAL-001 Valid range value is accepted # value = 50
41
+ Scenario: VP-VAL-002 Below minimum is rejected # value = 0
42
+ Scenario: VP-VAL-003 Above maximum is rejected # value = 101
43
+ ```
44
+
45
+ ---
46
+
47
+ ## 2. Boundary Value Analysis (BVA)
48
+
49
+ **Goal:** Test exact edges where off-by-one errors occur (`>` vs `>=`, `<` vs `<=`).
50
+
51
+ ### Two modes
52
+
53
+ | Mode | Values | Use when |
54
+ |---|---|---|
55
+ | **Compact (default)** | `min-1`, `min`, `max`, `max+1` | Most fields |
56
+ | **Full 6-point** | `min-1`, `min`, `min+1`, `max-1`, `max`, `max+1` | Critical fields with `@critical`/`@high` priority |
57
+
58
+ **How to apply** (example: "quantity must be 1-10"):
59
+ - `min-1` = 0 -> invalid
60
+ - `min` = 1 -> valid (lower boundary)
61
+ - `max` = 10 -> valid (upper boundary)
62
+ - `max+1` = 11 -> invalid
63
+ - Midpoint (e.g., 5) already covered by EP valid class
64
+
65
+ **BVA scenarios** (example: quantity 1-10):
66
+ - `@high VP-VAL-010 Below minimum (0) is rejected`
67
+ - `@high VP-VAL-011 Minimum boundary (1) is accepted`
68
+ - `@high VP-VAL-012 Maximum boundary (10) is accepted`
69
+ - `@high VP-VAL-013 Above maximum (11) is rejected`
70
+
71
+ ---
72
+
73
+ ## 3. Decision Table
74
+
75
+ **Goal:** Cover all condition combinations when 2+ conditions constrain each other.
76
+
77
+ **How to apply:** List conditions from `spec.md` → build combination→outcome table → one scenario per row.
78
+
79
+ **Cap:** When >3 boolean conditions (>8 rows), prioritize rows with **distinct outcomes** and add `@manual` for exhaustive combos.
80
+
81
+ **Example** — Submit requires valid form AND permission → 4 combos, 2 distinct outcomes:
82
+ - `@normal` Form invalid + no permission → disabled
83
+ - `@normal` Form valid + no permission → disabled
84
+ - `@normal` Has permission + form invalid → disabled
85
+ - `@critical` Form valid + has permission → succeeds
86
+
87
+ ---
88
+
89
+ ## 4. State Transition
90
+
91
+ **Goal:** Verify every valid transition AND block invalid ones.
92
+
93
+ **How to apply:** Extract state diagram from `spec.md` → one scenario per valid transition + key invalid transitions.
94
+
95
+ **Example** — Order lifecycle (Draft→Pending→Approved→Completed):
96
+ - `@high` Valid: Draft → Pending, Pending → Approved, Approved → Completed
97
+ - `@normal` Invalid: Completed → Draft (blocked), Pending → Completed (skip approval)
98
+
99
+ **test-data:** Use named state keys (`order_in_draft`, `order_in_pending`).
@@ -1,6 +1,6 @@
1
1
  ---
2
2
  name: sungen-viewpoint
3
- description: '7 UI patterns x 4 viewpoints — structured checklist for test case generation and review. Auto-loaded by make-tc and review commands.'
3
+ description: '10 UI patterns x 4 viewpoints — structured checklist for test case generation and review. Auto-loaded by create-test and review commands.'
4
4
  user-invocable: false
5
5
  ---
6
6
 
@@ -13,148 +13,234 @@ user-invocable: false
13
13
  | **Logic** | Business rules, interactions, state changes | VP-LOGIC |
14
14
  | **Security** | Auth, injection, permissions | VP-SEC |
15
15
 
16
+ ## Shared Checks (apply across all patterns)
17
+
18
+ These appear in multiple patterns — test once per screen, not per pattern:
19
+
20
+ | Check | ER |
21
+ |---|---|
22
+ | **Loading State** | Spinner/skeleton shown, UI interaction locked during fetch |
23
+ | **Empty State** | Clear message when no data, layout intact |
24
+ | **XSS/Injection** | Malicious input sanitized to plain text, never executed |
25
+ | **URL Manipulation** | Invalid URL params fallback to defaults, no server crash |
26
+
16
27
  ---
17
28
 
18
- ## 1. Form & Inputs
29
+ ## GROUP 1: DATA ENTRY
30
+
31
+ ### 1. Form & Inputs
19
32
 
20
33
  **UI/UX**
21
- - Field States: disabled/readonly fields are dimmed and locked
22
- - Button States: Submit disabled when invalid, enabled when valid
23
- - Loading States: Spinner + block UI while waiting for server
24
- - Keyboard Navigation: Tab order correct, Enter submits form
34
+ - Field States: disabled/readonly fields dimmed and locked, no interaction allowed
35
+ - Button States: Submit disabled when form invalid, auto-enabled when valid
36
+ - Keyboard Nav: Tab order correct, Enter submits form
25
37
 
26
38
  **Data & Validate**
27
- - Requirements: required field blank shows error, optional allowed blank
28
- - Boundaries & Types: min/max length, format (email, number) with error messages
29
- - Whitespace: trims excess whitespace or errors on spaces-only
30
- - Error Messaging: error at correct location, disappears on correction (Error Recovery)
39
+ - Required/Optional: blank required field shows error; optional allows blank
40
+ - Boundaries & Format: min/max length, format (email, number) with error messages
41
+ - Whitespace: auto-trim or reject spaces-only input
42
+ - Error Recovery: error at correct field, disappears immediately when user corrects data
31
43
 
32
44
  **Logic**
33
- - Dependencies: Field A value determines Field B status/data
34
- - Submission Control: prevent double submit (disable button after first click)
35
- - Success Flow: redirect / success toast / reset form
45
+ - Field Dependencies: Field A value determines Field B status/options
46
+ - Double Submit Prevention: button disabled after first click, only 1 request sent
47
+ - Success Flow: redirect / success toast / form reset
36
48
  - Failure Flow: server error retains form data + shows system error
37
49
 
38
50
  **Security**
39
- - Injection Protection: XSS/SQL injection sanitized to plain text, never executed
51
+ - Shared: XSS/Injection
40
52
 
41
53
  ---
42
54
 
43
- ## 2. Data Table
55
+ ## GROUP 2: DATA MANAGEMENT
56
+
57
+ ### 2. Data Table
44
58
 
45
59
  **UI/UX**
46
- - Empty State: clear message when no data, layout intact
47
- - Loading State: skeleton/spinner, table interaction locked during fetch
48
- - Layout & Truncation: long content truncated with tooltip, column width stable
60
+ - Shared: Empty State, Loading State
61
+ - Truncation: long content shows `...` with tooltip on hover, column width stable
49
62
  - Sticky Elements: fixed header on vertical scroll, fixed action column on horizontal scroll
50
63
 
51
64
  **Data & Validate**
52
- - Consistency: total record count on UI matches server data
53
- - Row Limit: displayed rows never exceed page size/limit
54
- - Cell Integrity: cell data matches database, correct format (date, currency, status)
55
- - **Use `table match data:` with inline DataTable** for multi-row content verification (filter-based, resilient to data changes)
56
- - Use row scope (`row in [Table] table with {{v}}` + `column with {{v}}`) for single-row detail checks or when you need actions on a row
65
+ - Record Count: "Total records" on UI matches server data exactly
66
+ - Row Limit: displayed rows never exceed configured page size
67
+ - Cell Integrity: cell data matches database, correct format (date, currency, status label)
57
68
 
58
69
  **Logic**
59
- - Sorting: column sort refreshes data with correct order, updates header icon
70
+ - Sorting: column sort refreshes table with correct order, updates header icon
60
71
  - Row Actions: Edit/Delete/View buttons act on correct row ID
61
72
 
62
73
  **Security**
63
- - UI-level RBAC: hide sensitive columns or privileged buttons without authority
64
- - XSS Rendering: malicious code in database displayed as plain text
74
+ - RBAC: hide sensitive columns or privileged action buttons without authority
75
+ - Shared: XSS/Injection (data from DB displayed safely)
76
+
77
+ ---
78
+
79
+ ### 3. Create / Add
80
+
81
+ **UI/UX**
82
+ - Blank Slate: all fields empty or BA-specified defaults, NO cache from previous operation
83
+ - Required Indicator: required fields marked with visual cue (e.g., red *)
84
+ - Unsaved Changes: navigate away with dirty form → browser/system warning popup
85
+
86
+ **Data & Validate**
87
+ - → Inherited: all Form & Inputs validation rules apply
88
+ - Unique Constraint: duplicate unique field (e.g., Employee ID) → reject save, inline error
89
+ - Data Dependency: selecting parent field loads correct child options
90
+
91
+ **Logic**
92
+ - Save & Close: toast notification, redirect to list, new record visible per sort rule
93
+ - Save & Add Another: save to DB, form resets to blank for next entry
94
+ - Double Submit Prevention: → same as Form & Inputs
95
+ - Cancel: form closes, NO garbage record in DB, next open shows blank form
96
+
97
+ **Security**
98
+ - API Bypass / 403: unauthorized POST → system blocks (403 Forbidden), no record created
99
+ - → Shared: XSS/Injection (persisted safely, not executed on display)
100
+
101
+ ---
102
+
103
+ ### 4. Update / Edit
104
+
105
+ **UI/UX**
106
+ - Pre-fill / Data Binding: all fields display exact current DB data (text, dropdown, radio, date...)
107
+ - Readonly Fields: identity fields (ID, username, employee code) disabled, no interaction
108
+ - Cancel: no data changed in DB; if dirty → unsaved changes warning
109
+
110
+ **Data & Validate**
111
+ - → Inherited: all Form & Inputs validation rules apply
112
+ - Unique Self: saving without changing unique field → success, no self-duplicate error
113
+ - Unique Conflict: changing unique field to existing value → duplicate error, block save
114
+ - Unchanged Submit: Save disabled until dirty, or success without DB UPDATE
115
+
116
+ **Logic**
117
+ - Update Success: toast "Updated successfully", new data reflects on UI immediately without reload
118
+ - Concurrent Edit: another user already edited → conflict warning, require reload
119
+
120
+ **Security**
121
+ - Authorization / 403: access edit without permission → 403 page
122
+ - Not Found / 404: edit deleted object → 404
65
123
 
66
124
  ---
67
125
 
68
- ## 3. Search
126
+ ### 5. Delete
69
127
 
70
128
  **UI/UX**
71
- - No Results: "No results found" message, list empty, Clear button visible
72
- - Loading State: spinner/skeleton, list dimmed, interaction locked
129
+ - Confirmation: click Delete MUST show confirmation dialog, delete button in warning color
130
+ - Cancel: popup closes, record intact on UI and DB, no API called
131
+ - Success Update: toast "Deleted successfully", record disappears immediately without reload
132
+ - Pagination Fallback: delete only record on current page → auto-navigate to previous page
133
+
134
+ **Data & Validate — Dependencies**
135
+ - Independent: delete succeeds normally
136
+ - Referenced (Restrict): delete parent with children → blocked, clear error "in use at [Module]"
137
+ - Referenced (Cascade): warning first, then deletes parent AND all related children
138
+ - Referenced (Set Null): parent deleted, child reference set to Unassigned/Empty
139
+
140
+ **Logic — Storage**
141
+ - Soft Delete: record hidden from UI, DB retains with status flag (is_deleted, deleted_at)
142
+ - Hard Delete: record removed from UI AND permanently deleted from DB
143
+
144
+ **Security**
145
+ - Deleted Access / 404: soft or hard delete → direct URL/API returns 404
146
+ - API Bypass: API delete on restricted object → backend rejects with business error, no 500
147
+
148
+ ---
149
+
150
+ ### 6. Search
151
+
152
+ **UI/UX**
153
+ - → Shared: Empty State ("No results found"), Loading State
73
154
  - Clear Action: search box empties, list reloads default data
74
155
 
75
156
  **Data & Validate**
76
- - Cleanup: auto-trim whitespace, results match cleaned keyword
77
- - Input Limits: prevent input beyond max length or show error
78
- - Normalization: case-insensitive matching, handles Vietnamese accents
157
+ - Whitespace: auto-trim, results match cleaned keyword
158
+ - Input Limits: prevent beyond max length or show error
159
+ - Normalization: case-insensitive, handles accented characters correctly
79
160
 
80
161
  **Logic**
81
- - Matching: partial/exact match returns correct results, no 500 errors
82
- - Multi-keyword: results based on AND/OR logic
83
- - Performance: debounce ~300ms before API call
162
+ - Matching: partial/exact match returns correct results, no 500
163
+ - Multi-keyword: results based on AND/OR logic per spec
164
+ - Debounce: ~300ms delay before API call
84
165
 
85
166
  **Security**
86
- - Injection: XSS/SQL encoded as plain text, never executed
87
- - Wildcards: `%, _, *` treated as normal text (escaped)
167
+ - → Shared: XSS/Injection
168
+ - Wildcards: `%`, `_`, `*` treated as literal text (escaped), not DB commands
88
169
 
89
170
  ---
90
171
 
91
- ## 4. Filter
172
+ ### 7. Filter
92
173
 
93
174
  **UI/UX**
94
175
  - Feedback: selected filters displayed as tags/badges
95
176
  - Persistence: collapse/expand retains selected values
96
- - Conflicts: conflicting conditions show "No data" message, header layout intact
177
+ - Conflicts: conflicting conditions show "No data" message, layout intact
97
178
 
98
179
  **Data & Validate**
99
- - Range Validation: start > end or min > max shows field error, Apply button disabled
180
+ - Range Validation: start > end or min > max field error, Apply disabled
100
181
  - Dropdown Integrity: options match 100% of actual data, hide unauthorized values
101
182
 
102
183
  **Logic**
103
- - Logic AND/OR: results satisfy correct filter logic, Total Count updated
184
+ - AND/OR Logic: results satisfy correct filter logic, total count updated
104
185
  - Dependent Filters: selecting Filter A updates Filter B options
105
- - Reset & Navigation: reset returns original data or preserves state depending on action
186
+ - Reset & Navigation: reset returns original data or preserves state per spec
106
187
 
107
188
  **Security**
108
- - URL Manipulation: erroneous URL params ignored, defaults assigned, no 500 error
189
+ - Shared: URL Manipulation
109
190
 
110
191
  ---
111
192
 
112
- ## 5. Pagination
193
+ ### 8. Pagination
113
194
 
114
195
  **UI/UX**
115
196
  - Boundary States: Previous/First disabled on page 1, Next/Last disabled on last page
116
- - Active & Loading: active page highlighted, loading effect during page transition
117
- - Hidden State: pagination bar hidden when data fits one page
197
+ - Active Page: highlighted, loading effect during page transition
198
+ - Hidden: pagination bar hidden when data fits one page
118
199
 
119
200
  **Data & Validate**
120
- - Label Consistency: "Viewing X of Y" matches actual data
201
+ - Label Consistency: "Viewing X of Y" matches actual data exactly
121
202
  - Zero Records: pagination hidden, empty state displayed
122
203
 
123
204
  **Logic**
124
205
  - Navigation: loads correct dataset for page (page 2, limit 10 = records 11-20)
125
206
  - Change Page Size: shows correct quantity, resets to page 1
126
207
  - Interaction Resets: new search/filter resets to page 1
127
- - Delete Fallback: deleting all records on last page pushes to previous page
128
208
 
129
209
  **Security**
130
- - URL Manipulation: invalid page/size in URL fallbacks to defaults, no server crash
210
+ - Shared: URL Manipulation
131
211
 
132
212
  ---
133
213
 
134
- ## 6. Modal / Dialog
214
+ ## GROUP 3: NAVIGATION & CONTAINERS
215
+
216
+ ### 9. Modal / Dialog
135
217
 
136
218
  **UI/UX**
137
- - Overlay & Backdrop: centered modal, backdrop blur, background scroll locked
219
+ - Overlay: centered modal, backdrop blur, background scroll locked
138
220
  - Focus Trapping: Tab key cycles only within modal elements
139
221
  - Responsive: modal resizes, action buttons always visible or scrollable
140
222
 
141
223
  **Data & Validate**
142
- - Dismiss Actions: close via X, Cancel, Escape, backdrop click. Resets data on reopen
224
+ - Dismiss Actions: close via X, Cancel, Escape, backdrop click resets data to default on reopen
143
225
 
144
226
  **Logic**
145
- - Submissions: action button shows loading, modal closes on success, background data updated
146
- - Failure: modal stays open on API error, shows error message, retains entered data
227
+ - Submit Success: action button shows loading, modal closes, background data updated
228
+ - Submit Failure: modal stays open, shows error message, retains entered data
147
229
  - Stacked Modals: Modal B over A has higher z-index, closing B keeps A intact
148
230
 
149
231
  **Security**
150
- - Reload & Security: handles deep linking if present, removes HTML from DOM on close (protect sensitive data)
232
+ - DOM Cleanup: remove HTML from DOM on close to protect sensitive data
233
+ - Reload: handles deep linking if present
151
234
 
152
235
  ---
153
236
 
154
- ## 7. List / Card
237
+ ## GROUP 4: DISPLAY PATTERNS
238
+
239
+ ### 10. List / Card
155
240
 
156
241
  **UI/UX**
157
- - Visual States: empty state when empty, skeleton when loading, hover effect (shadow/scale) on card
242
+ - Shared: Empty State, Loading State
243
+ - Hover Effect: shadow/scale on card hover
158
244
  - Content: text truncation without breaking card height, placeholder image on broken image
159
245
 
160
246
  **Data & Validate**
@@ -164,25 +250,26 @@ user-invocable: false
164
250
  **Logic**
165
251
  - Navigation: clicking card navigates to correct detail page
166
252
  - Direct Actions: Like/Add to Cart updates immediately without reloading list
167
- - Loading Flows: Load More / Infinite Scroll appends records, maintains scroll position
253
+ - Infinite Scroll / Load More: appends records, maintains scroll position
168
254
  - Layout Toggle: Grid/List view switch changes UI but preserves data
169
255
 
170
256
  **Security**
171
- - RBAC & Resilience: hide sensitive data/privileged buttons from DOM. Network loss shows error + "Try again" button
257
+ - RBAC: hide sensitive data or privileged buttons from DOM
258
+ - Network Resilience: error message + "Retry" button on connection loss
172
259
 
173
260
  ---
174
261
 
175
262
  ## Security Tag Rules
176
263
 
177
- For VP-SEC scenarios testing **unauthorized access** (no login, wrong role, direct URL access):
178
- - Use **`@no-auth`** tag — this runs the test without authentication, which is exactly what you want to verify.
179
- - Do NOT use `@manual` for these — they are automatable with `@no-auth`.
264
+ For VP-SEC scenarios testing **unauthorized access** (no login, wrong role, direct URL):
265
+ - Use **`@no-auth`** tag — runs without authentication to verify redirect/block.
266
+ - Do NOT use `@manual` for these — they are automatable.
180
267
 
181
268
  ```gherkin
182
- @no-auth
269
+ @critical @no-auth
183
270
  Scenario: VP-SEC-001 Unauthenticated user cannot access admin page
184
271
  Given User is on [Admin] page
185
272
  Then User see [Login] page
186
273
  ```
187
274
 
188
- Use `@manual` only when the environment truly cannot be set up automatically (e.g., third-party OAuth, physical device).
275
+ Use `@manual` only when the environment truly cannot be set up automatically.
@@ -19,7 +19,7 @@ sungen generate → compiles Gherkin + selectors + data → Playwright .spec.ts
19
19
  │ └── requirements/ # Screen specs, UI designs, notes
20
20
  │ ├── spec.md # Structured screen specification
21
21
  │ ├── ui/ # Screenshots, mockups, design images
22
- │ └── notes.md # Edge cases, decisions (optional)
22
+ │ └── test-viewpoint.md # Edge cases, decisions (optional)
23
23
  ├── specs/
24
24
  │ └── generated/ # Auto-generated Playwright tests
25
25
  ├── .claude/