reselect-kit 1.0.1 → 1.1.1

package/src/__tests__/createChainSelector.bench.ts

@@ -0,0 +1,117 @@
+import { bench, describe } from 'vitest';
+import { createSelector } from '@veksa/reselect';
+import { createCachedSelector } from '@veksa/re-reselect';
+import { createChainSelector } from '../createChainSelector';
+import { createBoundSelector } from '../createBoundSelector';
+import { createPropSelector } from '../createPropSelector';
+
+type Position = { id: number; symbol: string; qty: number; price: number };
+
+type State = {
+  positions: Record<number, Position>;
+  rates: Record<string, number>;
+};
+
+const POSITIONS = 50;
+const LEVELS = 10;
+
+const symbols = ['EUR', 'GBP', 'JPY', 'CHF', 'AUD'];
+
+const state: State = {
+  positions: Object.fromEntries(
+    Array.from({ length: POSITIONS }, (_, index) => [
+      index,
+      {
+        id: index,
+        symbol: symbols[index % symbols.length],
+        qty: index + 1,
+        price: index * 1.5,
+      },
+    ]),
+  ),
+  rates: Object.fromEntries(symbols.map((symbol, index) => [symbol, 1 + index / 10])),
+};
+
+const ids = Array.from({ length: POSITIONS }, (_, index) => index);
+
+// The base as a plain selector: nothing in the graph is keyed, so every level's
+// key is the default one.
+const positionSelector = (state: State, props: { id: number }) => state.positions[props.id];
+
+// The base as a cached selector: every level's key is the position id.
+const cachedPositionSelector = createCachedSelector(
+  [(state: State) => state.positions, createPropSelector<{ id: number }>().id()],
+  (positions, id) => positions[id],
+)({
+  keySelector: createPropSelector<{ id: number }>().id(),
+});
+
+const rateSelector = createCachedSelector(
+  [(state: State) => state.rates, (_state: State, props: { symbol: string }) => props.symbol],
+  (rates, symbol) => rates[symbol],
+)({
+  keySelector: (_state: State, props: { symbol: string }) => props.symbol,
+});
+
+// `map` only transforms a value, so no level of the chain introduces a key.
+const withMapLevels = (base: unknown) => {
+  let chain: any = createChainSelector(base as never);
+
+  for (let level = 0; level < LEVELS; level++) {
+    chain = chain.map((value: any) => ({ value, level }));
+  }
+
+  return chain.build();
+};
+
+type Carrier = { position: Position; total: number };
+
+// The join shape: half the levels pull in another keyed selector, the value
+// carried through the chain keeps the same shape at every level.
+const withJoinLevels = (base: unknown) => {
+  let chain: any = createChainSelector(base as never).map(
+    (position: unknown): Carrier => ({ position: position as Position, total: 0 }),
+  );
+
+  for (let level = 0; level < LEVELS; level++) {
+    chain =
+      level % 2 === 0
+        ? chain.chain((carrier: Carrier) => {
+            const bound = createBoundSelector(rateSelector, { symbol: carrier.position.symbol });
+
+            return createSelector([bound], (rate: number) => ({
+              ...carrier,
+              total: carrier.total + rate,
+            }));
+          })
+        : chain.map((carrier: Carrier) => ({ ...carrier, total: carrier.total + level }));
+  }
+
+  return chain.build();
+};
+
+const mapOverPlain = withMapLevels(positionSelector);
+const mapOverCached = withMapLevels(cachedPositionSelector);
+const joinOverCached = withJoinLevels(cachedPositionSelector);
+
+const readAll = (selector: any) => {
+  for (let index = 0; index < POSITIONS; index++) {
+    selector(state, { id: ids[index] });
+  }
+};
+
+// Steady state: every position is read again and again, so every level should be
+// a cache hit. What is left is the per-level bookkeeping.
+describe(`${POSITIONS} positions x ${LEVELS} levels`, () => {
+  bench('map levels, plain base', () => {
+    readAll(mapOverPlain);
+  });
+
+  bench('map levels, cached base', () => {
+    readAll(mapOverCached);
+  });
+
+  bench('join levels, cached base', () => {
+    readAll(joinOverCached);
+  });
+});

package/src/__tests__/createChainSelector.test.ts

@@ -1,14 +1,17 @@
-import { createSelector, setGlobalDevModeChecks } from '@veksa/reselect';
+import { createSelector, createSelectorCreator, setGlobalDevModeChecks } from '@veksa/reselect';
 import { createCachedSelector } from '@veksa/re-reselect';
