Rails 6/Hotwire - how force "full page load" when link_to a certain page

I'm using a Rails 6 template (Jumpstart Pro) that has the new stuff hotwire, stimulus, webpacker. It works OK for basic stuff... scaffolding new models and make CRUD forms, etc.

However one of my pages uses a vendor's javascript widget, which also requires jquery.

Neither Jumpstart Pro template nor its Forum have any up-to-date documentation or support for adding jQuery via webpacker (e.g., no support for adding jquery the "right way").

So I've added jquery to the one page that needs it via a good old fashioned script tags in the header

%script{:src => "//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"}

followed by the vendor's javascript to initialize the vendor's widget, inside $(document).ready(function(){ init_code_goes_here }); so the widget has time to load to the page.

Works: If I type the page's url into the browser "localhost:5000/cool_page" or "mydev.ngrok/cool_page", it works fine.

Broken: But clicking a link IN the app to go to the page (via link_to "cool page", "/cool_page") does not work:

jQuery is loaded (I have a little "hello world" jquery script that un-hides a div to confirm jquery is loaded)
the vendor widget does not load properly (browser console says widget object is null)

But if I then refresh the page, everything loads fine.

So the page works if "loaded" but not it reached via another page.

From this I infer that the magic behind hotwire/etc is interfering with a proper load of the page when I navigate to it.

So, the question: in a hotwire-enabled Rails 6 app, is there any way to have a nav link that, when clicked, simply tells Rails... skip hotwire shortcuts, load this page for real?

Solution

I believe your issue is just that you need to restore default (non-Hotwire) link behavior. There are 3 ways to do that.

See this answer: https://stackoverflow.com/a/68657223/2648054

In short:

1: Set the data-turbo attribute to false.
2: Set the target attribute to "_top".
3: Move the link outside any Turbo frame. Any link inside a Turbo frame, without one of the above attributes, will be handled by Turbo by default.