Last active
April 7, 2024 07:42
-
-
Save Intrepidd/ac68cb7dfd17d422374807efb6bf2f42 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// DISCLAIMER : You can now probably use `data-turbo-action="advance"` on your frame to perform what this controller is aiming to do | |
// https://turbo.hotwired.dev/handbook/frames#promoting-a-frame-navigation-to-a-page-visit | |
// Note that you probably want to disable turbo cache as well for those page to make popstate work properly | |
import { navigator } from '@hotwired/turbo' | |
import { Controller } from '@hotwired/stimulus' | |
import { useMutation } from 'stimulus-use' | |
export default class extends Controller { | |
connect (): void { | |
useMutation(this, { attributes: true }) | |
} | |
mutate (entries: MutationRecord[]): void { | |
entries.forEach((mutation) => { | |
if (mutation.type === 'attributes' && mutation.attributeName === 'src') { | |
const src = this.element.getAttribute('src') | |
if (src != null) { | |
const url = new URL(src) | |
navigator.view.lastRenderedLocation = url | |
navigator.history.push(url) | |
} | |
} | |
}) | |
} | |
} |
Hi @Intrepidd , It seems that the turbo-action advance updates the URL but it refreshes the whole page.
Also, have you seen issues on the history back button on your solution?
@michelson I don't experience the refreshing of the whole page with data-turbo-action="advance"
, maybe the refresh is caused by something specific to your app ?
And yes, I've seen issues with my solution when playing back and forth with the history, I'm glad I was able to drop it for a more native solution :)
Hi @Intrepidd, not sure why I get that behavior, what I have is a link outside the frame that is visiting the frame, like:
<a data-turbo-frame="conversation" href="...">link</a>
<turbo_frame_tag "conversation" data-turbo-action="advance" src="...">...</>
Could happen that the browser refresh is due because the link is outside the frame?
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Thanks for challenging the status quo, actually I just discovered
data-turbo-action
introduce in v 7.2.0 appears to do the trick : https://turbo.hotwired.dev/handbook/frames#promoting-a-frame-navigation-to-a-page-visit