Add getOriginalState and verify predicate test behavior

Author: markerikson

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

@@ -60,6 +60,7 @@ export interface ActionListenerMiddlewareAPI<
   D extends Dispatch<AnyAction>,
   O extends ActionListenerOptions
 > extends MiddlewareAPI<D, S> {
+  getOriginalState: () => S
   unsubscribe(): void
   currentPhase: MiddlewarePhase
   // TODO Figure out how to pass this through the other types correctly
@@ -246,12 +247,14 @@ export function createActionListenerMiddleware<
       return
     }
 
-    let stateBefore = api.getState()
     if (listenerMap.size === 0) {
       return next(action)
     }
 
     let result: unknown
+    const originalState = api.getState()
+    const getOriginalState = () => originalState
+
     for (const currentPhase of actualMiddlewarePhases) {
       let stateNow = api.getState()
       for (let entry of listenerMap.values()) {
@@ -265,6 +268,7 @@ export function createActionListenerMiddleware<
         try {
           entry.listener(action, {
             ...api,
+            getOriginalState,
             currentPhase,
             extra,
             unsubscribe: entry.unsubscribe,
@@ -302,20 +306,21 @@ export function createActionListenerMiddleware<
   // eslint-disable-next-line no-redeclare
   function addListener<
     MA extends AnyAction,
-    M extends MatchFunction<MA>,
+    M extends ListenerPredicate<MA>,
     O extends ActionListenerOptions
   >(
     matcher: M,
-    listener: ActionListener<GuardedType<M>, S, D, O>,
+    listener: ActionListener<AnyAction, S, D, O>,
     options?: O
-  ): Unsubscribe // eslint-disable-next-line no-redeclare
+  ): Unsubscribe
+  // eslint-disable-next-line no-redeclare
   function addListener<
     MA extends AnyAction,
-    M extends ListenerPredicate<MA>,
+    M extends MatchFunction<MA>,
     O extends ActionListenerOptions
   >(
     matcher: M,
-    listener: ActionListener<AnyAction, S, D, O>,
+    listener: ActionListener<GuardedType<M>, S, D, O>,
     options?: O
   ): Unsubscribe
   // eslint-disable-next-line no-redeclare

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

@@ -1,6 +1,7 @@
 import {
   configureStore,
   createAction,
+  createSlice,
   AnyAction,
   isAnyOf,
 } from '@reduxjs/toolkit'
@@ -14,6 +15,8 @@ import {
 
 const middlewareApi = {
   getState: expect.any(Function),
+  getOriginalState: expect.any(Function),
+  extra: undefined,
   dispatch: expect.any(Function),
   currentPhase: expect.stringMatching(/beforeReducer|afterReducer/),
   unsubscribe: expect.any(Function),
@@ -128,6 +131,43 @@ describe('createActionListenerMiddleware', () => {
     ])
   })
 
+  test('Can subscribe with an action predicate function', () => {
+    const slice = createSlice({
+      name: 'counter',
+      initialState: 0,
+      reducers: {
+        increment(state) {
+          return state + 1
+        },
+      },
+    })
+    const { increment } = slice.actions
+
+    store = configureStore({
+      reducer: slice.reducer,
+      middleware: [middleware] as const,
+    })
+
+    const listener = jest.fn((_: TestAction1) => {})
+
+    let listenerCalls = 0
+
+    middleware.addListener(
+      (action, state) => {
+        return state > 1
+      },
+      (action, listenerApi) => {
+        listenerCalls++
+      }
+    )
+
+    store.dispatch(increment())
+    store.dispatch(increment())
+    store.dispatch(increment())
+
+    expect(listenerCalls).toBe(2)
+  })
+
   test('subscribing with the same listener will not make it trigger twice (like EventTarget.addEventListener())', () => {
     const listener = jest.fn((_: TestAction1) => {})