 juanatsap
|
9c5f0b20d8
|
docs: Add comprehensive toast notification test and documentation
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
|
2025-11-20 13:05:46 +00:00 |
|
|
juanatsap
|
1258d61d05
|
refactor: Modularize CSS into ITCSS architecture + update documentation
CSS Refactoring:
- Split 2,287-line monolith into 6 focused modules
- New structure: Navigation, Scroll, Buttons, Modals, Zoom, Breakpoints
- Organized by ITCSS layers (Interactive + Responsive)
- 245 lines saved through better organization
- Site verified working at localhost:1999
New CSS Files:
- 04-interactive/_navigation.css (357 lines, 8.2KB)
- 04-interactive/_scroll-behavior.css (200 lines, 5.0KB)
- 04-interactive/_buttons.css (184 lines, 4.7KB)
- 04-interactive/_modals.css (487 lines, 16KB)
- 04-interactive/_zoom-control.css (253 lines, 6.3KB)
- 05-responsive/_breakpoints.css (561 lines, 14KB)
Documentation Updates:
- Added doc/12-CSS-ARCHITECTURE.md (comprehensive CSS guide)
- Updated doc/README.md (new entry + correct numbering)
- Updated tests/README.md (test count 8 → 27)
- Updated tests/TEST-SUMMARY.md (coverage expansion)
- Rewrote tests/mjs/README.md (complete test listing)
Removed:
- static/css/04-interactive/_remaining.css (replaced by modules)
|
2025-11-20 12:34:42 +00:00 |
|
|
juanatsap
|
cb9a8eb044
|
cleanup: establish test suite as single source of truth
CRITICAL CHANGES:
✅ Deleted ALL redundant test files (40+ files removed)
✅ Added mobile responsive test (7-mobile-responsive.test.mjs)
✅ Created comprehensive tests/README.md
✅ Updated TEST-SUMMARY.md with accountability
SINGLE SOURCE OF TRUTH ESTABLISHED:
tests/
├── mjs/ # 8 ACTIVE TESTS - THE SPECIFICATION
│ ├── 0-zoom.test.mjs
│ ├── 1-toggles.test.mjs
│ ├── 2-keyboard-shortcuts.test.mjs
│ ├── 3-hyperscript.test.mjs
│ ├── 4-htmx.test.mjs
│ ├── 5-language.test.mjs
│ ├── 6-modals.test.mjs
│ └── 7-mobile-responsive.test.mjs
├── archive/ # Historical reference only
├── screenshots/ # Visual verification
├── run-all.mjs # Master test runner
└── TEST-SUMMARY.md # Complete documentation
DELETED FILES (40+):
- check-styling.html
- compare-rendered.js
- comprehensive-features.spec.js
- handlers.test, middleware.test
- All test-*.js, test-*.mjs, test-*.html files
- SHORTCUTS-BUTTON-FIX-REPORT.md
- test-screenshots/, testdata/ directories
- verify-years-styling.sh
- visual-comparison.spec.js
NEW: 7-mobile-responsive.test.mjs
Tests mobile viewport rendering:
- Mobile viewport (375px) - no horizontal scroll
- Tablet viewport (768px) - proper layout
- Touch interactions (hamburger menu)
- Responsive breakpoints (320px - 1920px)
- Viewport meta tag presence
- Touch-friendly button sizes (≥44px)
- Text readability (≥14px font)
NEW: tests/README.md
Establishes accountability:
- Tests ARE the specification
- Tests ARE the requirements
- If test passes but feature fails → TEST IS WRONG
- If feature works but test fails → FEATURE IS WRONG
- Every bug MUST have test coverage
- No deployment if tests fail
Updated TEST-SUMMARY.md:
- Added "SINGLE SOURCE OF TRUTH" header
- Documented mobile responsive test
- Clarified accountability model
- Updated test count: 8 active, 60+ archived
- Status: Production specification
Master runner auto-discovers all numbered tests
Run: bun tests/run-all.mjs
|
2025-11-17 13:41:46 +00:00 |
|