add alternative api for extraReducers, move shared type tests to mapBuilders.typetest.ts

Author: phryneas

src/createSlice.test.ts

@@ -105,6 +105,57 @@ describe('createSlice', () => {
 
       expect(result).toBe(15)
     })
+
+    describe('alternative builder callback for extraReducers', () => {
+      const increment = createAction<number, 'increment'>('increment')
+
+      test('can be used with actionCreators', () => {
+        const slice = createSlice({
+          name: 'counter',
+          initialState: 0,
+          reducers: {},
+          extraReducers: builder =>
+            builder.addCase(
+              increment,
+              (state, action) => state + action.payload
+            )
+        })
+        expect(slice.reducer(0, increment(5))).toBe(5)
+      })
+
+      test('can be used with string action types', () => {
+        const slice = createSlice({
+          name: 'counter',
+          initialState: 0,
+          reducers: {},
+          extraReducers: builder =>
+            builder.addCase(
+              'increment',
+              (state, action: { type: 'increment'; payload: number }) =>
+                state + action.payload
+            )
+        })
+        expect(slice.reducer(0, increment(5))).toBe(5)
+      })
+
+      test('prevents the same action type from being specified twice', () => {
+        expect(() =>
+          createSlice({
+            name: 'counter',
+            initialState: 0,
+            reducers: {},
+            extraReducers: builder =>
+              builder
+                .addCase('increment', state => state + 1)
+                .addCase('increment', state => state + 1)
+          })
+        ).toThrowErrorMatchingInlineSnapshot(
+          `"addCase cannot be called with two reducers for the same action type"`
+        )
+      })
+
+      // for further tests, see the test of createReducer that goes way more into depth on this
+    })
   })
 
   describe('behaviour with enhanced case reducers', () => {

src/createSlice.ts

@@ -8,6 +8,10 @@ import {
   ActionCreatorWithPreparedPayload
 } from './createAction'
 import { createReducer, CaseReducers, CaseReducer } from './createReducer'
+import {
+  ActionReducerMapBuilder,
+  executeReducerBuilderCallback
+} from './mapBuilders'
 
 /**
  * An action creator atttached to a slice.
@@ -73,7 +77,9 @@ export interface CreateSliceOptions<
    * functions. These reducers should have existing action types used
    * as the keys, and action creators will _not_ be generated.
    */
-  extraReducers?: CaseReducers<NoInfer<State>, any>
+  extraReducers?:
+    | CaseReducers<NoInfer<State>, any>
+    | ((builder: ActionReducerMapBuilder<NoInfer<State>>) => void)
 }
 
 type PayloadActions<Types extends keyof any = string> = Record<
@@ -201,7 +207,13 @@ export function createSlice<
     throw new Error('`name` is a required option for createSlice')
   }
   const reducers = options.reducers || {}
-  const extraReducers = options.extraReducers || {}
+  const extraReducers =
+    typeof options.extraReducers === 'undefined'
+      ? {}
+      : typeof options.extraReducers === 'function'
+      ? executeReducerBuilderCallback(options.extraReducers)
+      : options.extraReducers
+
   const reducerNames = Object.keys(reducers)
 
   const sliceCaseReducersByName: Record<string, CaseReducer> = {}

type-tests/files/createReducer.typetest.ts

@@ -1,5 +1,5 @@
 import { Reducer } from 'redux'
-import { createReducer, createAction } from '../../src'
+import { createReducer, createAction, ActionReducerMapBuilder } from '../../src'
 
 function expectType<T>(p: T) {}
 