-import { createChainSelector } from '../createChainSelector';
+import { createChainSelector, CreateSelectorOptions } from '../createChainSelector';
 import { createBoundSelector } from '../createBoundSelector';
 import { commonState, MessageStateSegment, PersonStateSegment, State } from '../__data__/state';
 import { createPathSelector } from '../createPathSelector';
 import { createPropSelector } from '../createPropSelector';
 import { createKeySelectorCreator } from '../keys/createKeySelectorCreator';
 import { stringComposeKeySelectors } from '../keys/stringComposeKeySelectors';
+import { arrayComposeKeySelectors } from '../keys/arrayComposeKeySelectors';
 import { createSequenceSelector } from '../createSequenceSelector';
-import { NamedParametricSelector, NamedSelector } from '../types';
+import { CachedSelector, NamedSelector } from '../types';
+import { isCachedSelector } from '../_helpers/isCachedSelector';
+import { defaultKeySelector } from '../keys/defaultKeySelector';
 
 vi.mock('../debug/debug', async (importOriginal) => ({
   ...(await importOriginal<object>()),
@@ -307,6 +310,146 @@ describe('createChainSelector', () => {
     expect(secondSelector.recomputations()).toBe(2);
   });
 
+  test('should keep per key memoization for map levels over a cached selector', () => {
+    const mapFn = vi.fn((person?: { firstName?: string }) => person?.firstName ?? '');
+
+    const firstNameSelector = createChainSelector(personSelector).map(mapFn).build();
+
+    firstNameSelector(commonState, { id: 1 });
+    firstNameSelector(commonState, { id: 2 });
+    firstNameSelector(commonState, { id: 1 });
+    firstNameSelector(commonState, { id: 2 });
+
+    expect(mapFn).toHaveBeenCalledTimes(2);
+  });
+
+  test('should propagate the key selector of the base through map levels', () => {
+    const mappedSelector = createChainSelector(personSelector)
+      .map((person) => person?.firstName)
+      .map((firstName) => firstName ?? '')
+      .build();
+
+    // A `map` level never derives a cached selector, so its key is the base's own
+    // and is handed over as is instead of being recomposed per level.
+    expect((mappedSelector as unknown as CachedSelector).keySelector).toBe(
+      personSelector.keySelector,
+    );
+  });
+
+  test('should build a keyless level with the configured selector creator', () => {
+    const selectorCreator = vi.fn(createSelector);
+
+    const createSelectorOptions = () =>
+      ({ selectorCreator }) as unknown as CreateSelectorOptions<typeof createSelectorCreator>;
+
+    const personIdSelector = createChainSelector(messageSelector)
+      .map((message) => message.personId, { createSelectorOptions })
+      .build();
+
+    expect(personIdSelector(commonState, { id: 100 })).toBe(1);
+    expect(selectorCreator).toHaveBeenCalled();
+  });
+
+  test('should build a keyed level with the configured cache object', () => {
+    const cacheObject = {
+      set: vi.fn(),
+      get: vi.fn(),
+      remove: vi.fn(),
+      clear: vi.fn(),
+    };
+
+    const createSelectorOptions = () =>
+      ({ cacheObject }) as unknown as CreateSelectorOptions<typeof createSelectorCreator>;
+
+    const firstNameSelector = createChainSelector(personSelector)
+      .map((person) => person?.firstName, { createSelectorOptions })
+      .build();
+
+    firstNameSelector(commonState, { id: 1 });
+
+    // The base is keyed, so the level keeps its cache — and it is the configured
+    // one that receives the entry.
+    expect(cacheObject.set).toHaveBeenCalled();
+  });
+
+  test('should keep the hit rate of a chain level over an uncached selector', () => {
+    const chainMock = vi.fn((message: { personId: number }) => {
+      return createBoundSelector(personSelector, { id: message.personId });
+    });
+
+    // The base is a plain selector, so this level carries no key and is built as
+    // a plain memoized selector. Alternating between two results must still hit.
+    const personByMessageIdSelector = createChainSelector(messageSelector).chain(chainMock).build();
+
+    personByMessageIdSelector(commonState, { id: 100 });
+    personByMessageIdSelector(commonState, { id: 200 });
+    personByMessageIdSelector(commonState, { id: 100 });
+    personByMessageIdSelector(commonState, { id: 200 });
+
+    expect(chainMock).toHaveBeenCalledTimes(2);
+    expect(personByMessageIdSelector(commonState, { id: 100 }).firstName).toBe('Marry');
+    expect(personByMessageIdSelector(commonState, { id: 200 }).firstName).toBe('Harry');
+    expect(chainMock).toHaveBeenCalledTimes(2);
+  });
+
+  test('should compose the key of a map level with the chain composer', () => {
+    const firstKeySelector = createPropSelector<{ first: string }>().first();
+    const secondKeySelector = createPropSelector<{ second: string }>().second();
+
+    const arrayKeyedSelector = createCachedSelector(
+      [firstKeySelector, secondKeySelector],
+      (first, second) => `${first}${second}`,
+    )({
+      keySelector: arrayComposeKeySelectors(firstKeySelector, secondKeySelector),
+    });
+
+    const mappedSelector = createChainSelector(arrayKeyedSelector)
+      .map((value) => value.length)
+      .build();
+
+    const keySelector = (mappedSelector as unknown as CachedSelector).keySelector;
+
+    // The base composes an array key, but the level is cached with whatever the
+    // chain's own composer produces — a flat cache object cannot take an array.
+    expect(keySelector(expect.anything(), { first: 'a', second: 'b' })).toBe('a:b');
+  });
+
+  test('should not build a keyed cache when the key cannot vary', () => {
+    const mapFn = vi.fn((message: { personId: number }) => message.personId);
+
+    const personIdSelector = createChainSelector(messageSelector).map(mapFn).map(String).build();
+
+    expect(isCachedSelector(personIdSelector)).toBe(false);
+
+    // Dropping the cache changes nothing about memoization: a constant key means
+    // a single cache entry, which is what a plain memoized selector already is.
+    personIdSelector(commonState, { id: 100 });
+    personIdSelector(commonState, { id: 100 });
+    personIdSelector(commonState, { id: 100 });
+
+    expect(mapFn).toHaveBeenCalledTimes(1);
+  });
+
+  test('should keep the key selector of a chain level whose derived selector may be cached', () => {
+    // A `chain` level cannot know at build time what it will derive, so unlike a
+    // `map` level it carries a key selector even over an uncached base. The key
+    // it resolves to is the default one, which is what makes the level itself
+    // skip the cache while still letting a level above compose from it.
+    const personSelectorByMessage: any = createChainSelector(messageSelector)
+      .chain((message) => (state: State) => state.persons.data[message.personId])
+      .build();
+
+    expect('keySelector' in personSelectorByMessage).toBe(true);
+    expect('cache' in personSelectorByMessage).toBe(false);
+    expect(personSelectorByMessage.keySelector(commonState, { id: 100 })).toBe(
+      defaultKeySelector(),
+    );
+
+    // Reading it still memoizes per key, which is what the cache would have done.
+    expect(personSelectorByMessage(commonState, { id: 100 }).firstName).toBe('Marry');
+    expect(personSelectorByMessage(commonState, { id: 200 }).firstName).toBe('Harry');
+  });
+
   test('should implement aggregation for collection by single item selector', () => {
     const personsSelector = (state: State) => state.persons;
 
@@ -336,9 +479,8 @@ describe('createChainSelector', () => {
       },
     );
 
-    (
-      fullNameNamedSelector as NamedParametricSelector<unknown, unknown, unknown, unknown>
-    ).selectorName = 'fullNameNamedSelector';
+    (fullNameNamedSelector as NamedSelector<unknown, unknown, [unknown], unknown>).selectorName =
+      'fullNameNamedSelector';
 
     const personByMessageIdSelector: any = createChainSelector(messageSelector)
       .chain((message) => {
@@ -368,6 +510,20 @@ describe('createChainSelector', () => {
     );
   });
 
+  test('should let an assigned selector name win over the generated one', () => {
+    const personIdSelector: any = createChainSelector(messageSelector)
+      .map((message) => message.personId)
+      .build();
+
+    expect(personIdSelector.selectorName).toContain('messageSelector');
+
+    // The generated name is exposed through a getter, and the matching setter is
+    // what lets a caller pin a readable name on a built chain.
+    personIdSelector.selectorName = 'personIdSelector';
+
+    expect(personIdSelector.selectorName).toBe('personIdSelector');
+  });
+
   test('should build selector with chainHierarchy property for unit test', () => {
     type FirstState = { firstValue: string };
 

package/src/__tests__/createPathSelector.test.ts

@@ -52,6 +52,20 @@ describe('createPathSelector', () => {
     expect(nameSelector({})).toBe('default');
   });
 
+  test('should forward every argument the base selector declares', () => {
+    const baseSelector = (state: State, props: { id: number }, offset: number) => ({
+      messageId: (state.documents[props.id]?.messageId ?? 0) + offset,
+    });
+
+    const messageIdSelector = createPathSelector(baseSelector).messageId();
+
+    // One and two arguments are dispatched directly; anything else goes through
+    // the generic path, which has to pass the whole argument list on.
+    expect(messageIdSelector(commonState, { id: 1 }, 1000)).toBe(
+      (commonState.documents[1]?.messageId ?? 0) + 1000,
+    );
+  });
+
   describe('integration with re-reselect', () => {
     test('should expose keySelector if base selector is cached', () => {
       const personSelector = createCachedSelector(

package/src/__tests__/createSequenceSelector.test.ts

@@ -5,18 +5,16 @@ import { createSequenceSelector } from '../createSequenceSelector';
 
 describe('createSequenceSelector', () => {
   test('combines input selector results into an ordered array', () => {
-    const selector = createSequenceSelector<State, number | undefined>([
-      (state) => state.persons.currentPersonId,
-      (state) => state.messages.currentMessageId,
+    const selector = createSequenceSelector([
+      (state: State) => state.persons.currentPersonId,
+      (state: State) => state.messages.currentMessageId,
     ]);
 
     expect(selector(commonState)).toEqual([1, 200]);
   });
 
   test('memoizes the result while inputs are unchanged', () => {
-    const selector = createSequenceSelector<State, number | undefined>([
-      (state) => state.persons.currentPersonId,
-    ]);
+    const selector = createSequenceSelector([(state: State) => state.persons.currentPersonId]);
 
     const first = selector(commonState);
     const second = selector(commonState);
@@ -25,9 +23,7 @@ describe('createSequenceSelector', () => {
   });
 
   test('recomputes when an input selector result changes', () => {
-    const selector = createSequenceSelector<State, number | undefined>([
-      (state) => state.persons.currentPersonId,
-    ]);
+    const selector = createSequenceSelector([(state: State) => state.persons.currentPersonId]);
 
     const first = selector(commonState);
     const nextState: State = {
@@ -41,9 +37,9 @@ describe('createSequenceSelector', () => {
   });
 
   test('passes props through to parametric input selectors', () => {
-    const selector = createSequenceSelector<State, { personId: number }, number>([
-      (_state, props) => props.personId,
-      (state) => state.persons.currentPersonId ?? 0,
+    const selector = createSequenceSelector([
+      (_state: State, props: { personId: number }) => props.personId,
+      (state: State) => state.persons.currentPersonId ?? 0,
     ]);
 
     expect(selector(commonState, { personId: 7 })).toEqual([7, 1]);
@@ -52,8 +48,8 @@ describe('createSequenceSelector', () => {
   test('uses the provided selector creator', () => {
     const selectorCreator = vi.fn(createSelector);
 
-    createSequenceSelector<State, number | undefined>(
-      [(state) => state.persons.currentPersonId],
+    createSequenceSelector(
+      [(state: State) => state.persons.currentPersonId],
       selectorCreator as unknown as typeof createSelector,
     );
 

package/src/_helpers/__tests__/generateSelectorKey.test.ts

@@ -0,0 +1,24 @@
+import { generateSelectorKey } from '../generateSelectorKey';
+
+describe('generateSelectorKey', () => {
+  test('stringifies a selector that has no dependencies', () => {
+    const selector = (state: { id: number }) => state.id;
+
+    expect(generateSelectorKey(selector)).toBe('(state) => state.id');
+  });
+
+  test('appends every dependency, so selectors sharing a body still differ', () => {
+    const first = (state: { id: number }) => state.id;
+    const second = (state: { id: number }) => state.id;
+
+    const withFirst = Object.assign((state: { id: number }) => state.id, {
+      dependencies: [first],
+    });
+    const withBoth = Object.assign((state: { id: number }) => state.id, {
+      dependencies: [first, second],
+    });
+
+    expect(generateSelectorKey(withFirst)).not.toBe(generateSelectorKey(withBoth));
+    expect(generateSelectorKey(withBoth)).toContain('(state) => state.id');
+  });
+});

package/src/_helpers/__tests__/getSelectorName.test.ts

@@ -0,0 +1,30 @@
+import { getSelectorName } from '../getSelectorName';
+
+describe('getSelectorName', () => {
+  test('prefers the debug name a selector was tagged with', () => {
+    const selector = Object.assign((state: unknown) => state, {
+      selectorName: 'personSelector',
+    });
+
+    expect(getSelectorName(selector)).toBe('personSelector');
+  });
+
+  test('falls back to the function name when there is no debug name', () => {
+    function messageSelector(state: unknown) {
+      return state;
+    }
+
+    expect(getSelectorName(messageSelector)).toBe('messageSelector');
+  });
+
+  test('falls back to the function name when the debug name is empty', () => {
+    const selector = Object.assign(
+      function personSelector(state: unknown) {
+        return state;
+      },
+      { selectorName: '' },
+    );
+
+    expect(getSelectorName(selector)).toBe('personSelector');
+  });
+});

package/src/_helpers/unfreezeProps.ts

@@ -0,0 +1,14 @@
+/**
+ * Bound selectors write the binding into the props object in place and roll it
+ * back afterwards (see temporaryAssign.ts), which throws on a frozen target in
+ * strict mode. React freezes element props in development, and immer-based
+ * stores hand out frozen objects in production too, so the copy stays in both
+ * builds — the hooks only ever call this when props actually change.
+ */
+export const unfreezeProps = (props: unknown) => {
+  if (typeof props !== 'object' || props === null || !Object.isFrozen(props)) {
+    return props;
+  }
+
+  return Array.isArray(props) ? props.slice() : { ...props };
+};

package/src/_hooks/__tests__/useSelector.bench.ts

@@ -0,0 +1,133 @@
+import { createElement, Fragment, ReactNode, useCallback, useMemo } from 'react';
+import { bench, describe } from 'vitest';
+import { cleanup, render } from '@testing-library/react';
+import { Provider, shallowEqual, useSelector as useReduxSelector } from '@veksa/react-redux';
+import { useSelector } from '../useSelector';
+import { useMemoWith } from '../useMemoWith';
+
+// The implementation this hook replaced: `useMemoWith` (useRef) -> `useMemo` ->
+// `useCallback`, three hook slots and two dependency arrays per call site. Kept
+// here so both variants are measured in the same process on the same workload.
+function useSelectorLegacy(selector: Function, ...params: any[]) {
+  const props = params[0];
+  const memoizedProps = useMemoWith(props, shallowEqual);
+
+  const unfrozenProps = useMemo(() => {
+    return Object.isFrozen(memoizedProps) ? { ...memoizedProps } : memoizedProps;
+  }, [memoizedProps]);
+
+  const memoizedPropsSelector = useCallback(
+    (state: unknown) => {
+      return selector(state, unfrozenProps);
+    },
+    [selector, unfrozenProps],
+  );
+
+  return useReduxSelector(memoizedPropsSelector, {
+    devModeChecks: {
+      stabilityCheck: 'never',
+      identityFunctionCheck: 'never',
+    },
+  });
+}
+
+type State = { count: number };
+type Props = { factor: number };
+
+// `useSelector` overloads are ambient-typed against the store, and the legacy
+// variant is untyped on purpose — both are called through one loose signature.
+type SelectorHook = (selector: (state: State, props: Props) => number, props: Props) => number;
+
+const StoreProvider = Provider as unknown as (props: {
+  store: unknown;
+  children?: ReactNode;
+}) => ReactNode;
+
+const state: State = { count: 5 };
+
+const store = {
+  getState: () => state,
+  dispatch: (action: unknown) => action,
+  subscribe: () => () => undefined,
+  replaceReducer: () => undefined,
+} as unknown as never;
+
+// Selectors in this kit are built once at module scope, so the hot path is a
+// stable selector reference — the hook overhead is all that is left to measure.
+const selectValue = (s: State, props: Props) => s.count * props.factor;
+
+// Enough call sites for the per-hook cost to rise above React's own render
+// overhead, small enough to keep a bench iteration in the millisecond range.
+const CALL_SITES = 500;
+
+const createTree = (useHook: SelectorHook) => {
+  const Child = ({ factor }: Props) => {
+    useHook(selectValue, { factor });
+    return null;
+  };
+
+  return ({ factor }: Props) => {
+    const children: ReactNode[] = [];
+
+    for (let index = 0; index < CALL_SITES; index++) {
+      children.push(createElement(Child, { key: index, factor }));
+    }
+
+    return createElement(StoreProvider, { store }, createElement(Fragment, null, ...children));
+  };
+};
+
+const NextTree = createTree(useSelector as SelectorHook);
+const LegacyTree = createTree(useSelectorLegacy as SelectorHook);
+
+const benchRerender = (name: string, Tree: (props: Props) => ReactNode, changeProps: boolean) => {
+  let mounted: ReturnType<typeof render> | null = null;
+  let factor = 1;
+
+  bench(
+    name,
+    () => {
+      if (changeProps) {
+        factor = factor === 1 ? 2 : 1;
+      }
+
+      mounted!.rerender(createElement(Tree, { factor }));
+    },
+    {
+      setup: () => {
+        mounted = render(createElement(Tree, { factor }));
+      },
+      teardown: () => {
+        cleanup();
+        mounted = null;
+      },
+    },
+  );
+};
+
+// The dominant case: a parent re-renders, props are new objects but shallow
+// equal, the state has not changed. Nothing recomputes — this is hook overhead
+// and nothing else.
+describe('re-render, shallow-equal props', () => {
+  benchRerender('next', NextTree, false);
+  benchRerender('legacy', LegacyTree, false);
+});
+
+// Props actually change, so both variants must rebuild the bound selector and
+// let react-redux recompute the selection.
+describe('re-render, changed props', () => {
+  benchRerender('next', NextTree, true);
+  benchRerender('legacy', LegacyTree, true);
+});
+
+describe('mount', () => {
+  bench('next', () => {
+    render(createElement(NextTree, { factor: 1 }));
+    cleanup();
+  });
+
+  bench('legacy', () => {
+    render(createElement(LegacyTree, { factor: 1 }));
+    cleanup();
+  });
+});

package/src/_hooks/__tests__/useSelector.test.ts

@@ -65,6 +65,75 @@ describe('useSelector', () => {
     expect(new Set(propsArgs).size).toBe(1);
   });
 
+  test('does not re-run the selector while props and state stay equal', () => {
+    const store = createMockStore(state);
+    const selector = vi.fn((s: State, props: { factor: number }) => s.count * props.factor);
+
+    const { rerender } = renderHook(({ props }) => useSelector(selector, props), {
+      wrapper: wrapperWith(store),
+      initialProps: { props: { factor: 2 } },
+    });
+
+    const callsAfterMount = selector.mock.calls.length;
+    rerender({ props: { factor: 2 } });
+
+    expect(selector.mock.calls.length).toBe(callsAfterMount);
+  });
+
+  test('re-runs the selector when props change without a state change', () => {
+    const store = createMockStore(state);
+
+    const { result, rerender } = renderHook(
+      ({ props }) => useSelector((s: State, p: { factor: number }) => s.count * p.factor, props),
+      {
+        wrapper: wrapperWith(store),
+        initialProps: { props: { factor: 2 } },
+      },
+    );
+
+    expect(result.current).toBe(10);
+
+    rerender({ props: { factor: 3 } });
+
+    expect(result.current).toBe(15);
+  });
+
+  test('passes non-object props through untouched', () => {
+    const store = createMockStore(state);
+    let receivedProps: unknown;
+
+    renderHook(
+      () =>
+        useSelector((s: State, props: string) => {
+          receivedProps = props;
+          return s.count;
+        }, 'id'),
+      { wrapper: wrapperWith(store) },
+    );
+
+    expect(receivedProps).toBe('id');
+  });
+
+  test('copies frozen array props without turning them into objects', () => {
+    const store = createMockStore(state);
+    let receivedProps: number[] | undefined;
+
+    renderHook(
+      () =>
+        useSelector(
+          (s: State, props: number[]) => {
+            receivedProps = props;
+            return s.count;
+          },
+          Object.freeze([1, 2]) as number[],
+        ),
+      { wrapper: wrapperWith(store) },
+    );
+
+    expect(Object.isFrozen(receivedProps)).toBe(false);
+    expect(receivedProps).toEqual([1, 2]);
+  });
+
   test('unfreezes frozen props before passing them to the selector', () => {
     const store = createMockStore(state);
     let receivedProps: { factor: number } | undefined;