diff --git a/src/react.ts b/src/react.ts index b2ee396374..3e0dc16b01 100644 --- a/src/react.ts +++ b/src/react.ts @@ -25,15 +25,13 @@ const useMemoSelector = ( selector: (state: TState) => StateSlice, ) => useMemo(() => { - let lastSlice: StateSlice - let lastState: TState + let prev: readonly [TState, StateSlice] | undefined return () => { const state = getState() - if (!Object.is(lastState, state)) { - lastSlice = selector(state) - lastState = state + if (!prev || !Object.is(prev[0], state)) { + prev = [state, selector(state)] } - return lastSlice + return prev[1] } }, [getState, selector]) diff --git a/src/react/shallow.ts b/src/react/shallow.ts index 98e62daeec..585b99b881 100644 --- a/src/react/shallow.ts +++ b/src/react/shallow.ts @@ -1,4 +1,4 @@ -// import { useDebugValue } from 'react' +// import { useRef } from 'react' // That doesnt work in ESM, because React libs are CJS only. // The following is a workaround until ESM is supported. // eslint-disable-next-line import/extensions diff --git a/tests/basic.test.tsx b/tests/basic.test.tsx index 90fc0510cb..0bfca4d6da 100644 --- a/tests/basic.test.tsx +++ b/tests/basic.test.tsx @@ -680,3 +680,20 @@ it('works with non-object state', async () => { fireEvent.click(getByText('button')) await findByText('count: 2') }) + +it('works with "undefined" state', async () => { + const useUndefined = create(() => undefined) + + const Component = () => { + const str = useUndefined((v) => v || 'undefined') + return
str: {str}
+ } + + const { findByText } = render( + + + , + ) + + await findByText('str: undefined') +})