Turbolinks: select2 & materializecss events doesn't work at all

[rebootcode]

I have tried following events -

1. turbolinks:load
2. turbolinks:visit

Yet, none of them work on "page specific javascript code" - I am using "Turbolinks 5.2.0"

Example - "partials/tag.blade.php"

document.addEventListener('turbolinks:visit', () => {
    jQuery('input#tag').characterCounter();
    jQuery('select').each(function() { jQuery(this).select2(); });
});

Every time, it says - ".characterCounter()" or "select2()" is not a function, but when I run with document load on refresh, it works fine.

It doesn't work on turbolinks.

"Link to turbolinks.js" is placed at last, i.e, after "materializecss", "select2" library js include.

Do i need to include those library again? on specific page?

[domchristie]

turbolinks:load is probably the event you're after, however, it looks like you're experiencing the issue described here: https://github.com/turbolinks/turbolinks/issues/369 (particularly if you're using something like barryvdh/laravel-debugbar)

It's difficult to say exactly what's going on without seeing how you're loading each script, but my guess is that one of your third-party scripts is clobbering jQuery during the rendering process and therefore your plugin functions will no longer exist in the jQuery namespace. https://youtu.be/fKOq5_2qj54?t=1069 describes this quite well. (Even though your set up may vary, the principles are the same.)

I hope that helps.