From 13c2f9617ff67534edcd9070c31b7c164fafa98a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?L=C3=A1szl=C3=B3=20K=C3=A1rolyi?= <laszlo@karolyi.hu>
Date: Sun, 9 Mar 2025 22:53:27 +0100
Subject: [PATCH 1/2] Fix for uncatchable `AbortError`s

Patching `window.fetch` without handling the `AbortError` results in
JS code that uses fetch, becoming unable to catch these errors. As such,
application errors will be emitted to the console (and in the case of
webpack-dev-server, to the browser window), that are very mysterious.
Even if one has try/catch blocks within an async function, or then/catch
blocks for the Promise using `fetch()`, these errors will not be
catched.

I am not fully in the know as to why it works this way (the internals of
an async/Promise are very convoluted especially when `this` is involved
as in here), but I suspect the patched call will emit its own
`AbortError` extra to the one that comes from the original one, and the
uncatched one in the patched function will resurface even after catching
one of them.
---
 debug_toolbar/static/debug_toolbar/js/toolbar.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/debug_toolbar/static/debug_toolbar/js/toolbar.js b/debug_toolbar/static/debug_toolbar/js/toolbar.js
index 329bce669..59276b269 100644
--- a/debug_toolbar/static/debug_toolbar/js/toolbar.js
+++ b/debug_toolbar/static/debug_toolbar/js/toolbar.js
@@ -329,6 +329,9 @@ const djdt = {
                 // Don't resolve the response via .json(). Instead
                 // continue to return it to allow the caller to consume as needed.
                 return response;
+            }).catch((err) => {
+                if (err.name === 'AbortError') return
+                throw(e);
             });
             return promise;
         };

From a0e9bc7e1a90553c2a426762fe57a27cbf5363dc Mon Sep 17 00:00:00 2001
From: "pre-commit-ci[bot]"
 <66853113+pre-commit-ci[bot]@users.noreply.github.com>
Date: Sun, 9 Mar 2025 22:08:05 +0000
Subject: [PATCH 2/2] [pre-commit.ci] auto fixes from pre-commit.com hooks

for more information, see https://pre-commit.ci
---
 .../static/debug_toolbar/js/toolbar.js        | 26 +++++++++++--------
 1 file changed, 15 insertions(+), 11 deletions(-)

diff --git a/debug_toolbar/static/debug_toolbar/js/toolbar.js b/debug_toolbar/static/debug_toolbar/js/toolbar.js
index 59276b269..3bc3a4d9c 100644
--- a/debug_toolbar/static/debug_toolbar/js/toolbar.js
+++ b/debug_toolbar/static/debug_toolbar/js/toolbar.js
@@ -322,17 +322,21 @@ const djdt = {
         const origFetch = window.fetch;
         window.fetch = function (...args) {
             const promise = origFetch.apply(this, args);
-            promise.then((response) => {
-                if (response.headers.get("djdt-store-id") !== null) {
-                    handleAjaxResponse(response.headers.get("djdt-store-id"));
-                }
-                // Don't resolve the response via .json(). Instead
-                // continue to return it to allow the caller to consume as needed.
-                return response;
-            }).catch((err) => {
-                if (err.name === 'AbortError') return
-                throw(e);
-            });
+            promise
+                .then((response) => {
+                    if (response.headers.get("djdt-store-id") !== null) {
+                        handleAjaxResponse(
+                            response.headers.get("djdt-store-id")
+                        );
+                    }
+                    // Don't resolve the response via .json(). Instead
+                    // continue to return it to allow the caller to consume as needed.
+                    return response;
+                })
+                .catch((err) => {
+                    if (err.name === "AbortError") return;
+                    throw e;
+                });
             return promise;
         };
     },