@sun-asterisk/sungen 2.4.1 → 2.4.3

package/dist/orchestrator/templates/ai-instructions/claude-skill-tc-generation.md

@@ -22,7 +22,7 @@ For append: read highest `VP-<CAT>-<NNN>`, continue from next number. Never modi
 When `qa/screens/<screen>/requirements/` exists:
 - **`spec.md`** — primary: sections, field constraints, validation messages, business rules, states
 - **`ui/`** — supplementary: screenshots for layout/visual context
-- **`notes.md`** — supplementary: edge cases, known issues
+- **`test-viewpoint.md`** — supplementary: edge cases, known issues
 
 Requirements improve every viewpoint: exact error messages for VAL, business rules for LOGIC, role permissions for SEC.
 
@@ -47,16 +47,64 @@ When exploring live page or reading Figma designs, actively collect to hardcode
 
 ## Section Identification
 
-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.
+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.
 
-## Viewpoint & Coverage
+## Test Generation Strategy
+
+### Step 1 — Spec-first extraction (always do this first)
+
+Before applying any checklist, extract test conditions from `spec.md` (and `test-viewpoint.md` if present):
+- **Validation rules**: field constraints, error messages, required/optional
+- **Business rules**: eligibility, calculation logic, permission-based behavior
+- **State lifecycle**: allowed transitions, blocked transitions
+- **Edge cases**: boundary values, empty states, concurrent conditions
+
+These spec-extracted conditions drive **which scenarios exist** — `sungen-viewpoint` only supplements with generic web UI coverage that spec doesn't explicitly state.
+
+### Step 2 — Apply test design techniques
+
+Apply `sungen-test-design-techniques` to spec-extracted conditions:
+
+| Technique | Apply when spec mentions |
+|---|---|
+| EP | Valid/invalid ranges, categories → **one** scenario per class, not per value |
+| BVA | Numeric range, string length → `min-1`, `min`, `max`, `max+1` (compact 4-point default) |
+| Decision Table | 2+ dependent conditions → one scenario per combination (cap at distinct outcomes if >3 conditions) |
+| State Transition | Entity lifecycle → one scenario per valid transition + key invalid transitions |
+
+### Step 3 — Fill coverage gaps with viewpoint checklists
 
 Use `sungen-viewpoint` skill for per-pattern checklists across 4 viewpoints: UI/UX, Data & Validate, Logic, Security.
 
-Generate **20+ scenarios per applicable viewpoint**. Skip viewpoints truly N/A.
+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.
 
 **Validation rule**: capture actual error messages from live page or spec.md. Use `User see {{error_var}}` — never assert just "is visible".
 
+## Priority Tags (auto-assign)
+
+Every scenario **MUST** have exactly one priority tag. Add it before the scenario line (after `@extend:` if present).
+
+| Tag | When to use |
+|---|---|
+| `@critical` | System unusable if fails — login/logout, authentication redirect, main create/submit/delete, permission denied |
+| `@high` | Major feature broken — required field validation, core business rules, data displays correctly, key navigation |
+| `@normal` | Degraded experience — UI layout/element presence, secondary flows, optional field validation, search/filter |
+| `@low` | Minor/cosmetic — tooltips, hover states, empty states, default sort, placeholder text |
+
+### Auto-assign heuristics
+
+| Viewpoint + Pattern | Default priority |
+|---|---|
+| VP-SEC-* (all security scenarios) | `@critical` |
+| VP-LOGIC-* with create/submit/delete/login | `@critical` |
+| VP-LOGIC-* other state changes | `@high` |
+| VP-VAL-* required field / submit empty | `@high` |
+| VP-VAL-* format, boundary, optional fields | `@normal` |
+| VP-UI-* form fields present, table columns | `@normal` |
+| VP-UI-* hover, tooltip, empty state, placeholder | `@low` |
+
+**`@steps:` scenarios** do NOT get a priority tag (they are setup blocks, not test cases).
+
 ## SPA Wait-For Steps
 
 ```gherkin
@@ -68,51 +116,44 @@ And User wait for [Page Title] heading is visible
 
 **Feature file** — `qa/screens/<screen>/features/<screen>.feature`
 
+**Never use `Background:`.** Use `@steps` + `@extend` for shared setup (see `sungen-gherkin-syntax` skill).
+
 ```gherkin
 @auth:role
 Feature: <Screen> Screen
 
