Files

T

juanatsap 3f77fedeaf fix: icon toggle real-time rendering + hyperscript architecture cleanup

CRITICAL FIX: Icon toggle now works without page refresh
- Changed class name from 'show-logos' to 'show-icons' (CSS mismatch bug)
- Updated localStorage key from 'cv-logos' to 'cv-icons'
- Fixed toggleIcons() function in cv-functions.js

HYPERSCRIPT ARCHITECTURE:
- Moved 6 toggle functions from hyperscript to JavaScript (cv-functions.js)
- Solves hyperscript 0.9.14 parser limitation (max 3 def statements total)
- Upgraded hyperscript from 0.9.12 to 0.9.14
- Fixed operator precedence in keyboard shortcuts
- Cleaned view-controls.html templates (inline → function calls)

NEW FILES:
- static/js/cv-functions.js - Global toggle functions (6 functions)
- HYPERSCRIPT-RULES.md - Permanent architecture documentation
- tests/mjs/0-zoom.test.mjs - Zoom functionality test
- tests/mjs/1-toggles.test.mjs - Comprehensive toggle test with real-time verification
- tests/TEST-SUMMARY.md - Test suite documentation

TESTS:
- Real-time DOM update verification (no refresh required)
- Screenshot capture for visual regression
- localStorage persistence validation
- Toggle synchronization between action bar and menu

BREAKING CHANGE: localStorage key changed from 'cv-logos' to 'cv-icons'
Users may need to re-toggle icons preference on first load after update.

2025-11-17 13:00:03 +00:00

1.6 KiB

Raw Blame History

CV Project Test Suite

Organized test files for the CV application. All tests use Playwright for browser automation.

Test Files

0-zoom.test.mjs

Purpose: Test zoom control functionality

Verifies zoom control elements exist
Tests visibility toggle
Validates zoom slider interaction
Checks real-time zoom updates

Run: bun tests/mjs/0-zoom.test.mjs

1-toggles.test.mjs

Purpose: Comprehensive toggle testing with real-time visual verification

Tests all 3 toggles (Length, Icons, Theme)
Validates action bar toggles
Tests hamburger menu toggles
Verifies synchronization between action bar and menu
Checks localStorage persistence
Critical: Validates that toggles update DOM immediately (no refresh needed)
Takes screenshots for visual comparison

Run: bun tests/mjs/1-toggles.test.mjs

Running All Tests

# Run individual tests
bun tests/mjs/0-zoom.test.mjs
bun tests/mjs/1-toggles.test.mjs

# Run all tests sequentially
for test in tests/mjs/*.test.mjs; do
  echo "Running $test..."
  bun "$test"
  echo ""
done

Test Requirements

Server must be running on http://localhost:1999
Browser window will stay open after tests for manual verification
Press Ctrl+C to exit test

Test Output

All tests provide:

✅ Clear pass/fail indicators
📊 Summary of results
❌ Detailed error messages
🎉 Success confirmation

Screenshots

Toggle tests save screenshots to tests/screenshots/:

before-icon-toggle.png - Before clicking icon toggle
after-icon-toggle.png - After clicking icon toggle

Use these to visually verify rendering changes.

1.6 KiB Raw Blame History