Skip to content

Instantly share code, notes, and snippets.

@Intrepidd
Last active April 7, 2024 07:42
Show Gist options
  • Save Intrepidd/ac68cb7dfd17d422374807efb6bf2f42 to your computer and use it in GitHub Desktop.
Save Intrepidd/ac68cb7dfd17d422374807efb6bf2f42 to your computer and use it in GitHub Desktop.
// 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)
}
}
})
}
}
@michelson
Copy link

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