Remove abort event listner for AbortController

reduxjs · Dec 5, 2023 · 50ddabd · 50ddabd
1 parent 5eb3680
commit 50ddabd
Showing 1 changed file with 11 additions and 4 deletions.
diff --git a/packages/toolkit/src/createAsyncThunk.ts b/packages/toolkit/src/createAsyncThunk.ts
@@ -577,6 +577,7 @@ export const createAsyncThunk = /* @__PURE__ */ (() => {
           : nanoid()
 
         const abortController = new AbortController()
+        let abortHandler: (() => void) | undefined
         let abortReason: string | undefined
 
         function abort(reason?: string) {
@@ -600,14 +601,16 @@ export const createAsyncThunk = /* @__PURE__ */ (() => {
               }
             }
 
-            const abortedPromise = new Promise<never>((_, reject) =>
-              abortController.signal.addEventListener('abort', () =>
+            const abortedPromise = new Promise<never>((_, reject) => {
+              abortHandler = () => {
                 reject({
                   name: 'AbortError',
                   message: abortReason || 'Aborted',
                 })
-              )
-            )
+              }
+
+              abortController.signal.addEventListener('abort', abortHandler)
+            })
             dispatch(
               pending(
                 requestId,
@@ -653,6 +656,10 @@ export const createAsyncThunk = /* @__PURE__ */ (() => {
               err instanceof RejectWithValue
                 ? rejected(null, requestId, arg, err.payload, err.meta)
                 : rejected(err as any, requestId, arg)
+          } finally {
+            if (abortHandler) {
+              abortController.signal.removeEventListener('abort', abortHandler)
+            }
           }
           // We dispatch the result action _after_ the catch, to avoid having any errors
           // here get swallowed by the try/catch block,