Skip to content

Rewrite search results URL when scrolling and restore sidebar position#6895

Open
Arpan200502 wants to merge 1 commit intoopenstreetmap:masterfrom
Arpan200502:fix-search-scroll-url-state
Open

Rewrite search results URL when scrolling and restore sidebar position#6895
Arpan200502 wants to merge 1 commit intoopenstreetmap:masterfrom
Arpan200502:fix-search-scroll-url-state

Conversation

@Arpan200502
Copy link
Contributor

@Arpan200502 Arpan200502 commented Mar 16, 2026

Summary

This PR updates the search results sidebar so that the URL reflects the user's scroll position and browser back navigation restores the approximate location in the results list.

Previously, when navigating back from a search result, the search page would reload and start from the top of the list.

This change introduces scroll state tracking similar to the behavior implemented for the history page.


How it works

  1. Scroll detection

    • An IntersectionObserver watches .search_results_entry items inside the sidebar.
    • When a result leaves the viewport while scrolling, the URL is updated with:
      before=<result_key>
      
      or
      after=<result_key>
      
  2. URL state

    • The URL is updated using OSM.router.replace() so history is preserved without creating extra entries.
  3. Scroll restoration

    • When returning to /search?...&before=<key> via the browser back button:
      • search results load normally
      • additional result pages are fetched automatically if needed
      • once the target result appears, the sidebar scrolls to it.
  4. Observer safety

    • Scroll restoration temporarily disables the observer to prevent URL updates during the restore process.

Result

Users can now:

  1. Search for a place
  2. Scroll through multiple result pages
  3. Open a result
  4. Press browser Back

The sidebar will return close to the previous scroll position instead of restarting at the top.


Demo

A short video demonstrating the behavior is attached below.

Steps shown:

  1. Search bank
  2. Scroll through multiple result pages
  3. Open a result
  4. Use browser back button
  5. Sidebar restores near the previous scroll position
Untitled.design.1.1.mp4

Closes

Fixes #6893

@Arpan200502 Arpan200502 force-pushed the fix-search-scroll-url-state branch from f5f58a7 to 091ec16 Compare March 20, 2026 08:10
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.

URL for search results does not change when scrolling

1 participant