Skip to content

Debug toolbar doesn't work with turbolinks after first page load #1179

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

Closed
gone opened this issue Jun 27, 2019 · 2 comments
Closed

Debug toolbar doesn't work with turbolinks after first page load #1179

gone opened this issue Jun 27, 2019 · 2 comments

Comments

@gone
Copy link
Contributor

gone commented Jun 27, 2019

Using turbolinks everything works as expected on the first page load.

After transitioning to another page, all css/js/html is correctly loaded and created, but the djdt.init function bound to the DOMContentLoaded event doesn't fire (https://github.com/jazzband/django-debug-toolbar/blob/master/debug_toolbar/static/debug_toolbar/js/toolbar.js#L329) so click handlers and setup aren't initialized

@dctalbot
Copy link

dctalbot commented May 7, 2020

Was dealing with flakiness for a while until I realized there's a nice INSERT_BEFORE config option. Final solution I landed on was this setting

def show_toolbar(request):
    return True
DEBUG_TOOLBAR_CONFIG = {
    "SHOW_TOOLBAR_CALLBACK" : show_toolbar,
    "INSERT_BEFORE": '</head>'
}

And this js snippet

// django debug toolbar
document.addEventListener("turbolinks:load", (event) => {
  if ("djdt" in window) {
    window.djdt.init();
  }
});

And some custom things to make sure these only run in dev. Hope this helps!

@gone
Copy link
Contributor Author

gone commented Dec 28, 2021

Just got this working with HTMX boosted links - similar snippet,

    <script>
      document.addEventListener("htmx:afterSettle", (event) => {
        if ("djdt" in window) {
          window.djdt.init();
        }
      });
    </script>

Just make sure to put it in the header

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants