Merge branch 'master' of https://github.com/reduxjs/redux-toolkit into feat/alm-change-remove-listener-signature

Author: FaberVitale

packages/action-listener-middleware/src/index.ts

@@ -12,6 +12,7 @@ import type {
   AddListenerOverloads,
   AnyActionListenerPredicate,
   CreateListenerMiddlewareOptions,
+  TypedActionCreator,
   TypedAddListener,
   TypedAddListenerAction,
   TypedCreateListenerEntry,
@@ -180,7 +181,7 @@ const getListenerEntryPropsFrom = (options: FallbackAddListenerOptions) => {
     )
   }
 
-  assertFunction(listener, 'options.listener');
+  assertFunction(listener, 'options.listener')
 
   return { predicate, type, listener }
 }
@@ -206,6 +207,20 @@ export const createListenerEntry: TypedCreateListenerEntry<unknown> = (
   return entry
 }
 
+const createClearListenerMiddleware = (
+  listenerMap: Map<string, ListenerEntry>
+) => {
+  return () => {
+    listenerMap.forEach((entry) => {
+      entry.pending.forEach((controller) => {
+        controller.abort()
+      })
+    })
+
+    listenerMap.clear()
+  }
+}
+
 /**
  * Safely reports errors to the `errorHandler` provided.
  * Errors that occur inside `errorHandler` are notified in a new task.
@@ -236,6 +251,11 @@ export const addListenerAction = createAction(
   `${alm}/add`
 ) as TypedAddListenerAction<unknown>
 
+/**
+ * @alpha
+ */
+export const clearListenerMiddlewareAction = createAction(`${alm}/clear`)
+
 /**
  * @alpha
  */
@@ -361,6 +381,8 @@ export function createActionListenerMiddleware<
     }
   }
 
+  const clearListenerMiddleware = createClearListenerMiddleware(listenerMap)
+
   const middleware: Middleware<
     {
       (action: Action<`${typeof alm}/add`>): Unsubscribe
@@ -371,6 +393,12 @@ export function createActionListenerMiddleware<
     if (addListenerAction.match(action)) {
       return addListener(action.payload)
     }
+
+    if (clearListenerMiddlewareAction.match(action)) {
+      clearListenerMiddleware()
+      return
+    }
+
     if (removeListenerAction.match(action)) {
       return removeListener(action.payload)
     }
@@ -432,7 +460,9 @@ export function createActionListenerMiddleware<
       addListener: addListener as TypedAddListener<S, D>,
       removeListener: removeListener as TypedRemoveListener<S, D>,
       addListenerAction: addListenerAction as TypedAddListenerAction<S>,
-      removeListenerAction: removeListenerAction as TypedRemoveListenerAction<S>,
+      removeListenerAction:
+        removeListenerAction as TypedRemoveListenerAction<S>,
+      clear: clearListenerMiddleware,
     },
     {} as WithMiddlewareType<typeof middleware>
   )

packages/action-listener-middleware/src/tests/listenerMiddleware.test.ts

@@ -14,6 +14,7 @@ import {
   addListenerAction,
   removeListenerAction,
   TaskAbortError,
+  clearListenerMiddlewareAction,
 } from '../index'
 
 import type {
@@ -23,10 +24,7 @@ import type {
   Unsubscribe,
   ActionListenerMiddleware,
 } from '../index'
-import type {
-  ActionListener,
-  AddListenerOverloads,
-} from '../types'
+import type { ActionListener, AddListenerOverloads } from '../types'
 
 const middlewareApi = {
   getState: expect.any(Function),
@@ -428,7 +426,11 @@ describe('createActionListenerMiddleware', () => {
     const addListenerOptions: [
       string,
       Omit<
-        AddListenerOverloads<() => void, typeof store.getState, typeof store.dispatch>,
+        AddListenerOverloads<
+          () => void,
+          typeof store.getState,
+          typeof store.dispatch
+        >,
         'listener'
       >
     ][] = [
@@ -540,6 +542,109 @@ describe('createActionListenerMiddleware', () => {
     })
   })
 
+  describe('clear listeners', () => {
+    test('dispatch(clearListenerAction()) cancels running listeners and removes all subscriptions', async () => {
+      const listener1Test = deferred()
+      let listener1Calls = 0
+      let listener2Calls = 0
+      let listener3Calls = 0
+
+      middleware.addListener({
+        actionCreator: testAction1,
+        async listener(_, listenerApi) {
+          listener1Calls++
+          listenerApi.signal.addEventListener(
+            'abort',
+            () => listener1Test.resolve(listener1Calls),
+            { once: true }
+          )
+          await listenerApi.condition(() => true)
+          listener1Test.reject(new Error('unreachable: listener1Test'))
+        },
+      })
+
+      middleware.addListener({
+        actionCreator: clearListenerMiddlewareAction,
+        listener() {
+          listener2Calls++
+        },
+      })
+
+      middleware.addListener({
+        predicate: () => true,
+        listener() {
+          listener3Calls++
+        },
+      })
+
+      store.dispatch(testAction1('a'))
+      store.dispatch(clearListenerMiddlewareAction())
+      store.dispatch(testAction1('b'))
+      expect(await listener1Test).toBe(1)
+      expect(listener1Calls).toBe(1)
+      expect(listener3Calls).toBe(1)
+      expect(listener2Calls).toBe(0)
+    })
+
+    test('clear() cancels running listeners and removes all subscriptions', async () => {
+      const listener1Test = deferred()
+
+      let listener1Calls = 0
+      let listener2Calls = 0
+
+      middleware.addListener({
+        actionCreator: testAction1,
+        async listener(_, listenerApi) {
+          listener1Calls++
+          listenerApi.signal.addEventListener(
+            'abort',
+            () => listener1Test.resolve(listener1Calls),
+            { once: true }
+          )
+          await listenerApi.condition(() => true)
+          listener1Test.reject(new Error('unreachable: listener1Test'))
+        },
+      })
+
+      middleware.addListener({
+        actionCreator: testAction2,
+        listener() {
+          listener2Calls++
+        },
+      })
+
+      store.dispatch(testAction1('a'))
+
+      middleware.clear()
+      store.dispatch(testAction1('b'))
+      store.dispatch(testAction2('c'))
+
+      expect(listener2Calls).toBe(0)
+      expect(await listener1Test).toBe(1)
+    })
+
+    test('clear() cancels all running forked tasks', async () => {
+      const fork1Test = deferred()
+
+      middleware.addListener({
+        actionCreator: testAction1,
+        async listener(_, { fork }) {
+          const taskResult = await fork(() => {
+            return 3
+          }).result
+          fork1Test.resolve(taskResult)
+        },
+      })
+
+      store.dispatch(testAction1('a'))
+
+      middleware.clear()
+      store.dispatch(testAction1('b'))
+
+      expect(await fork1Test).toHaveProperty('status', 'cancelled')
+    })
+  })
+
   describe('Listener API', () => {
     test('Passes both getState and getOriginalState in the API', () => {
       const store = configureStore({

packages/action-listener-middleware/src/types.ts

@@ -219,6 +219,10 @@ export type ActionListenerMiddleware<
   removeListener: RemoveListenerOverloads<S, D>
   addListenerAction: TypedAddListenerAction<S, D>
   removeListenerAction: TypedRemoveListenerAction<S, D>
+  /**
+   * Unsubscribes all listeners, cancels running listeners and tasks.
+   */
+  clear: () => void
 }
 
 /**