The QR Studio app (/business/apps/qr) lets users generate QR codes for 10 content types (URL, Text, Phone, SMS, Email, WhatsApp, WiFi, vCard, Location, Event), customize their style, download as PNG or SVG, and update them dynamically after creation.
Routes under test:
| Route | Purpose |
|---|
/business/apps/qr | Dashboard with stats and recent QR codes |
/business/apps/qr/codes | Filterable QR code list |
/business/apps/qr/codes/new | Create a new QR code |
/business/apps/qr/codes/[id] | View, edit, download, and delete a QR code |
/business/apps/qr/settings | QR settings (placeholder) |
| ID | Description | Preconditions | Steps | Expected Result | Priority |
|---|
| QR-001 | Dashboard loads stats | User has QR codes | 1. Navigate to /business/apps/qr | Four stat cards: Total Codes, Active, Archived, Scans | P0 |
| QR-002 | Recent QR codes grid | User has QR codes | 1. Navigate to /business/apps/qr | Up to 6 recent codes shown in a grid with name, type badge, and creation date | P0 |
| QR-003 | Empty dashboard | No QR codes exist | 1. Navigate to /business/apps/qr | ”No QR codes yet” empty state with link to create | P1 |
| QR-004 | New QR Code button | User is on dashboard | 1. Click “New QR Code” | Navigates to /business/apps/qr/codes/new | P1 |
| QR-005 | Quick nav cards | User is on dashboard | 1. Click “QR Codes” and “Settings” nav cards | Each navigates correctly | P1 |
| ID | Description | Preconditions | Steps | Expected Result | Priority |
|---|
| QR-010 | Code list renders as grid | User has QR codes | 1. Navigate to /business/apps/qr/codes | Grid displays each code with name, type badge, file format, and creation date; count badge in header | P0 |
| QR-011 | Search filter | QR codes with distinct names exist | 1. Type a name into search 2. Submit | Only matching codes displayed | P0 |
| QR-012 | Type filter — URL | QR codes of various types exist | 1. Click “URL” filter button | Only URL-type codes displayed | P0 |
| QR-013 | Type filter — WiFi | WiFi QR codes exist | 1. Click “WiFi” filter | Only WiFi-type codes displayed | P1 |
| QR-014 | Type filter — vCard | vCard QR codes exist | 1. Click “vCard” filter | Only vCard-type codes displayed | P1 |
| QR-015 | Type filter — All Types | A type filter is active | 1. Click “All Types” | All codes displayed; type param removed | P1 |
| QR-016 | Filter by each type | Codes of each type exist | 1. Click each type filter button (URL, Text, Phone, SMS, Email, WhatsApp, WiFi, vCard, Location, Event) one at a time | Each filter displays only the correct type | P2 |
| QR-017 | Empty code list | No codes match filters | 1. Apply filters that match nothing | ”No QR codes found.” with create button | P1 |
| QR-018 | Code card navigates to detail | Code list displayed | 1. Click on a QR code card | Navigates to /business/apps/qr/codes/[id] | P0 |
| ID | Description | Preconditions | Steps | Expected Result | Priority |
|---|
| QR-020 | Create URL QR code | User is authenticated | 1. Navigate to /business/apps/qr/codes/new 2. Enter name 3. Select type “URL” 4. Enter URL in the QrDataForm 5. Click “Create QR Code” | Redirected to code list; new QR code appears | P0 |
| QR-021 | Create vCard QR code | User is authenticated | 1. Select type “vCard” 2. Fill in vCard data fields 3. Click “Create QR Code” | QR code created with vCard data | P0 |
| QR-022 | Create WiFi QR code | User is authenticated | 1. Select type “WiFi” 2. Enter SSID, password, encryption 3. Click “Create QR Code” | QR code created with WiFi data | P0 |
| QR-023 | Create Text QR code | User is authenticated | 1. Select type “Text” 2. Enter plain text 3. Create | QR code created | P1 |
| QR-024 | Create Phone QR code | User is authenticated | 1. Select type “Phone” 2. Enter phone number 3. Create | QR code created | P1 |
| QR-025 | Create SMS QR code | User is authenticated | 1. Select type “SMS” 2. Enter phone and message 3. Create | QR code created | P1 |
| QR-026 | Create Email QR code | User is authenticated | 1. Select type “Email” 2. Enter recipient, subject, body 3. Create | QR code created | P1 |
| QR-027 | Create WhatsApp QR code | User is authenticated | 1. Select type “WhatsApp” 2. Enter phone and message 3. Create | QR code created | P1 |
| QR-028 | Create Location QR code | User is authenticated | 1. Select type “Location” 2. Enter lat/long 3. Create | QR code created | P2 |
| QR-029 | Create Event QR code | User is authenticated | 1. Select type “Event” 2. Enter event details 3. Create | QR code created | P2 |
| QR-030 | Validation — empty name | User is on create form | 1. Leave name blank 2. Click “Create QR Code” | Validation error on name field | P0 |
| QR-031 | Validation — no type selected | User is on create form | 1. Enter name only 2. Click “Create QR Code” | Validation error on type field | P0 |
| QR-032 | QR data form appears after type selection | User is on create form | 1. Select a type from the dropdown | QrDataForm component renders below with type-specific fields | P0 |
| QR-033 | Live preview updates | User is filling out the form | 1. Select type and enter data | QrPreview component in the right column updates in real time | P1 |
| QR-034 | Style editor toggle | User is on create form | 1. Click “Show Style Options” | QrStyleEditor component appears 2. Click “Hide Style Options” | Editor hides |
| QR-035 | Change output format to SVG | User is on create form | 1. Select “SVG” from the Output Format dropdown | file_format is set to “svg” | P1 |
| QR-036 | Default output format is PNG | User loads the create form | 1. Navigate to /business/apps/qr/codes/new | Output Format shows “PNG” by default | P2 |
| ID | Description | Preconditions | Steps | Expected Result | Priority |
|---|
| QR-040 | Detail page loads | QR code exists | 1. Navigate to /business/apps/qr/codes/[id] | Header shows name, QrStatusBadge, type badge; info card shows Format, Status, Created, Updated dates | P0 |
| QR-041 | Existing QR image displays | QR code has a file_path | 1. Navigate to detail page | Generated QR code image renders in the preview column | P0 |
| QR-042 | Update QR code name | Detail page is open | 1. Change the name field 2. Click “Save Changes” | Success toast; name updates | P0 |
| QR-043 | Update QR code type and data | Detail page is open | 1. Change type from URL to Text 2. Update data fields 3. Click “Save Changes” | Type and data update; live preview reflects changes | P0 |
| QR-044 | Update style options | Detail page is open | 1. Click “Show Style Options” 2. Change style settings 3. Click “Save Changes” | Style persists on reload | P1 |
| QR-045 | Change output format | Detail page is open | 1. Switch from PNG to SVG 2. Save | Format updates | P1 |
| QR-046 | Download QR code | Detail page is open | 1. Click the QrDownloadButton | QR code file downloads in the current format (PNG or SVG) | P0 |
| QR-047 | Delete QR code | Detail page is open | 1. Click the trash/delete button | QR code deleted; redirected to /business/apps/qr/codes | P0 |
| QR-048 | Non-owner cannot access | QR code belongs to another user | 1. Navigate to detail as different user | 403 Forbidden error | P1 |
| QR-049 | Dynamic update — scan reflects new data | QR code was created with URL A, scanned, then updated to URL B | 1. Create QR with URL A 2. Update QR to URL B 3. Scan the QR code | QR code resolves to URL B (dynamic) | P0 |
| ID | Description | Preconditions | Steps | Expected Result | Priority |
|---|
| QR-060 | Settings page loads | User is authenticated | 1. Navigate to /business/apps/qr/settings | Page renders with “Settings coming soon.” placeholder | P2 |
