hotwired / turbo-rails

Use Turbo in your Ruby on Rails app
https://turbo.hotwired.dev
MIT License
2.13k stars 328 forks source link

Error with Turbo on link navigation, not on refresh #454

Open TCCDevelopment opened 1 year ago

TCCDevelopment commented 1 year ago

I get a console error when I click on a link within my webpage, but if I refresh that page, the error goes away. But comes back when I click on another link to go to a different page. Here is the error.

Uncaught TypeError: Cannot read properties of undefined (reading 'noConflict')
    at <anonymous>:1:671
    at ge.renderElement (turbo.es2017-esm.js:2653:27)
    at ge.assignNewBody (turbo.es2017-esm.js:2776:20)
    at turbo.es2017-esm.js:2707:24
    at z.preservingPermanentElements (turbo.es2017-esm.js:1249:15)
    at ge.preservingPermanentElements (turbo.es2017-esm.js:1323:21)
    at ge.replaceBody (turbo.es2017-esm.js:2705:20)
    at ge.render (turbo.es2017-esm.js:2679:24)
    at be.renderSnapshot (turbo.es2017-esm.js:1076:24)
    at be.render (turbo.es2017-esm.js:1045:28)

It seems that some of the third party JS was not reloaded (specifically Bootstrap's Popover), while other JS was (ie Bootstrap's modal and dropdowns).

What I did to fix

I wrapped the Popover initialization code in an Event Listener:

document.addEventListener("turbo:load", function() { 
      document.querySelectorAll('[data-bs-toggle="popover"]')
        .forEach(popover => {
             new bootstrap.Popover(popover)
        })
})

This allows the popovers to still work on navigating via links; even though I am still getting the console error listed above.

Any help you can give would be appreciated. Thank you. Happy Coding!

marcoroth commented 1 year ago

Hey @TCCDevelopment, this must be something specific to your application. Have you overwritten any function which would impact the render behavior of Turbo?

FWIW, the event listener is correct and is how you need to setup the bootstrap popovers. I guess that the error is not directly related to the Popovers itself.

TCCDevelopment commented 1 year ago

@marcoroth, I have double-checked and do not see anything in my repo history that would fit that suggestion. IE, I don't believe that I have overwritten any function. :-/

alexclapou commented 8 months ago

I get the same error. @TCCDevelopment did you manage to solve it?