refactor(types): avoid using deprecated types in tests (#1126)

tests/basic.test.tsx

@@ -7,7 +7,7 @@ import {
 } from 'react'
 import { act, fireEvent, render, waitFor } from '@testing-library/react'
 import ReactDOM from 'react-dom'
-import create, { EqualityChecker, SetState, StateSelector } from 'zustand'
+import create, { StoreApi } from 'zustand'
 
 const consoleError = console.error
 afterEach(() => {
@@ -186,7 +186,7 @@ it('can batch updates', async () => {
 
 it('can update the selector', async () => {
   type State = { one: string; two: string }
-  type Props = { selector: StateSelector<State, string> }
+  type Props = { selector: (state: State) => string }
   const useStore = create<State>(() => ({
     one: 'one',
     two: 'two',
@@ -205,10 +205,10 @@ it('can update the selector', async () => {
 
 it('can update the equality checker', async () => {
   type State = { value: number }
-  type Props = { equalityFn: EqualityChecker<State> }
+  type Props = { equalityFn: (a: State, b: State) => boolean }
   const useStore = create<State>(() => ({ value: 0 }))
   const { setState } = useStore
-  const selector: StateSelector<State, State> = (s) => s
+  const selector = (s: State) => s
 
   let renderCount = 0
   function Component({ equalityFn }: Props) {
@@ -240,8 +240,8 @@ it('can update the equality checker', async () => {
 it('can call useStore with progressively more arguments', async () => {
   type State = { value: number }
   type Props = {
-    selector?: StateSelector<State, number>
-    equalityFn?: EqualityChecker<number>
+    selector?: (state: State) => number
+    equalityFn?: (a: number, b: number) => boolean
   }
 
   const useStore = create<State>(() => ({ value: 0 }))
@@ -288,7 +288,7 @@ it('can throw an error in selector', async () => {
   const initialState: State = { value: 'foo' }
   const useStore = create<State>(() => initialState)
   const { setState } = useStore
-  const selector: StateSelector<State, string | void> = (s) =>
+  const selector = (s: State) =>
     // @ts-expect-error This function is supposed to throw an error
     s.value.toUpperCase()
 
@@ -333,8 +333,8 @@ it('can throw an error in equality checker', async () => {
   const initialState: State = { value: 'foo' }
   const useStore = create(() => initialState)
   const { setState } = useStore
-  const selector: StateSelector<State, State> = (s) => s
-  const equalityFn: EqualityChecker<State> = (a, b) =>
+  const selector = (s: State) => s
+  const equalityFn = (a: State, b: State) =>
     // @ts-expect-error This function is supposed to throw an error
     a.value.trim() === b.value.trim()
 
@@ -391,8 +391,8 @@ it('can get the store', () => {
 it('can set the store', () => {
   type State = {
     value: number
-    setState1: SetState<State>
-    setState2: SetState<State>
+    setState1: StoreApi<State>['setState']
+    setState2: StoreApi<State>['setState']
   }
 
   const { setState, getState } = create<State>((set) => ({

tests/middlewareTypes.test.tsx

@@ -1,4 +1,4 @@
-import create, { State, StoreApi } from 'zustand'
+import create, { StoreApi } from 'zustand'
 import {
   combine,
   devtools,
@@ -63,7 +63,7 @@ describe('counter state spec (single middleware)', () => {
     }
     TestComponent
 
-    const _testSubtyping: StoreApi<State> = createVanilla(
+    const _testSubtyping: StoreApi<object> = createVanilla(
       immer(() => ({ count: 0 }))
     )
   })
@@ -91,7 +91,7 @@ describe('counter state spec (single middleware)', () => {
     }
     TestComponent
 
-    const _testSubtyping: StoreApi<State> = createVanilla(
+    const _testSubtyping: StoreApi<object> = createVanilla(
       redux((x) => x, { count: 0 })
     )
   })
@@ -119,7 +119,7 @@ describe('counter state spec (single middleware)', () => {
     }
     TestComponent
 
-    const _testSubtyping: StoreApi<State> = createVanilla(
+    const _testSubtyping: StoreApi<object> = createVanilla(
       devtools(() => ({ count: 0 }))
     )
   })
@@ -146,7 +146,7 @@ describe('counter state spec (single middleware)', () => {
     }
     TestComponent
 
-    const _testSubtyping: StoreApi<State> = createVanilla(
+    const _testSubtyping: StoreApi<object> = createVanilla(
       subscribeWithSelector(() => ({ count: 0 }))
     )
   })
@@ -168,7 +168,7 @@ describe('counter state spec (single middleware)', () => {
     }
     TestComponent
 
-    const _testSubtyping: StoreApi<State> = createVanilla(
+    const _testSubtyping: StoreApi<object> = createVanilla(
       combine({ count: 0 }, () => ({}))
     )
   })
@@ -195,7 +195,7 @@ describe('counter state spec (single middleware)', () => {
     }
     TestComponent
 
-    const _testSubtyping: StoreApi<State> = createVanilla(
+    const _testSubtyping: StoreApi<object> = createVanilla(
       persist(() => ({ count: 0 }))
     )
   })

tests/types.test.tsx

@@ -1,17 +1,4 @@
-import create, {
-  Destroy,
-  EqualityChecker,
-  GetState,
-  PartialState,
-  SetState,
-  State,
-  StateCreator,
-  StateListener,
-  StateSelector,
-  StoreApi,
-  Subscribe,
-  UseBoundStore,
-} from 'zustand'
+import create, { StateCreator, StoreApi, UseBoundStore } from 'zustand'
 
 it('can use exposed types', () => {
   type ExampleState = {
@@ -22,23 +9,25 @@ it('can use exposed types', () => {
     numSetState: (v: number) => void
   }
 
-  const listener: StateListener<ExampleState> = (state) => {
+  const listener = (state: ExampleState) => {
     if (state) {
       const value = state.num * state.numGet() * state.numGetState()
       state.numSet(value)
       state.numSetState(value)
     }
   }
-  const selector: StateSelector<ExampleState, number> = (state) => state.num
-  const partial: PartialState<ExampleState> = {
+  const selector = (state: ExampleState) => state.num
+  const partial: Partial<ExampleState> = {
     num: 2,
     numGet: () => 2,
   }
-  const partialFn: PartialState<ExampleState> = (state) => ({
+  const partialFn: (state: ExampleState) => Partial<ExampleState> = (
+    state
+  ) => ({
     ...state,
     num: 2,
   })
-  const equalityFn: EqualityChecker<ExampleState> = (state, newState) =>
+  const equalityFn = (state: ExampleState, newState: ExampleState) =>
     state !== newState
 
   const storeApi = create<ExampleState>((set, get) => ({
@@ -72,16 +61,18 @@ it('can use exposed types', () => {
   })
 
   function checkAllTypes(
-    _getState: GetState<ExampleState>,
-    _partialState: PartialState<ExampleState>,
-    _setState: SetState<ExampleState>,
-    _state: State,
-    _stateListener: StateListener<ExampleState>,
-    _stateSelector: StateSelector<ExampleState, number>,
+    _getState: StoreApi<ExampleState>['getState'],
+    _partialState:
+      | Partial<ExampleState>
+      | ((s: ExampleState) => Partial<ExampleState>),
+    _setState: StoreApi<ExampleState>['setState'],
+    _state: object,
+    _stateListener: (state: ExampleState, previousState: ExampleState) => void,
+    _stateSelector: (state: ExampleState) => number,
     _storeApi: StoreApi<ExampleState>,
-    _subscribe: Subscribe<ExampleState>,
-    _destroy: Destroy,
-    _equalityFn: EqualityChecker<ExampleState>,
+    _subscribe: StoreApi<ExampleState>['subscribe'],
+    _destroy: StoreApi<ExampleState>['destroy'],
+    _equalityFn: (a: ExampleState, b: ExampleState) => boolean,
     _stateCreator: StateCreator<ExampleState>,
     _useStore: UseBoundStore<StoreApi<ExampleState>>
   ) {
@@ -122,7 +113,10 @@ it('should have correct (partial) types for setState', () => {
     c: () => set({ count: 1 }),
   }))
 
-  const setState: AssertEqual<typeof store.setState, SetState<Count>> = true
+  const setState: AssertEqual<
+    typeof store.setState,
+    StoreApi<Count>['setState']
+  > = true
   expect(setState).toEqual(true)
 
   // ok, should not error
@@ -147,7 +141,10 @@ it('should allow for different partial keys to be returnable from setState', ()
     something: 'foo',
   }))
 
-  const setState: AssertEqual<typeof store.setState, SetState<State>> = true
+  const setState: AssertEqual<
+    typeof store.setState,
+    StoreApi<State>['setState']
+  > = true
   expect(setState).toEqual(true)
 
   // ok, should not error