Skip to content

feat: Add each new link to browser history#42

Merged
konard merged 4 commits intomainfrom
issue-39-e2e327ba7d66
Jan 26, 2026
Merged

feat: Add each new link to browser history#42
konard merged 4 commits intomainfrom
issue-39-e2e327ba7d66

Conversation

@konard
Copy link
Contributor

@konard konard commented Jan 26, 2026

🎯 Summary

Implements browser history support for the Link Calculator, allowing users to navigate between different calculations using the browser's back and forward buttons.

📋 Issue Reference

Fixes #39

🔧 Implementation Details

Changes to useUrlExpression hook:

  • Modified URL synchronization to use pushState instead of replaceState for subsequent expression changes
  • First URL update (on initial load) still uses replaceState to avoid creating unnecessary history entries
  • Added popstate event listener to handle browser back/forward navigation
  • When user navigates back/forward, the expression input is automatically updated from the URL

Testing:

  • Added comprehensive E2E test that verifies:
    • Multiple expressions create separate history entries
    • Browser back button navigates to previous expressions
    • Browser forward button navigates to next expressions
    • Input and results update correctly during navigation

📝 Technical Approach

The implementation uses a useRef flag to track whether the current update is the first one after component mount. This ensures:

  1. Initial page load uses replaceState (no duplicate history entry)
  2. All user-initiated changes use pushState (creates new history entries)
  3. Browser navigation works seamlessly with the popstate handler

✅ Testing

  • Unit tests: All existing tests pass (encode/decode functions unchanged)
  • E2E tests: New test verifies complete browser history workflow
  • Manual testing: Verified back/forward navigation works correctly

📦 Files Changed

  • web/src/hooks/useUrlExpression.ts - Modified hook to use pushState and handle popstate
  • web/e2e/calculator.spec.ts - Added E2E test for browser history
  • changelog.d/20260126_155726_browser_history.md - Changelog fragment

This PR was created with assistance from Claude Code

Adding CLAUDE.md with task information for AI processing.
This file will be removed when the task is complete.

Issue: #39
@konard konard self-assigned this Jan 26, 2026
konard and others added 2 commits January 26, 2026 15:57
Implements browser history support so users can navigate between
different calculations using the browser's back/forward buttons.

Changes:
- Modified useUrlExpression hook to use pushState instead of replaceState
  for subsequent URL changes (first update still uses replaceState)
- Added popstate event listener to handle browser back/forward navigation
- Added E2E test to verify browser history functionality

Fixes #39

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@konard konard changed the title [WIP] Each new link should be added to history feat: Add each new link to browser history Jan 26, 2026
@konard konard marked this pull request as ready for review January 26, 2026 15:01
@konard
Copy link
Contributor Author

konard commented Jan 26, 2026

🤖 Solution Draft Log

This log file contains the complete execution trace of the AI solution draft process.

💰 Cost estimation:

  • Public pricing estimate: $2.132965 USD
  • Calculated by Anthropic: $1.256363 USD
  • Difference: $-0.876603 (-41.10%)
    📎 Log file uploaded as Gist (450KB)
    🔗 View complete solution draft log

Now working session is ended, feel free to review and add any feedback on the solution draft.

@konard konard merged commit 5e3d71b into main Jan 26, 2026
12 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Each new link should be added to history

1 participant