-  # ============================================================
-  # Section: Create User Form
-  # ============================================================
+  # Shared setup — NO priority tag on @steps
+  @steps:open_form
+  Scenario: Open form
+    Given User is on [Screen] page
+    When User click [Create] button
+    Then User see [Form] dialog
 
-  # --- UI/UX ---
+  # --- Section: Create User Form ---
 
+  @normal @extend:open_form
   Scenario: VP-UI-001 Form displays all fields with correct defaults
-    Given User is on [Create User] page
+    Given User is on [Form] dialog
     Then User see [Name] field
-    And User see [Email] field
     And User see [Submit] button is disabled
 
-  # --- Validation ---
-
+  @high @extend:open_form
   Scenario: VP-VAL-001 Submit with all empty fields shows errors
+    Given User is on [Form] dialog
     When User click [Submit] button
     Then User see [Name error] message with {{name_required_error}}
 
-  # ============================================================
-  # Section: User Table
-  # ============================================================
-
-  # --- UI/UX ---
+  # --- Section: User Table ---
 
+  @normal
   Scenario: VP-UI-010 Table displays all columns
     Then User see [Name] column in [Users] table
-    And User see [Email] column in [Users] table
-    And User see [Status] column in [Users] table
-
-  # --- Data & Validate ---
 
+  @high
   Scenario: VP-VAL-010 Table displays correct data
     Then User see [Users] table match data:
-      | Name         | Email          | Status       |
-      | {{name_1}}   | {{email_1}}    | {{status_1}} |
-      | {{name_2}}   | {{email_2}}    | {{status_2}} |
-
-  Scenario: VP-VAL-011 Edit button targets correct row
-    Given User see [Target] row in [Users] table with {{name_1}}
-    When User click [Edit] button in [Users] table with {{name_1}}
-    Then User see [Name] field with {{name_1}}
+      | Name       | Email        |
+      | {{name_1}} | {{email_1}}  |
 ```
 
 ### When to use DataTable vs Row Scope
@@ -122,7 +163,7 @@ Feature: <Screen> Screen
 | `table match data:` + DataTable | Verifying **multiple rows** exist with expected values |
 | `row in [Table] table with {{v}}` + `column with {{v}}` | Checking **single row** details or **acting** on a row (click, edit) |
 
-**Naming**: `VP-<CATEGORY>-<NNN>` prefix.
+**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".
 
 **Test data** — `qa/screens/<screen>/test-data/<screen>.yaml`, grouped by section.
 

package/dist/orchestrator/templates/ai-instructions/claude-skill-tc-review.md

@@ -20,16 +20,16 @@ user-invocable: false
 
 ### Coverage (40 pts)
 
-| Dimension | Pts | Min scenarios |
-|---|---|---|
-| Happy paths | 8 | 3-5 |
-| Negative cases | 8 | 3-5 |
-| Edge cases | 8 | 5-8 |
-| Boundary values | 6 | 3-5 |
-| State transitions | 5 | 2-4 |
-| Combinatorial | 5 | 2-4 |
+| Dimension | Technique | Pts | What to check |
+|---|---|---|---|
+| Happy paths | — | 8 | Core success flows exist |
+| Negative cases | EP | 8 | One scenario per invalid class, no redundant same-class scenarios |
+| Edge cases | EP | 6 | Empty, null, whitespace, special chars covered |
+| Boundary values | BVA | 8 | `min-1`, `min`, `max`, `max+1` for each spec range |
+| State transitions | ST | 5 | Valid transitions + key blocked paths from spec |
+| Condition combos | DT | 5 | Dependent conditions covered, distinct outcomes tested |
 
-Score: `(dimensions_covered / 6) * 40`. Per-pattern checklists → `sungen-viewpoint` skill.
+Score: `(dimensions_covered / 6) * 40`. Validate technique application with `sungen-test-design-techniques`. Per-pattern checklists → `sungen-viewpoint` skill.
 
 ### Viewpoint (30 pts)
 
@@ -37,7 +37,8 @@ Score: `(dimensions_covered / 6) * 40`. Per-pattern checklists → `sungen-viewp
 |---|---|
 | All applicable VP present (UI/VAL/LOGIC/SEC) | 10 |
 | Correct classification | 8 |
