From b28f20ca156839dfa4da1e46971b093e67352b9d Mon Sep 17 00:00:00 2001
From: Matthias Kestenholz <mk@feinheit.ch>
Date: Sat, 22 Oct 2022 14:00:27 +0200
Subject: [PATCH 1/2] Include panel scripts in content when RENDER_PANELS=True

---
 .../debug_toolbar/includes/panel_content.html |  1 +
 tests/test_integration.py                     | 25 +++++++++++++------
 2 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/debug_toolbar/templates/debug_toolbar/includes/panel_content.html b/debug_toolbar/templates/debug_toolbar/includes/panel_content.html
index 8c2e446b1..c41fde05e 100644
--- a/debug_toolbar/templates/debug_toolbar/includes/panel_content.html
+++ b/debug_toolbar/templates/debug_toolbar/includes/panel_content.html
@@ -8,6 +8,7 @@ <h3>{{ panel.title }}</h3>
     </div>
     <div class="djDebugPanelContent">
       {% if toolbar.should_render_panels %}
+        {% for script in panel.scripts %}<script src="{{ script }}"></script>{% endfor %}
         <div class="djdt-scroll">{{ panel.content }}</div>
       {% else %}
         <div class="djdt-loader"></div>
diff --git a/tests/test_integration.py b/tests/test_integration.py
index 3f650c45d..719eeb361 100644
--- a/tests/test_integration.py
+++ b/tests/test_integration.py
@@ -34,6 +34,15 @@
 rf = RequestFactory()
 
 
+def toolbar_store_id():
+    def get_response(request):
+        return HttpResponse()
+
+    toolbar = DebugToolbar(rf.get("/"), get_response)
+    toolbar.store()
+    return toolbar.store_id
+
+
 class BuggyPanel(Panel):
     def title(self):
         return "BuggyPanel"
@@ -213,13 +222,8 @@ def test_html5_validation(self):
             raise self.failureException(msg)
 
     def test_render_panel_checks_show_toolbar(self):
-        def get_response(request):
-            return HttpResponse()
-
-        toolbar = DebugToolbar(rf.get("/"), get_response)
-        toolbar.store()
         url = "/__debug__/render_panel/"
-        data = {"store_id": toolbar.store_id, "panel_id": "VersionsPanel"}
+        data = {"store_id": toolbar_store_id(), "panel_id": "VersionsPanel"}
 
         response = self.client.get(url, data)
         self.assertEqual(response.status_code, 200)
@@ -444,7 +448,7 @@ def test_view_returns_template_response(self):
         self.assertEqual(response.status_code, 200)
 
     @override_settings(DEBUG_TOOLBAR_CONFIG={"DISABLE_PANELS": set()})
-    def test_intcercept_redirects(self):
+    def test_intercept_redirects(self):
         response = self.client.get("/redirect/")
         self.assertEqual(response.status_code, 200)
         # Link to LOCATION header.
@@ -464,6 +468,13 @@ def test_server_timing_headers(self):
         for expected in expected_partials:
             self.assertTrue(re.compile(expected).search(server_timing))
 
+    @override_settings(DEBUG_TOOLBAR_CONFIG={"RENDER_PANELS": True})
+    def test_timer_panel(self):
+        response = self.client.get("/regular/basic/")
+        self.assertEqual(response.status_code, 200)
+        self.assertContains(response, "/debug_toolbar/js/timer.js")
+        # print(response.content.decode("utf-8"))
+
     def test_auth_login_view_without_redirect(self):
         response = self.client.get("/login_without_redirect/")
         self.assertEqual(response.status_code, 200)

From 0df2a6459f396cfd5c31a2a44d3cd00631758319 Mon Sep 17 00:00:00 2001
From: Tim Schilling <tim@aspiredu.com>
Date: Sat, 22 Oct 2022 17:44:51 -0500
Subject: [PATCH 2/2] Make the panel scripts async module scripts.

Without marking them as modules, they weren't being loaded in as expected.
---
 debug_toolbar/static/debug_toolbar/js/timer.js              | 1 -
 .../templates/debug_toolbar/includes/panel_content.html     | 2 +-
 tests/test_integration.py                                   | 6 ++++--
 3 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/debug_toolbar/static/debug_toolbar/js/timer.js b/debug_toolbar/static/debug_toolbar/js/timer.js
index 70d3fe5a2..bb777ee10 100644
--- a/debug_toolbar/static/debug_toolbar/js/timer.js
+++ b/debug_toolbar/static/debug_toolbar/js/timer.js
@@ -1,7 +1,6 @@
 import { $$ } from "./utils.js";
 
 function insertBrowserTiming() {
-    console.log(["inserted"]);
     const timingOffset = performance.timing.navigationStart,
         timingEnd = performance.timing.loadEventEnd,
         totalTime = timingEnd - timingOffset;
diff --git a/debug_toolbar/templates/debug_toolbar/includes/panel_content.html b/debug_toolbar/templates/debug_toolbar/includes/panel_content.html
index c41fde05e..585682c61 100644
--- a/debug_toolbar/templates/debug_toolbar/includes/panel_content.html
+++ b/debug_toolbar/templates/debug_toolbar/includes/panel_content.html
@@ -8,7 +8,7 @@ <h3>{{ panel.title }}</h3>
     </div>
     <div class="djDebugPanelContent">
       {% if toolbar.should_render_panels %}
-        {% for script in panel.scripts %}<script src="{{ script }}"></script>{% endfor %}
+        {% for script in panel.scripts %}<script type="module" src="{{ script }}" async></script>{% endfor %}
         <div class="djdt-scroll">{{ panel.content }}</div>
       {% else %}
         <div class="djdt-loader"></div>
diff --git a/tests/test_integration.py b/tests/test_integration.py
index 719eeb361..9f4065604 100644
--- a/tests/test_integration.py
+++ b/tests/test_integration.py
@@ -472,8 +472,10 @@ def test_server_timing_headers(self):
     def test_timer_panel(self):
         response = self.client.get("/regular/basic/")
         self.assertEqual(response.status_code, 200)
-        self.assertContains(response, "/debug_toolbar/js/timer.js")
-        # print(response.content.decode("utf-8"))
+        self.assertContains(
+            response,
+            '<script type="module" src="/static/debug_toolbar/js/timer.js" async>',
+        )
 
     def test_auth_login_view_without_redirect(self):
         response = self.client.get("/login_without_redirect/")