@@ -67,49 +67,10 @@ function expectType<T>(p: T) {}
 /** Test:  alternative builder callback for actionMap */
 {
   const increment = createAction<number, 'increment'>('increment')
-  const decrement = createAction<number, 'decrement'>('decrement')
-
-  const reducer = createReducer(0, builder => {
-    builder.addCase(increment, (state, action) => {
-      expectType<number>(state)
-      expectType<{ type: 'increment'; payload: number }>(action)
-      // typings:expect-error
-      expectType<string>(state)
-      // typings:expect-error
-      expectType<{ type: 'increment'; payload: string }>(action)
-      // typings:expect-error
-      expectType<{ type: 'decrement'; payload: number }>(action)
-    })
-
-    builder.addCase('increment', (state, action) => {
-      expectType<number>(state)
-      expectType<{ type: 'increment' }>(action)
-      // typings:expect-error
-      expectType<{ type: 'decrement' }>(action)
-      // typings:expect-error - this cannot be inferred and has to be manually specified
-      expectType<{ type: 'increment'; payload: number }>(action)
-    })
-
-    builder.addCase(
-      increment,
-      (state, action: ReturnType<typeof increment>) => state
-    )
-    // typings:expect-error
-    builder.addCase(
-      increment,
-      (state, action: ReturnType<typeof decrement>) => state
-    )
-
-    builder.addCase(
-      'increment',
-      (state, action: ReturnType<typeof increment>) => state
-    )
-    // typings:expect-error
-    builder.addCase(
-      'decrement',
-      (state, action: ReturnType<typeof increment>) => state
-    )
-  })
+
+  const reducer = createReducer(0, builder =>
+    expectType<ActionReducerMapBuilder<number>>(builder)
+  )
 
   expectType<number>(reducer(0, increment(5)))
   // typings:expect-error

type-tests/files/createSlice.typetest.ts

@@ -1,5 +1,10 @@
 import { AnyAction, Reducer, Action } from 'redux'
-import { createSlice, PayloadAction, createAction } from '../../src'
+import {
+  createSlice,
+  PayloadAction,
+  createAction,
+  ActionReducerMapBuilder
+} from '../../src'
 
 function expectType<T>(t: T) {
   return t
@@ -272,3 +277,15 @@ function expectType<T>(t: T) {
     expectType<string>(x.payload)
   }
 }
+
+/** Test:  alternative builder callback for extraReducers */
+{
+  createSlice({
+    name: 'test',
+    initialState: 0,
+    reducers: {},
+    extraReducers: builder => {
+      expectType<ActionReducerMapBuilder<number>>(builder)
+    }
+  })
+}

type-tests/files/mapBuilders.typetest.ts

@@ -0,0 +1,54 @@
+import { executeReducerBuilderCallback } from 'src/mapBuilders'
+import { createAction, CaseReducers } from 'src'
+
+function expectType<T>(t: T) {
+  return t
+}
+
+/** Test:  alternative builder callback for actionMap */
+{
+  const increment = createAction<number, 'increment'>('increment')
+  const decrement = createAction<number, 'decrement'>('decrement')
+
+  executeReducerBuilderCallback<number>(builder => {
+    builder.addCase(increment, (state, action) => {
+      expectType<number>(state)
+      expectType<{ type: 'increment'; payload: number }>(action)
+      // typings:expect-error
+      expectType<string>(state)
+      // typings:expect-error
+      expectType<{ type: 'increment'; payload: string }>(action)
+      // typings:expect-error
+      expectType<{ type: 'decrement'; payload: number }>(action)
+    })
+
+    builder.addCase('increment', (state, action) => {
+      expectType<number>(state)
+      expectType<{ type: 'increment' }>(action)
+      // typings:expect-error
+      expectType<{ type: 'decrement' }>(action)
+      // typings:expect-error - this cannot be inferred and has to be manually specified
+      expectType<{ type: 'increment'; payload: number }>(action)
+    })
+
+    builder.addCase(
+      increment,
+      (state, action: ReturnType<typeof increment>) => state
+    )
+    // typings:expect-error
+    builder.addCase(
+      increment,
+      (state, action: ReturnType<typeof decrement>) => state
+    )
+
+    builder.addCase(
+      'increment',
+      (state, action: ReturnType<typeof increment>) => state
+    )
+    // typings:expect-error
+    builder.addCase(
+      'decrement',
+      (state, action: ReturnType<typeof increment>) => state
+    )
+  })
+}