-| `VP-<CAT>-<NNN>` naming + section grouping | 8 |
+| `VP-<CAT>-<NNN>` naming + section grouping | 4 |
+| Priority tag present and correct (`@critical`/`@high`/`@normal`/`@low`) | 4 |
 | Assertion quality (see rules below) | 4 |
 
 **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
 2. **`When fill [X]`** → Then must assert the **visible result** (search results, validation error). Don't re-assert the field value.
 3. **UI-only scenarios** (no action needed) → use Given + Then without When.
 4. **Scenario name must match the assertion**, not the action.
+5. **Scenario name must use the same element type as the steps** — e.g., "dialog opens" + `[X] dialog`, never "modal opens" + `[X] dialog`.
 
 ### @manual Rules
 
@@ -72,13 +74,16 @@ Do NOT mark `@manual` when data is visible in snapshot or documented in spec —
 
 ## Checklist (auto-fix on detection)
 
-1. **Redundant scenarios** — keep stronger assertion, remove weaker duplicate
+1. **Redundant scenarios (EP violation)** — multiple scenarios testing same equivalence class? Keep one representative, remove rest
 2. **Misclassified VP** — UI tests behavior? Move to LOGIC. Logic tests appearance? Move to UI
 3. **Dynamic content** — exact match on counters/timestamps? Use `contains` instead
 4. **Duplicate across sections** — SEC scenario identical to UI? Remove duplicate
