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.

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

Custom rendering issue when clicking browser back button #1238

Open
adampfw opened this issue Apr 3, 2024 · 0 comments
Open

Custom rendering issue when clicking browser back button #1238

adampfw opened this issue Apr 3, 2024 · 0 comments

Comments

@adampfw
Copy link

adampfw commented Apr 3, 2024

I understant that morphing is only available on whole page refresh. There are cases when it would be super useful to have morphing capabilities when URL changes, on Turbo navigation.

I tried:

Turbo.PageRenderer.prototype.assignNewBody = function () {
  if (document.body) {
    Idiomorph.morph(document.body, this.newElement)
  }
}
document.addEventListener('turbo:before-render', (e) => {
  e.preventDefault()
  Idiomorph.morph(document.body, e.detail.newBody)
})

and it works with only one bug - when I click browsers back button nothing changes. Looks like issue with cache? Is there any change to introduce morphing on navigation?

I also tried https://turbo.hotwired.dev/handbook/drive#custom-rendering

document.addEventListener('turbo:before-render', (e) => {
  e.detail.render = (currentElement, newElement) => {
    Idiomorph.morph(currentElement, newElement)
  }
})

but there is still issue with back button click.

Im using <meta name="turbo-cache-control" content="no-preview">.

@adampfw adampfw changed the title Morph on turbo navigation Custom rendering issue when clicking browser back button Apr 3, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

No branches or pull requests

1 participant