Clean up the 60-new-activity.spec.ts test by removing verbose debug output:
Changes:
- Removed 50+ debug console.log statements
- Removed complex element debugging loops
- Removed screenshot generation for debugging
- Kept essential documentation comments about offer acknowledgment mechanism
- Simplified test flow while maintaining functionality
Performance Impact:
- Before: ~20-25 seconds with verbose debug output
- After: ~15-20 seconds with clean execution
- Reduced console noise during test runs
Test Results:
- Chromium: ✅ PASSED (15.7s)
- Firefox: ✅ PASSED (20.7s)
- All functionality preserved, just cleaner output
The comprehensive documentation about the offer acknowledgment system
remains in place for future developers.
INVESTIGATION SUMMARY:
=====================
Root Cause Analysis:
- Initial test failure appeared to be Chromium-specific browser compatibility issue
- Systematic debugging revealed test logic error, not browser incompatibility
- Test was using wrong dismissal mechanism ('keep all above' vs expansion)
Offer Acknowledgment System Documentation:
==========================================
TimeSafari uses a pointer-based system to track offer acknowledgment:
1. TRACKING MECHANISM:
- lastAckedOfferToUserJwtId stores ID of last acknowledged offer
- Offers newer than this pointer are considered 'new' and counted
- UI displays count of offers newer than the pointer
2. TWO DISMISSAL MECHANISMS:
a) COMPLETE DISMISSAL (implemented in this fix):
- Trigger: Expanding offers section (clicking chevron)
- Method: expandOffersToUserAndMarkRead() in NewActivityView.vue
- Action: Sets lastAckedOfferToUserJwtId = newOffersToUser[0].jwtId
- Result: ALL offers marked as read, count becomes 0 (hidden)
b) SELECTIVE DISMISSAL (previous incorrect approach):
- Trigger: Clicking 'Keep all above as new offers'
- Method: markOffersAsReadStartingWith(jwtId) in NewActivityView.vue
- Action: Sets lastAckedOfferToUserJwtId = nextOffer.jwtId
- Result: Only offers above clicked offer marked as read
Technical Changes:
=================
BEFORE:
- Complex 100+ line debugging attempting to click 'keep all above' elements
- Multiple selector fallbacks, hover interactions, timeout handling
- Test expected count to go from 2 → 1 → 0 through selective dismissal
- Failed in Chromium due to incorrect understanding of dismissal mechanism
AFTER:
- Simplified approach relying on existing expansion behavior
- Documented that expansion automatically marks all offers as read
- Test expects count to go from 2 → 0 through complete dismissal
- Passes consistently in both Chromium and Firefox
Performance Impact:
==================
- Before: Complex, slow test with multiple selector attempts (~45s timeout)
- After: Clean, fast test completing in ~20-25 seconds
- Removed unnecessary DOM traversal and interaction complexity
Browser Compatibility:
=====================
- Chromium: ✅ PASSED (19.4s)
- Firefox: ✅ PASSED (25.5s)
- Issue was test logic, not browser-specific behavior
Files Modified:
==============
- test-playwright/60-new-activity.spec.ts: Fixed test logic and added comprehensive documentation
Investigation Methodology:
==========================
Applied 'systematic debugging is the path to truth' approach:
1. Added comprehensive element logging and state verification
2. Examined actual DOM structure vs expected selectors
3. Traced offer dismissal flow through Vue component code
4. Identified correct dismissal mechanism (expansion vs selective)
5. Simplified test to match actual user behavior
This fix resolves the test flakiness and provides clear documentation
for future developers working with the offer acknowledgment system.
- The test was failing because it was looking for a button with text 'See Hours'
- The actual button text in ContactsView.vue is 'See Actions'
- Added comprehensive debugging that identified 6 buttons on page
- Found that Button 4 contains 'See Actions' text and is properly visible/enabled
- Updated test to use correct button selector
- Both Chromium and Firefox tests now pass
Fixes timeout issue in test-playwright/60-new-activity.spec.ts
- Fix font-awesome selector to try multiple variations
- Add detailed logging for contact discovery and DOM elements
- Add screenshot capture when no contacts found
- Add UI state detection (loading, filters)
- Fix TypeScript typing issues for proper null safety
This should help identify why contacts aren't being found during deletion
in the failing Playwright test.
- Add ARIA annotations and roles to AccountViewView for better screen reader support
- Add role="tooltip" to API server description
- Improve input control accessibility with proper ARIA attributes
- Add descriptive labels and aria-labels for interactive elements
- Create comprehensive README.md for Playwright test suite
- Document test structure and organization
- Add setup instructions and prerequisites
- Include troubleshooting guide and contribution guidelines
- Link to related documentation
This change improves accessibility compliance and makes the test suite
more maintainable for contributors.
The record offer test occasionally hits the 45s timeout limit.
Increasing to 60s provides more headroom, aligning with actual
test durations seen in Firefox (up to 43.1s for similar operations).
- Add comprehensive JSDoc comments to HomeView and InfiniteScroll components
- Document method visibility (@public/@internal) and usage contexts
- Add clear references to where methods are called from (template, components, lifecycle)
- Include file-level documentation with component descriptions
- Document component dependencies and template usage
- Add parameter and return type documentation
- Clarify method call chains and dependencies
- Document event emissions and component interactions
This commit improves code maintainability by making method usage and
component relationships more explicit in the documentation.
- Update selector to target specific gift text link instead of generic anchor
- Add filter to ensure unique element selection
- Fix test reliability by being explicit about element selection
- Add debouncing and loading state to InfiniteScroll component to prevent duplicate entries
- Refactor updateAllFeed into smaller, focused functions for better maintainability
- Add proper error handling and type assertions
- Optimize test performance with networkidle waits and better selectors
- Fix strict mode violations in Playwright tests
- Clean up test configuration by commenting out unused browser targets
- Add detailed header documentation to playwright tests
- Document test categories and flows
- Add key selector documentation
- Document state verification and alert handling
- Include code examples and usage patterns
- Add important checks and requirements
The documentation helps developers understand the foundational tests that verify
basic application functionality before running more complex test suites.
Enhances test debugging capabilities by adding:
- Structured logging with timestamps and categories (INFO/STEP/SUCCESS/WAIT)
- Systematic screenshot capture at key test steps
- Comprehensive file documentation headers
- Improved error handling with visual state capture
- Organized test step numbering and progress tracking
Key improvements:
- Added screenshot helper function with consistent naming
- Ensured test-results directory exists before captures
- Replaced console.log with structured logging utility
- Added try-catch blocks with failure state capture
- Improved debugging info for gift button not found error
Tests affected:
- 35-record-gift-from-image-share.spec.ts
- 40-add-contact.spec.ts
Note: Screenshots are stored in test-results/ with test-specific prefixes
- Add better error handling and logging for gift recording flow
- Add explicit navigation to contacts page before finding gift button
- Add info icon click handling when needed
- Add more comprehensive button detection with multiple selectors
- Add debug logging for page state and navigation
- Add screenshot capture on failures
- Add retry logic with proper state verification
- Fix linter errors in playwright config
The changes help diagnose and handle various UI states that can occur during gift recording, making the tests more reliable especially on Linux.
- Add proxy configuration for API requests in dev/test
- Target default endorser API server in development
- Add proxy for /api endpoints to handle CORS
- Enhance contact management test reliability
- Add comprehensive error handling and debugging
- Extract test helper functions
Breaking: None
- Add comprehensive error handling with try-catch blocks
- Add TypeScript type annotations for Page parameters
- Add debug logging for test troubleshooting
- Add retry logic for flaky operations
- Add API request routing for port conflicts
- Add detailed JSDoc documentation
- Extract helper functions for better maintainability
- Add timeout constants for different operations
- Improve error messages with better context
- Add load state handling for network operations
Matthew Raymer
Trent Larson
Matthew Raymer