-5. **Always-enabled elements** — `is enabled` on never-disabled element? Remove
-6. **Test-data completeness** — every `{{var}}` must exist in test-data.yaml
-7. **Missing negative/boundary** — every form section needs at least: empty field, invalid format, boundary value
+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`
+6. **Always-enabled elements** — `is enabled` on never-disabled element? Remove
+7. **Test-data completeness** — every `{{var}}` must exist in test-data.yaml
+8. **Missing BVA boundaries** — spec defines min/max range but scenarios only test midpoint? Add `min-1`, `min`, `max`, `max+1`
+9. **Missing state transitions** — spec defines lifecycle states but only happy path tested? Add blocked transitions
+10. **Uncovered condition combos** — spec has 2+ dependent conditions but only partial combinations tested? Build decision table
 
 ---
 

package/dist/orchestrator/templates/ai-instructions/claude-skill-test-design-techniques.md

@@ -0,0 +1,99 @@
+---
+name: sungen-test-design-techniques
+description: 'Test design techniques (EP, BVA, Decision Table, State Transition) for systematic scenario generation from spec constraints. Auto-loaded by create-test command.'
+user-invocable: false
+---
+
+## When to Apply
+
+| Technique | Apply when spec mentions |
+|---|---|
+| EP (Equivalence Partitioning) | Input types, categories, roles, valid/invalid ranges |
+| BVA (Boundary Value Analysis) | Numeric range, string length, date range, count limit |
+| Decision Table | 2+ mutually dependent conditions with different outcomes |
+| State Transition | Entity lifecycle, workflow states, status changes |
+
+**Rule:** These techniques determine **how many** and **which** scenarios to generate. `sungen-viewpoint` determines **which viewpoints** to cover.
+
+---
+
+## 1. Equivalence Partitioning (EP)
+
+**Goal:** One representative per input class. If one value in a partition passes, all values in that partition pass.
+
+**How to apply:**
+1. Extract partitions from `spec.md` constraints (e.g., field accepts 1-100)
+2. Valid class: 1 <= value <= 100
+3. Invalid class (below): value < 1
+4. Invalid class (above): value > 100
+5. Write **one** scenario per class
+
+**Anti-pattern:**
+```gherkin
+# BAD — 3 scenarios, same class, same result:
+Scenario: VP-VAL-001 Enter value 10
+Scenario: VP-VAL-002 Enter value 50
+Scenario: VP-VAL-003 Enter value 80
+```
+```gherkin
+# GOOD — one representative per class:
+Scenario: VP-VAL-001 Valid range value is accepted       # value = 50
+Scenario: VP-VAL-002 Below minimum is rejected           # value = 0
+Scenario: VP-VAL-003 Above maximum is rejected           # value = 101
+```
+
+---
+
+## 2. Boundary Value Analysis (BVA)
+
+**Goal:** Test exact edges where off-by-one errors occur (`>` vs `>=`, `<` vs `<=`).
+
+### Two modes
+
+| Mode | Values | Use when |
+|---|---|---|
+| **Compact (default)** | `min-1`, `min`, `max`, `max+1` | Most fields |
+| **Full 6-point** | `min-1`, `min`, `min+1`, `max-1`, `max`, `max+1` | Critical fields with `@critical`/`@high` priority |
+
+**How to apply** (example: "quantity must be 1-10"):
+- `min-1` = 0 -> invalid
+- `min` = 1 -> valid (lower boundary)
+- `max` = 10 -> valid (upper boundary)
+- `max+1` = 11 -> invalid
+- Midpoint (e.g., 5) already covered by EP valid class
+
+**BVA scenarios** (example: quantity 1-10):
+- `@high VP-VAL-010 Below minimum (0) is rejected`
+- `@high VP-VAL-011 Minimum boundary (1) is accepted`
+- `@high VP-VAL-012 Maximum boundary (10) is accepted`
+- `@high VP-VAL-013 Above maximum (11) is rejected`
+
+---
+
+## 3. Decision Table
+
+**Goal:** Cover all condition combinations when 2+ conditions constrain each other.
+
+**How to apply:** List conditions from `spec.md` → build combination→outcome table → one scenario per row.
+
+**Cap:** When >3 boolean conditions (>8 rows), prioritize rows with **distinct outcomes** and add `@manual` for exhaustive combos.
+
+**Example** — Submit requires valid form AND permission → 4 combos, 2 distinct outcomes:
+- `@normal` Form invalid + no permission → disabled
+- `@normal` Form valid + no permission → disabled
+- `@normal` Has permission + form invalid → disabled
+- `@critical` Form valid + has permission → succeeds
+
+---
+
+## 4. State Transition
+
+**Goal:** Verify every valid transition AND block invalid ones.
+
+**How to apply:** Extract state diagram from `spec.md` → one scenario per valid transition + key invalid transitions.
+
+**Example** — Order lifecycle (Draft→Pending→Approved→Completed):
+- `@high` Valid: Draft → Pending, Pending → Approved, Approved → Completed
+- `@normal` Invalid: Completed → Draft (blocked), Pending → Completed (skip approval)
+
+**test-data:** Use named state keys (`order_in_draft`, `order_in_pending`).

package/dist/orchestrator/templates/ai-instructions/claude-skill-viewpoint.md

@@ -1,6 +1,6 @@
 ---
 name: sungen-viewpoint
-description: '7 UI patterns x 4 viewpoints — structured checklist for test case generation and review. Auto-loaded by make-tc and review commands.'
+description: '10 UI patterns x 4 viewpoints — structured checklist for test case generation and review. Auto-loaded by create-test and review commands.'
 user-invocable: false
 ---
 
@@ -13,148 +13,234 @@ user-invocable: false
 | **Logic** | Business rules, interactions, state changes | VP-LOGIC |
 | **Security** | Auth, injection, permissions | VP-SEC |
 
+## Shared Checks (apply across all patterns)
+
+These appear in multiple patterns — test once per screen, not per pattern:
+
+| Check | ER |
+|---|---|
+| **Loading State** | Spinner/skeleton shown, UI interaction locked during fetch |
+| **Empty State** | Clear message when no data, layout intact |
+| **XSS/Injection** | Malicious input sanitized to plain text, never executed |
+| **URL Manipulation** | Invalid URL params fallback to defaults, no server crash |
+
 ---
 
-## 1. Form & Inputs
+## GROUP 1: DATA ENTRY
+
+### 1. Form & Inputs
 
 **UI/UX**
-- Field States: disabled/readonly fields are dimmed and locked
-- Button States: Submit disabled when invalid, enabled when valid
-- Loading States: Spinner + block UI while waiting for server
-- Keyboard Navigation: Tab order correct, Enter submits form
+- Field States: disabled/readonly fields dimmed and locked, no interaction allowed
+- Button States: Submit disabled when form invalid, auto-enabled when valid
+- Keyboard Nav: Tab order correct, Enter submits form
 
 **Data & Validate**
-- Requirements: required field blank shows error, optional allowed blank
-- Boundaries & Types: min/max length, format (email, number) with error messages
-- Whitespace: trims excess whitespace or errors on spaces-only
-- Error Messaging: error at correct location, disappears on correction (Error Recovery)
+- Required/Optional: blank required field shows error; optional allows blank
+- Boundaries & Format: min/max length, format (email, number) with error messages
+- Whitespace: auto-trim or reject spaces-only input
+- Error Recovery: error at correct field, disappears immediately when user corrects data
 
 **Logic**
-- Dependencies: Field A value determines Field B status/data
-- Submission Control: prevent double submit (disable button after first click)
-- Success Flow: redirect / success toast / reset form
+- Field Dependencies: Field A value determines Field B status/options
+- Double Submit Prevention: button disabled after first click, only 1 request sent
+- Success Flow: redirect / success toast / form reset
 - Failure Flow: server error retains form data + shows system error
 
 **Security**
-- Injection Protection: XSS/SQL injection sanitized to plain text, never executed
+- → Shared: XSS/Injection
 
 ---
 
-## 2. Data Table
+## GROUP 2: DATA MANAGEMENT
+
+### 2. Data Table
 
 **UI/UX**
-- Empty State: clear message when no data, layout intact
-- Loading State: skeleton/spinner, table interaction locked during fetch
-- Layout & Truncation: long content truncated with tooltip, column width stable
+- → Shared: Empty State, Loading State
+- Truncation: long content shows `...` with tooltip on hover, column width stable
 - Sticky Elements: fixed header on vertical scroll, fixed action column on horizontal scroll
 
 **Data & Validate**
-- Consistency: total record count on UI matches server data
-- Row Limit: displayed rows never exceed page size/limit
-- Cell Integrity: cell data matches database, correct format (date, currency, status)
-- **Use `table match data:` with inline DataTable** for multi-row content verification (filter-based, resilient to data changes)
-- 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
+- Record Count: "Total records" on UI matches server data exactly
+- Row Limit: displayed rows never exceed configured page size
+- Cell Integrity: cell data matches database, correct format (date, currency, status label)
 
 **Logic**
-- Sorting: column sort refreshes data with correct order, updates header icon
+- Sorting: column sort refreshes table with correct order, updates header icon
 - Row Actions: Edit/Delete/View buttons act on correct row ID
 
 **Security**
-- UI-level RBAC: hide sensitive columns or privileged buttons without authority
-- XSS Rendering: malicious code in database displayed as plain text
+- RBAC: hide sensitive columns or privileged action buttons without authority
+- → Shared: XSS/Injection (data from DB displayed safely)
+
+---
+
+### 3. Create / Add
+
+**UI/UX**
+- Blank Slate: all fields empty or BA-specified defaults, NO cache from previous operation
+- Required Indicator: required fields marked with visual cue (e.g., red *)
+- Unsaved Changes: navigate away with dirty form → browser/system warning popup
+
+**Data & Validate**
+- → Inherited: all Form & Inputs validation rules apply
+- Unique Constraint: duplicate unique field (e.g., Employee ID) → reject save, inline error
+- Data Dependency: selecting parent field loads correct child options
+
+**Logic**
+- Save & Close: toast notification, redirect to list, new record visible per sort rule
+- Save & Add Another: save to DB, form resets to blank for next entry
+- Double Submit Prevention: → same as Form & Inputs
+- Cancel: form closes, NO garbage record in DB, next open shows blank form
+
+**Security**
+- API Bypass / 403: unauthorized POST → system blocks (403 Forbidden), no record created
+- → Shared: XSS/Injection (persisted safely, not executed on display)
+
+---
+
+### 4. Update / Edit
+
+**UI/UX**
+- Pre-fill / Data Binding: all fields display exact current DB data (text, dropdown, radio, date...)
+- Readonly Fields: identity fields (ID, username, employee code) disabled, no interaction
+- Cancel: no data changed in DB; if dirty → unsaved changes warning
+
+**Data & Validate**
+- → Inherited: all Form & Inputs validation rules apply
+- Unique Self: saving without changing unique field → success, no self-duplicate error
+- Unique Conflict: changing unique field to existing value → duplicate error, block save
+- Unchanged Submit: Save disabled until dirty, or success without DB UPDATE
+
+**Logic**
+- Update Success: toast "Updated successfully", new data reflects on UI immediately without reload
+- Concurrent Edit: another user already edited → conflict warning, require reload
+
+**Security**
+- Authorization / 403: access edit without permission → 403 page
+- Not Found / 404: edit deleted object → 404
 
 ---
 
-## 3. Search
+### 5. Delete
 
 **UI/UX**
-- No Results: "No results found" message, list empty, Clear button visible
-- Loading State: spinner/skeleton, list dimmed, interaction locked
+- Confirmation: click Delete → MUST show confirmation dialog, delete button in warning color
+- Cancel: popup closes, record intact on UI and DB, no API called
+- Success Update: toast "Deleted successfully", record disappears immediately without reload
+- Pagination Fallback: delete only record on current page → auto-navigate to previous page
+
+**Data & Validate — Dependencies**
+- Independent: delete succeeds normally
+- Referenced (Restrict): delete parent with children → blocked, clear error "in use at [Module]"
+- Referenced (Cascade): warning first, then deletes parent AND all related children
+- Referenced (Set Null): parent deleted, child reference set to Unassigned/Empty
+
+**Logic — Storage**
+- Soft Delete: record hidden from UI, DB retains with status flag (is_deleted, deleted_at)
+- Hard Delete: record removed from UI AND permanently deleted from DB
+
+**Security**
+- Deleted Access / 404: soft or hard delete → direct URL/API returns 404
+- API Bypass: API delete on restricted object → backend rejects with business error, no 500
+
+---
+
+### 6. Search
+
+**UI/UX**
+- → Shared: Empty State ("No results found"), Loading State
 - Clear Action: search box empties, list reloads default data
 
 **Data & Validate**
-- Cleanup: auto-trim whitespace, results match cleaned keyword
-- Input Limits: prevent input beyond max length or show error
-- Normalization: case-insensitive matching, handles Vietnamese accents
+- Whitespace: auto-trim, results match cleaned keyword
+- Input Limits: prevent beyond max length or show error
+- Normalization: case-insensitive, handles accented characters correctly
 
 **Logic**
-- Matching: partial/exact match returns correct results, no 500 errors
-- Multi-keyword: results based on AND/OR logic
-- Performance: debounce ~300ms before API call
+- Matching: partial/exact match returns correct results, no 500
+- Multi-keyword: results based on AND/OR logic per spec
+- Debounce: ~300ms delay before API call
 
 **Security**
-- Injection: XSS/SQL encoded as plain text, never executed
-- Wildcards: `%, _, *` treated as normal text (escaped)
+- → Shared: XSS/Injection
+- Wildcards: `%`, `_`, `*` treated as literal text (escaped), not DB commands
 
 ---
 
-## 4. Filter
+### 7. Filter
 
 **UI/UX**
 - Feedback: selected filters displayed as tags/badges
 - Persistence: collapse/expand retains selected values
-- Conflicts: conflicting conditions show "No data" message, header layout intact
+- Conflicts: conflicting conditions show "No data" message, layout intact
 
 **Data & Validate**
-- Range Validation: start > end or min > max shows field error, Apply button disabled
+- Range Validation: start > end or min > max → field error, Apply disabled
 - Dropdown Integrity: options match 100% of actual data, hide unauthorized values
 
 **Logic**
-- Logic AND/OR: results satisfy correct filter logic, Total Count updated
+- AND/OR Logic: results satisfy correct filter logic, total count updated
 - Dependent Filters: selecting Filter A updates Filter B options
-- Reset & Navigation: reset returns original data or preserves state depending on action
+- Reset & Navigation: reset returns original data or preserves state per spec
 
 **Security**
-- URL Manipulation: erroneous URL params ignored, defaults assigned, no 500 error
+- → Shared: URL Manipulation
 
 ---
 
-## 5. Pagination
+### 8. Pagination
 
 **UI/UX**
 - Boundary States: Previous/First disabled on page 1, Next/Last disabled on last page
-- Active & Loading: active page highlighted, loading effect during page transition
-- Hidden State: pagination bar hidden when data fits one page
+- Active Page: highlighted, loading effect during page transition
+- Hidden: pagination bar hidden when data fits one page
 
 **Data & Validate**
-- Label Consistency: "Viewing X of Y" matches actual data
+- Label Consistency: "Viewing X of Y" matches actual data exactly
 - Zero Records: pagination hidden, empty state displayed
 
 **Logic**
 - Navigation: loads correct dataset for page (page 2, limit 10 = records 11-20)
 - Change Page Size: shows correct quantity, resets to page 1
 - Interaction Resets: new search/filter resets to page 1
-- Delete Fallback: deleting all records on last page pushes to previous page
 
 **Security**
-- URL Manipulation: invalid page/size in URL fallbacks to defaults, no server crash
+- → Shared: URL Manipulation
 
 ---
 
-## 6. Modal / Dialog
+## GROUP 3: NAVIGATION & CONTAINERS
+
+### 9. Modal / Dialog
 
 **UI/UX**
-- Overlay & Backdrop: centered modal, backdrop blur, background scroll locked
+- Overlay: centered modal, backdrop blur, background scroll locked
 - Focus Trapping: Tab key cycles only within modal elements
 - Responsive: modal resizes, action buttons always visible or scrollable
 
 **Data & Validate**
-- Dismiss Actions: close via X, Cancel, Escape, backdrop click. Resets data on reopen
+- Dismiss Actions: close via X, Cancel, Escape, backdrop click → resets data to default on reopen
 
 **Logic**
-- Submissions: action button shows loading, modal closes on success, background data updated
-- Failure: modal stays open on API error, shows error message, retains entered data
+- Submit Success: action button shows loading, modal closes, background data updated
+- Submit Failure: modal stays open, shows error message, retains entered data
 - Stacked Modals: Modal B over A has higher z-index, closing B keeps A intact
 
 **Security**
-- Reload & Security: handles deep linking if present, removes HTML from DOM on close (protect sensitive data)
+- DOM Cleanup: remove HTML from DOM on close to protect sensitive data
+- Reload: handles deep linking if present
 
 ---
 
-## 7. List / Card
+## GROUP 4: DISPLAY PATTERNS
+
+### 10. List / Card
 
 **UI/UX**
-- Visual States: empty state when empty, skeleton when loading, hover effect (shadow/scale) on card
+- → Shared: Empty State, Loading State
+- Hover Effect: shadow/scale on card hover
 - Content: text truncation without breaking card height, placeholder image on broken image
 
 **Data & Validate**
@@ -164,25 +250,26 @@ user-invocable: false
 **Logic**
 - Navigation: clicking card navigates to correct detail page
 - Direct Actions: Like/Add to Cart updates immediately without reloading list
-- Loading Flows: Load More / Infinite Scroll appends records, maintains scroll position
+- Infinite Scroll / Load More: appends records, maintains scroll position
 - Layout Toggle: Grid/List view switch changes UI but preserves data
 
 **Security**
-- RBAC & Resilience: hide sensitive data/privileged buttons from DOM. Network loss shows error + "Try again" button
+- RBAC: hide sensitive data or privileged buttons from DOM
+- Network Resilience: error message + "Retry" button on connection loss
 
 ---
 
 ## Security Tag Rules
 
-For VP-SEC scenarios testing **unauthorized access** (no login, wrong role, direct URL access):
-- Use **`@no-auth`** tag — this runs the test without authentication, which is exactly what you want to verify.
-- Do NOT use `@manual` for these — they are automatable with `@no-auth`.
+For VP-SEC scenarios testing **unauthorized access** (no login, wrong role, direct URL):
+- Use **`@no-auth`** tag — runs without authentication to verify redirect/block.
+- Do NOT use `@manual` for these — they are automatable.
 
 ```gherkin
-@no-auth
+@critical @no-auth
 Scenario: VP-SEC-001 Unauthenticated user cannot access admin page
   Given User is on [Admin] page
   Then User see [Login] page
 ```
 
-Use `@manual` only when the environment truly cannot be set up automatically (e.g., third-party OAuth, physical device).
+Use `@manual` only when the environment truly cannot be set up automatically.