Reuse latest selected state on selector re-run (#1654) (#1660)

Co-authored-by: nightpool <nightpool@users.noreply.github.com>
Co-authored-by: Tim Dorr <timdorr@users.noreply.github.com>

Author: 3 people

src/hooks/useSelector.js

@@ -33,7 +33,16 @@ function useSelectorWithStoreAndSubscription(
       storeState !== latestStoreState.current ||
       latestSubscriptionCallbackError.current
     ) {
-      selectedState = selector(storeState)
+      const newSelectedState = selector(storeState)
+      // ensure latest selected state is reused so that a custom equality function can result in identical references
+      if (
+        latestSelectedState.current === undefined ||
+        !equalityFn(newSelectedState, latestSelectedState.current)
+      ) {
+        selectedState = newSelectedState
+      } else {
+        selectedState = latestSelectedState.current
+      }
     } else {
       selectedState = latestSelectedState.current
     }

test/hooks/useSelector.spec.js

@@ -412,6 +412,35 @@ describe('React', () => {
 
           spy.mockRestore()
         })
+
+        it('reuse latest selected state on selector re-run', () => {
+          store = createStore(({ count } = { count: -1 }) => ({
+            count: count + 1,
+          }))
+
+          const alwaysEqual = () => true
+
+          const Comp = () => {
+            // triggers render on store change
+            useSelector((s) => s.count)
+            const array = useSelector(() => [1, 2, 3], alwaysEqual)
+            renderedItems.push(array)
+            return <div />
+          }
+
+          rtl.render(
+            <ProviderMock store={store}>
+              <Comp />
+            </ProviderMock>
+          )
+
+          expect(renderedItems.length).toBe(1)
+
+          store.dispatch({ type: '' })
+
+          expect(renderedItems.length).toBe(2)
+          expect(renderedItems[0]).toBe(renderedItems[1])
+        })
       })
 
       describe('error handling for invalid arguments', () => {