Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Back button doesn't work when next and previous restorationIndetifiers from turbo history the same #1333

Open
volodymyr-nt opened this issue Nov 1, 2024 · 1 comment
Open

Back button doesn't work when next and previous restorationIndetifiers from turbo history the same #1333

volodymyr-nt opened this issue Nov 1, 2024 · 1 comment

Comments

@volodymyr-nt
Copy link

volodymyr-nt commented Nov 1, 2024 •
edited
Loading

Hi.
I have filter form where i fetch turbo stream responses and push state updates with

Turbo.navigator.history.push(filterUrl)

Following flow is broken:

  1. / page loaded.
  2. I apply filter(which does Turbo.navigator.history.push(filterUrl)) - updates url, pushes state - everything ok.
  3. I click back button - it updates url but it doesn't perform navigation.

I found only one workaround for this using stimulus:

// Stimulus filter component
connect() {
  window.addEventListener("popstate", this.handlePopstate);
}
handlePopstate = (e) => {
  if (!Turbo.navigator.formSubmission && !Turbo.navigator.adapter.progressBar?.visible) {
    Turbo.visit(window.location.href, { action: "advance" })
  }
}

Is this bug in stimulus? Are there some options or more elegant workarounds?
@volodymyr-nt volodymyr-nt changed the title Back button dosent work when next and previous restorationIndetifiers from turbo history the same Back button doesn't work when next and previous restorationIndetifiers from turbo history the same Nov 1, 2024
@volodymyr-nt
Copy link
Author

volodymyr-nt commented Nov 1, 2024 •
edited
Loading

Upd: Found that problem lies in this line:

turbo/src/core/drive/navigator.js

Line 138 in ea54ae5

getRequestURL(location) === getRequestURL(this.view.lastRenderedLocation) &&

In my case i navigate back to / page which is the same page that was rendered by Turbo last time

Alternative workaround is about doing push and setting lastRenderedLocation:

<%#  In <head> for filter page or globally %>
<meta name="turbo-cache-control" content="no-cache">
Turbo.navigator.history.push(filterUrl);
Turbo.navigator.view.lastRenderedLocation = filterUrl;
// or
Turbo.navigator.history.push(filterUrl);
Turbo.session.pageBecameInteractive();

Would be nice to have the same behavior like listed in code snippet above as one method and part of public Turbo api.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@volodymyr-nt