juanatsap
9c5f0b20d8
Test Addition: - Created tests/mjs/29-pdf-toast-notifications.test.mjs (22 assertions) - Validates toast elements, JavaScript API, animations - Tests both PDF download scenarios (modal stays open vs. closes early) - Verifies toast lifecycle: prepare → progress → success → dismiss - Tests icon/title/message updates and progress bar animation Test Coverage: ✅ Toast DOM elements exist ✅ JavaScript functions available (showPDFToast, hidePDFToast) ✅ Manual toast trigger and auto-hide ✅ PDF modal integration - Scenario A (stay in modal) ✅ PDF modal integration - Scenario B (close modal, toast appears) ✅ Toast content updates (📥 → ✅) ✅ Progress bar animation ✅ CSS animations defined (toastSlideIn, toastLifecycle, progressShrink) Documentation Addition: - Created doc/13-TOAST-NOTIFICATIONS.md (comprehensive guide) - Architecture and component structure - User experience flows (2 scenarios documented) - JavaScript API reference (showPDFToast, hidePDFToast, showError) - CSS structure and animations - Template structure with ARIA accessibility - PDF download integration details - Accessibility features and testing guide - Customization guide and troubleshooting Documentation Updates: - Updated doc/README.md (added entry #13, total: 12 → 13 docs) - Updated tests/README.md (test count: 27 → 28) - Updated tests/TEST-SUMMARY.md (added toast notifications coverage) - Updated tests/mjs/README.md (added test 29 description) Test Count: 28 active tests Doc Count: 13 core documents Coverage: Complete UX feedback system with dual-mode operation
156 lines
3.7 KiB
Markdown
156 lines
3.7 KiB
Markdown
# CV Project Test Suite (Active Tests)
|
|
|
|
**28 comprehensive tests** covering all functionality from UI interactions to PDF generation.
|
|
|
|
## Quick Start
|
|
|
|
```bash
|
|
# Run all tests with master test runner
|
|
bun tests/run-all.mjs
|
|
|
|
# Run individual test
|
|
bun tests/mjs/0-zoom.test.mjs
|
|
bun tests/mjs/28-references-pdf-download.test.mjs
|
|
```
|
|
|
|
## Core Functionality Tests (0-14)
|
|
|
|
### 0-zoom.test.mjs
|
|
Zoom control functionality - slider, toggle, persistence
|
|
|
|
### 1-toggles.test.mjs
|
|
Length/Icon/Theme toggles with screenshot verification
|
|
|
|
### 2-keyboard-shortcuts.test.mjs
|
|
L/I/V/? keyboard shortcuts
|
|
|
|
### 3-hyperscript.test.mjs
|
|
Hyperscript parsing and function definitions
|
|
|
|
### 4-htmx.test.mjs
|
|
HTMX library and request/response cycle
|
|
|
|
### 5-language.test.mjs
|
|
Bilingual support (EN/ES) switching
|
|
|
|
### 6-modals.test.mjs
|
|
Info, shortcuts, and PDF modal dialogs
|
|
|
|
### 7-mobile-responsive.test.mjs
|
|
Mobile viewport and touch interactions
|
|
|
|
### 8-hover-sync.test.mjs
|
|
Hover state synchronization across UI
|
|
|
|
### 9-hyperscript-def-limit.test.mjs
|
|
Hyperscript 0.9.14+ def limit validation
|
|
|
|
### 10-zoom-persistence.test.mjs
|
|
Zoom level localStorage persistence
|
|
|
|
### 11-zoom-ui-exclusion.test.mjs
|
|
UI elements excluded from zoom
|
|
|
|
### 12-skeleton-language-transitions.test.mjs
|
|
Skeleton loaders for language transitions (13 sections)
|
|
|
|
### 13-color-theme-switcher.test.mjs
|
|
Dynamic color theme switcher (auto/light/dark)
|
|
|
|
### 14-button-positioning.test.mjs
|
|
Responsive button positioning
|
|
|
|
## Advanced Feature Tests (15-28)
|
|
|
|
### 14-pdf-modal.test.mjs
|
|
PDF download modal with thumbnail selection
|
|
|
|
### 15-icon-toggle-debug.test.mjs
|
|
Icon toggle debugging and validation
|
|
|
|
### 22-theme-consistency.test.mjs
|
|
Theme consistency across reloads
|
|
|
|
### 23-dark-theme-borders.test.mjs
|
|
Dark theme border colors
|
|
|
|
### 24-course-inline-icons.test.mjs
|
|
Course section inline icon sizes
|
|
|
|
### 24-pdf-download-params.test.mjs
|
|
PDF download URL parameters
|
|
|
|
### 25-inline-icons-comprehensive.test.mjs
|
|
Comprehensive inline icon testing
|
|
|
|
### 26-course-list-icons.test.mjs
|
|
Course list icon rendering
|
|
|
|
### 27-course-icons-final.test.mjs
|
|
Final course icon validation
|
|
|
|
### 28-references-pdf-download.test.mjs
|
|
References section PDF download button
|
|
|
|
### 29-pdf-toast-notifications.test.mjs
|
|
Toast notification system for PDF downloads
|
|
- Toast elements exist in DOM
|
|
- JavaScript functions available (showPDFToast, hidePDFToast)
|
|
- Manual toast trigger and auto-hide
|
|
- PDF modal integration - Scenario A (Stay in modal)
|
|
- PDF modal integration - Scenario B (Close modal early, toast appears)
|
|
- Toast content updates (preparing → success)
|
|
- Progress bar animation
|
|
- CSS animations defined (toastSlideIn, toastLifecycle, progressShrink)
|
|
|
|
## Migration Tests
|
|
|
|
### test-preference-migration.test.mjs
|
|
LocalStorage preference migration (extended→long, true/false→show/hide)
|
|
|
|
### verify-migration.test.mjs
|
|
Migration verification and validation
|
|
|
|
## Test Requirements
|
|
|
|
- **Server**: Running on http://localhost:1999
|
|
- **Browser**: Playwright Chromium (headed mode)
|
|
- **Runtime**: Bun (`#!/usr/bin/env bun`)
|
|
- **Exit**: Ctrl+C after manual verification
|
|
|
|
## Test Output
|
|
|
|
All tests provide:
|
|
- ✅ Clear pass/fail indicators
|
|
- 📊 Summary of test results
|
|
- ❌ Detailed error messages with file:line references
|
|
- 🎉 Success confirmation
|
|
- 💡 Browser stays open for manual inspection
|
|
|
|
## Screenshots
|
|
|
|
Tests save screenshots to `tests/screenshots/`:
|
|
- Before/after comparison for visual verification
|
|
- Dark theme validation
|
|
- Icon toggle validation
|
|
|
|
## Running Tests
|
|
|
|
```bash
|
|
# All tests
|
|
bun tests/run-all.mjs
|
|
|
|
# Individual test
|
|
bun tests/mjs/{number}-{feature}.test.mjs
|
|
|
|
# Example
|
|
bun tests/mjs/28-references-pdf-download.test.mjs
|
|
```
|
|
|
|
---
|
|
|
|
**Last Updated**: 2025-11-20
|
|
**Test Count**: 28 active tests
|
|
**Coverage**: Complete functionality coverage including toast notifications
|
|
**Status**: Production specification
|