From 074c7fbb74b0f3980564ac58aa0ffe9a631ae98b Mon Sep 17 00:00:00 2001
From: Teal Bauer <teal@starsong.eu>
Date: Sat, 24 May 2025 16:44:42 +0200
Subject: [PATCH] fix: Ensure JS event listeners use turbo:load
Replaces DOMContentLoaded with turbo:load in several views
to ensure JavaScript behaviors (like toggles, modals, and tabs)
are correctly initialized after Turbo Drive navigations.
This addresses issues where UI elements would not function
correctly after a Turbo navigation until a full page reload.
Affected files:
- app/views/devise/registrations/edit.html.erb
- app/views/admin/conferences/import_history.html.erb
- app/views/shared/_admin_nav.html.erb
- app/views/layouts/application.html.erb
- app/views/admin/conferences/import_progress.html.erb
- app/views/assignments/by_user.html.erb
Cleaned up redundant listeners in application.html.erb and
_admin_nav.html.erb.
---
app/views/admin/conferences/import_history.html.erb | 2 +-
app/views/admin/conferences/import_progress.html.erb | 2 +-
app/views/assignments/by_user.html.erb | 2 +-
app/views/devise/registrations/edit.html.erb | 2 +-
app/views/layouts/application.html.erb | 10 ----------
app/views/shared/_admin_nav.html.erb | 6 +-----
6 files changed, 5 insertions(+), 19 deletions(-)
diff --git a/app/views/admin/conferences/import_history.html.erb b/app/views/admin/conferences/import_history.html.erb
index e5e4583..1bb6df7 100644
--- a/app/views/admin/conferences/import_history.html.erb
+++ b/app/views/admin/conferences/import_history.html.erb
@@ -116,7 +116,7 @@
</template>
<script>
- document.addEventListener('DOMContentLoaded', function() {
+ document.addEventListener('turbo:load', function() {
document.querySelectorAll('[data-action="view-error"]').forEach(function(button) {
button.addEventListener('click', function() {
const errorContent = this.getAttribute('data-error');
diff --git a/app/views/admin/conferences/import_progress.html.erb b/app/views/admin/conferences/import_progress.html.erb
index 7b9a9dd..6bb25b5 100644
--- a/app/views/admin/conferences/import_progress.html.erb
+++ b/app/views/admin/conferences/import_progress.html.erb
@@ -62,6 +62,6 @@
});
}
- document.addEventListener('DOMContentLoaded', checkImportStatus);
+ document.addEventListener('turbo:load', checkImportStatus);
</script>
</div>
diff --git a/app/views/assignments/by_user.html.erb b/app/views/assignments/by_user.html.erb
index e030d9c..cec5c10 100644
--- a/app/views/assignments/by_user.html.erb
+++ b/app/views/assignments/by_user.html.erb
@@ -94,7 +94,7 @@
</div>
<script>
- document.addEventListener('DOMContentLoaded', function() {
+ document.addEventListener('turbo:load', function() {
const tabButtons = document.querySelectorAll('[data-tabs-target]');
const tabContents = document.querySelectorAll('[role="tabpanel"]');
diff --git a/app/views/devise/registrations/edit.html.erb b/app/views/devise/registrations/edit.html.erb
index 39a1104..62ca439 100644
--- a/app/views/devise/registrations/edit.html.erb
+++ b/app/views/devise/registrations/edit.html.erb
@@ -110,7 +110,7 @@
<script>
// Toggle password fields
- document.addEventListener('DOMContentLoaded', function() {
+ document.addEventListener('turbo:load', function() {
const togglePasswordBtn = document.getElementById('togglePasswordFields');
const passwordFields = document.getElementById('passwordFields');
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 44c4b95..5597e8d 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -245,21 +245,11 @@
// Set user signed in state for JS
window.userSignedIn = <%= user_signed_in? %>;
- // Initialize on DOMContentLoaded
- document.addEventListener('DOMContentLoaded', () => {
- initializeThemeToggle();
- initializeNavMenus();
- });
-
// Re-initialize on Turbo navigation
document.addEventListener('turbo:load', () => {
initializeThemeToggle();
initializeNavMenus();
});
- document.addEventListener('turbo:render', () => {
- initializeThemeToggle();
- initializeNavMenus();
- });
</script>
<main>
diff --git a/app/views/shared/_admin_nav.html.erb b/app/views/shared/_admin_nav.html.erb
index cc78a3e..626682e 100644
--- a/app/views/shared/_admin_nav.html.erb
+++ b/app/views/shared/_admin_nav.html.erb
@@ -84,11 +84,7 @@
}
}
- // Initialize on DOMContentLoaded
- document.addEventListener('DOMContentLoaded', initializeAdminNavMenu);
-
- // Re-initialize on Turbo navigation
+ // Initialize on Turbo page load
document.addEventListener('turbo:load', initializeAdminNavMenu);
- document.addEventListener('turbo:render', initializeAdminNavMenu);
</script>
</header>
--
GitLab