reselect-kit 1.0.0

package/src/__tests__/createChainSelector.test.ts

@@ -0,0 +1,404 @@
+import { createSelector, setGlobalDevModeChecks } from '@veksa/reselect';
+import { createCachedSelector } from '@veksa/re-reselect';
+import { createChainSelector } 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 { createSequenceSelector } from '../createSequenceSelector';
+import { NamedParametricSelector, NamedSelector } from '../types';
+
+vi.mock('../debug/debug', async (importOriginal) => ({
+  ...(await importOriginal<object>()),
+  isDebugMode: vi.fn(() => true),
+}));
+
+describe('createChainSelector', () => {
+  const personsSelector = (state: PersonStateSegment) => {
+    return state.persons;
+  };
+
+  const personSelector = createCachedSelector(
+    [createPathSelector(personsSelector).data(), createPropSelector<{ id: number }>().id()],
+    (data, id) => {
+      return data[id];
+    },
+  )({
+    keySelector: createPropSelector<{ id: number }>().id(),
+  });
+
+  const messagesSelector = (state: MessageStateSegment) => {
+    return state.messages;
+  };
+
+  const messageSelector = (state: MessageStateSegment, props: { id: number }) => {
+    return state.messages.data[props.id];
+  };
+
+  const fullNameSelector = createSelector(
+    [personSelector],
+    ({ firstName = '', secondName = '' }) => {
+      return `${firstName} ${secondName}`;
+    },
+  );
+
+  const fullNameCachedSelector = createCachedSelector(
+    [personSelector],
+    ({ firstName = '', secondName = '' }) => {
+      return `${firstName} ${secondName}`;
+    },
+  )((_state, props) => props.id);
+
+  afterEach(() => {
+    fullNameCachedSelector.clearCache();
+    fullNameCachedSelector.resetRecomputations();
+  });
+
+  beforeAll(() => {
+    setGlobalDevModeChecks({
+      inputStabilityCheck: 'never',
+      identityFunctionCheck: 'never',
+    });
+  });
+
+  test('should implement simple selector chain', () => {
+    const personByMessageIdSelector = createChainSelector(messageSelector)
+      .chain((message) => {
+        return createBoundSelector(personSelector, {
+          id: message.personId,
+        });
+      })
+      .chain((person) => {
+        return createBoundSelector(fullNameSelector, {
+          id: person.id,
+        });
+      })
+      .build();
+
+    expect(personByMessageIdSelector(commonState, { id: 100 })).toBe('Marry Poppins');
+    expect(personByMessageIdSelector(commonState, { id: 200 })).toBe('Harry Potter');
+  });
+
+  test('should implement simple optional selection', () => {
+    const currentMessageSelector = createChainSelector(
+      createPathSelector(messagesSelector).currentMessageId(),
+    )
+      .chain((messageId) => {
+        return createBoundSelector(messageSelector, {
+          id: messageId,
+        });
+      })
+      .build();
+
+    expect(currentMessageSelector(commonState).personId).toBe(2);
+    expect(createPathSelector(currentMessageSelector).personId()(commonState)).toBe(2);
+  });
+
+  test('should implement path chain selector for name property', () => {
+    const personByMessageIdSelector = createChainSelector(
+      createPathSelector(personsSelector).currentPersonId(),
+    )
+      .chain((personId) => {
+        return createBoundSelector(personSelector, {
+          id: personId,
+        });
+      })
+      .build();
+
+    expect(createPathSelector(personByMessageIdSelector).firstName()(commonState)).toBe('Marry');
+    expect(createPathSelector(personByMessageIdSelector).name()(commonState)).toBe('M Poppins');
+  });
+
+  test('should cached chain callback by result of input selector', () => {
+    const selectorStub = () => '';
+    const chainMock = vi.fn(() => selectorStub);
+
+    const someByMessageIdSelector = createChainSelector(messageSelector).chain(chainMock).build();
+
+    someByMessageIdSelector(commonState, { id: 100 });
+    someByMessageIdSelector(commonState, { id: 100 });
+    someByMessageIdSelector(commonState, { id: 100 });
+
+    expect(chainMock).toHaveBeenCalledTimes(1);
+
+    someByMessageIdSelector(commonState, { id: 200 });
+
+    expect(chainMock).toHaveBeenCalledTimes(2);
+  });
+
+  test('should not mutate dependencies of chaining selectors', () => {
+    const firstPersonSelector = createBoundSelector(personSelector, {
+      id: 1,
+    });
+
+    const firstPersonMonadicSelector = createChainSelector(() => '')
+      .chain(() => firstPersonSelector)
+      .build();
+
+    const firstDependencies = firstPersonSelector.dependencies;
+    firstPersonMonadicSelector(commonState);
+    const secondDependencies = firstPersonSelector.dependencies;
+
+    expect(firstDependencies?.length).toBeDefined();
+    expect(firstDependencies?.length).toBe(secondDependencies?.length);
+  });
+
+  test('should not invalidate cache for input parametric selector', () => {
+    const chainFn = vi.fn((result: string) => () => result);
+    const fullNameProxyCachedSelector = createChainSelector(fullNameCachedSelector)
+      .chain(chainFn)
+      .build();
+
+    fullNameProxyCachedSelector(commonState, { id: 1 });
+    fullNameProxyCachedSelector(commonState, { id: 2 });
+    fullNameProxyCachedSelector(commonState, { id: 1 });
+    fullNameProxyCachedSelector(commonState, { id: 2 });
+
+    expect(fullNameCachedSelector.recomputations()).toBe(2);
+    expect(chainFn).toHaveBeenCalledTimes(2);
+  });
+
+  test('should not invalidate cache for input path parametric selector', () => {
+    const personCachedSelector = createCachedSelector([personSelector], (person) => {
+      return person;
+    })((_state, props) => props.id);
+
+    const chainFn = vi.fn((result?: string) => () => result);
+
+    const nameProxyCachedSelector = createChainSelector(
+      createPathSelector(personCachedSelector).firstName(),
+    )
+      .chain(chainFn)
+      .build();
+
+    nameProxyCachedSelector(commonState, { id: 1 });
+    nameProxyCachedSelector(commonState, { id: 2 });
+    nameProxyCachedSelector(commonState, { id: 1 });
+    nameProxyCachedSelector(commonState, { id: 2 });
+
+    expect(chainFn).toHaveBeenCalledTimes(2);
+  });
+
+  test('should not invalidate cached selector with composingKeySelectorCreator', () => {
+    const cachedPersonSelector = createCachedSelector(
+      [
+        (state: State) => state.persons,
+        (_state: State, props: { personId: number }) => props.personId,
+      ],
+      (persons, personId) => {
+        return persons.data[personId];
+      },
+    )({
+      keySelector: (_state: State, props: { personId: number }) => props.personId,
+    });
+
+    const cachedMessageSelector = createCachedSelector(
+      [
+        (state: State) => state.messages.data,
+        (_state: State, props: { messageId: number }) => props.messageId,
+      ],
+      (messages, messageId) => {
+        return messages[messageId];
+      },
+    )({
+      keySelector: (_state: State, props: { messageId: number }) => props.messageId,
+    });
+
+    const personByMessageIdSelector = createChainSelector(cachedMessageSelector)
+      .chain((message) => {
+        return createBoundSelector(cachedPersonSelector, {
+          personId: message.personId,
+        });
+      })
+      .build();
+
+    const fullNameByMessageSelector = createCachedSelector(
+      [personByMessageIdSelector],
+      ({ firstName = '', secondName = '' }) => {
+        return `${firstName} ${secondName}`;
+      },
+    )({
+      keySelectorCreator: createKeySelectorCreator(stringComposeKeySelectors),
+    });
+
+    expect(fullNameByMessageSelector(commonState, { messageId: 100 })).toBe('Marry Poppins');
+    expect(fullNameByMessageSelector(commonState, { messageId: 200 })).toBe('Harry Potter');
+
+    expect(fullNameByMessageSelector(commonState, { messageId: 100 })).toBe('Marry Poppins');
+    expect(fullNameByMessageSelector(commonState, { messageId: 200 })).toBe('Harry Potter');
+
+    expect(fullNameByMessageSelector.recomputations()).toBe(2);
+  });
+
+  test('should build cached selector with few levels of chaining', () => {
+    const firstKeySelector = createPropSelector<{
+      firstProp: string;
+    }>().firstProp();
+
+    const secondKeySelector = createPropSelector<{
+      secondProp: string;
+    }>().secondProp();
+
+    const firstSelector = createCachedSelector(
+      firstKeySelector,
+      (firstProp) => firstProp,
+    )({
+      keySelector: firstKeySelector,
+    });
+
+    const secondSelector = createCachedSelector(
+      secondKeySelector,
+      (secondProp) => secondProp,
+    )({
+      keySelector: secondKeySelector,
+    });
+
+    const chainFn = vi.fn((result: string) => () => result);
+
+    const chainSelector = createChainSelector(firstSelector)
+      .chain(() => secondSelector)
+      .chain(chainFn)
+      .build();
+
+    chainSelector(expect.anything(), {
+      firstProp: 'firstValue',
+      secondProp: 'firstValue',
+    });
+
+    chainSelector(expect.anything(), {
+      firstProp: 'firstValue',
+      secondProp: 'secondValue',
+    });
+
+    chainSelector(expect.anything(), {
+      firstProp: 'secondValue',
+      secondProp: 'firstValue',
+    });
+
+    chainSelector(expect.anything(), {
+      firstProp: 'secondValue',
+      secondProp: 'secondValue',
+    });
+
+    chainSelector(expect.anything(), {
+      firstProp: 'firstValue',
+      secondProp: 'firstValue',
+    });
+
+    chainSelector(expect.anything(), {
+      firstProp: 'firstValue',
+      secondProp: 'secondValue',
+    });
+
+    chainSelector(expect.anything(), {
+      firstProp: 'secondValue',
+      secondProp: 'firstValue',
+    });
+
+    chainSelector(expect.anything(), {
+      firstProp: 'secondValue',
+      secondProp: 'secondValue',
+    });
+
+    expect(chainFn).toHaveBeenCalledTimes(4);
+    expect(firstSelector.recomputations()).toBe(2);
+    expect(secondSelector.recomputations()).toBe(2);
+  });
+
+  test('should implement aggregation for collection by single item selector', () => {
+    const personsSelector = (state: State) => state.persons;
+
+    const longestFullNameSelector = createChainSelector(personsSelector)
+      .chain((persons) => {
+        return createSequenceSelector(
+          Object.values(persons.data).map((person) => {
+            return createBoundSelector(fullNameSelector, { id: person.id });
+          }),
+        );
+      })
+      .map((fullNames) => {
+        return fullNames.reduce((longest, current) => {
+          return current.length > longest.length ? current : longest;
+        });
+      })
+      .build();
+
+    expect(longestFullNameSelector(commonState)).toBe('Marry Poppins');
+  });
+
+  test('should generate selector name', () => {
+    const fullNameNamedSelector = createSelector(
+      [personSelector],
+      ({ firstName = '', secondName = '' }) => {
+        return `${firstName} ${secondName}`;
+      },
+    );
+
+    (
+      fullNameNamedSelector as NamedParametricSelector<unknown, unknown, unknown, unknown>
+    ).selectorName = 'fullNameNamedSelector';
+
+    const personByMessageIdSelector: any = createChainSelector(messageSelector)
+      .chain((message) => {
+        return createBoundSelector(personSelector, { id: message.personId });
+      })
+      .chain((person) => {
+        return createBoundSelector(fullNameNamedSelector, { id: person.id });
+      })
+      .build();
+
+    expect(personByMessageIdSelector.selectorName).toMatchInlineSnapshot(
+      `"messageSelector (will be chained (message) => { return __vi_import_3__.createBoundSelector(personSelector, { id: message.personId }); }) (will be chained (person) => { return __vi_import_3__.createBoundSelector(fullNameNamedSelector, { id: person.id }); })"`,
+    );
+
+    personByMessageIdSelector(commonState, { id: 100 });
+
+    expect(personByMessageIdSelector.selectorName).toMatchInlineSnapshot(
+      `"messageSelector (chained by selector (id -> [*])) (chained by fullNameNamedSelector (id -> [*]))"`,
+    );
+
+    const [higherOrderSelector] = personByMessageIdSelector.dependencies as unknown[];
+
+    expect(
+      (higherOrderSelector as NamedSelector<unknown, unknown>).selectorName,
+    ).toMatchInlineSnapshot(
+      `"higher order for messageSelector (chained by selector (id -> [*])) ((person) => { return __vi_import_3__.createBoundSelector(fullNameNamedSelector, { id: person.id }); })"`,
+    );
+  });
+
+  test('should build selector with chainHierarchy property for unit test', () => {
+    type FirstState = { firstValue: string };
+
+    const firstSelector = (state: FirstState) => {
+      return state.firstValue;
+    };
+    const firstChain = () => firstSelector;
+
+    type SecondState = { secondValue: number };
+    type SecondProps = { prop: boolean };
+
+    const secondSelector = (state: SecondState, props: SecondProps) => {
+      return `${state.secondValue} ${String(props.prop)}`;
+    };
+    const secondChain = () => secondSelector;
+
+    const someByMessageIdSelector = createChainSelector(messageSelector)
+      .chain(firstChain)
+      .chain(secondChain)
+      .build();
+
+    expect(someByMessageIdSelector.chainHierarchy).toBeDefined();
+
+    const lastChain = someByMessageIdSelector.chainHierarchy;
+
+    expect(lastChain?.('firstValue')).toBe(secondSelector);
+    expect(lastChain?.('firstValue')({ secondValue: 2 }, { prop: true })).toBe('2 true');
+
+    const lastButOneChain = someByMessageIdSelector.chainHierarchy?.parentChain;
+
+    expect(lastButOneChain?.(expect.anything())).toBe(firstSelector);
+    expect(lastButOneChain?.(expect.anything())({ firstValue: 'firstValue' })).toBe('firstValue');
+  });
+});

package/src/__tests__/createEmptySelector.test.ts

@@ -0,0 +1,99 @@
+import { createCachedSelector } from '@veksa/re-reselect';
+import { createChainSelector } from '../createChainSelector';
+import { createBoundSelector } from '../createBoundSelector';
+import { createEmptySelector } from '../createEmptySelector';
+import { isCachedSelector } from '../_helpers/isCachedSelector';
+
+describe('createEmptySelector', () => {
+  type Parent = {
+    parentId: number;
+  };
+
+  type Child = {
+    childId: number;
+    parentId?: number;
+  };
+
+  type State = {
+    firstGeneration: Record<number, Parent>;
+    secondGeneration: Record<number, Child>;
+  };
+
+  const exampleState: State = {
+    firstGeneration: {
+      1: { parentId: 1 },
+      2: { parentId: 2 },
+    },
+    secondGeneration: {
+      101: { childId: 101, parentId: 1 },
+      102: { childId: 102 },
+    },
+  };
+
+  const parentSelector = (state: State, props: { parentId: number }) =>
+    state.firstGeneration[props.parentId];
+
+  const childSelector = (state: State, props: { childId: number }) =>
+    state.secondGeneration[props.childId];
+
+  test('should return undefined for optional links', () => {
+    const parentByChildSelector = createChainSelector(childSelector)
+      .chain(({ parentId }) =>
+        parentId !== undefined
+          ? createBoundSelector(parentSelector, {
+              parentId,
+            })
+          : createEmptySelector(parentSelector),
+      )
+      .build();
+
+    const result1 = parentByChildSelector(exampleState, {
+      childId: 101,
+    });
+
+    expect(result1?.parentId).toBe(1);
+
+    const result2 = parentByChildSelector(exampleState, {
+      childId: 102,
+    });
+
+    expect(result2).toBeUndefined();
+  });
+
+  test('should create selector without parameters', () => {
+    const emptyParentSelector = createEmptySelector(parentSelector);
+
+    const result = emptyParentSelector(exampleState);
+
+    expect(result).toBeUndefined();
+  });
+
+  describe('integration with re-reselect', () => {
+    const parentCachedSelector = createCachedSelector(
+      [
+        (state: State) => state.firstGeneration,
+        (_: State, props: { parentId: number }) => props.parentId,
+      ],
+      (firstGeneration, parentId) => firstGeneration[parentId],
+    )({
+      keySelector: (_, props) => props.parentId,
+    });
+
+    test('should produce cached selector if input selector is cached', () => {
+      const emptyParentCachedSelector = createEmptySelector(parentCachedSelector);
+
+      expect(isCachedSelector(emptyParentCachedSelector)).toBeTruthy();
+
+      if (!isCachedSelector(emptyParentCachedSelector)) {
+        throw new Error('emptyParentCachedSelector should be cached');
+      }
+
+      const key = emptyParentCachedSelector.keySelector(
+        expect.anything(),
+        expect.anything(),
+      ) as unknown;
+
+      expect(key).toBeDefined();
+    });
+  });
+});

package/src/__tests__/createPathSelector.test.ts

@@ -0,0 +1,81 @@
+import { createCachedSelector } from '@veksa/re-reselect';
+import { createPathSelector } from '../createPathSelector';
+import { commonState, Document, State } from '../__data__/state';
+import { isCachedSelector } from '../_helpers/isCachedSelector';
+
+describe('createPathSelector', () => {
+  test('should implement basic access to state properties', () => {
+    const baseSelector = (state: Partial<State>) => state;
+    const pathSelector = createPathSelector(baseSelector);
+
+    type Props = {
+      id: number;
+    };
+
+    const baseParametricSelector = (state: State, props: Props): Document | undefined => {
+      return state.documents[props.id];
+    };
+
+    const pathParametricSelector = createPathSelector(baseParametricSelector);
+
+    expect(pathSelector.messages.data[100].text()(commonState)).toEqual('Hello');
+    expect(pathSelector.messages.data[300].text()(commonState)).toBeUndefined();
+    expect(pathSelector.messages.data[300].text('Default')(commonState)).toBe('Default');
+
+    expect(pathParametricSelector.messageId()(commonState, { id: 111 })).toEqual(100);
+    expect(pathParametricSelector.data[0]()(commonState, { id: 111 })).toEqual(1);
+    expect(pathParametricSelector.messageId()(commonState, { id: 333 })).toBeUndefined();
+    expect(pathParametricSelector.messageId(100500)(commonState, { id: 333 })).toBe(100500);
+  });
+
+  test('should handle states typed as interface', () => {
+    interface IState {
+      name: string;
+    }
+
+    const baseSelector = (state: IState) => state;
+
+    const nameSelector = createPathSelector(baseSelector).name();
+
+    expect(nameSelector({ name: 'name' })).toBe('name');
+  });
+
+  test('should handle default value for optional param', () => {
+    interface IState {
+      name?: string;
+    }
+
+    const baseSelector = (state: IState) => state;
+
+    const nameSelector = createPathSelector(baseSelector).name('default');
+
+    expect(nameSelector({})).toBe('default');
+  });
+
+  describe('integration with re-reselect', () => {
+    test('should expose keySelector if base selector is cached', () => {
+      const personSelector = createCachedSelector(
+        [
+          (state: State) => state.persons,
+          (_state: State, props: { personId: number }) => props.personId,
+        ],
+        (persons, personId) => persons.data[personId],
+      )({
+        keySelector: (_state: State, props: { personId: number }) => props.personId,
+      });
+
+      const firstNameSelector = createPathSelector(personSelector).firstName();
+
+      if (!isCachedSelector(firstNameSelector)) {
+        throw new Error('firstNameSelector should be cached');
+      }
+
+      const personId = 1;
+      const key = firstNameSelector.keySelector(expect.anything(), {
+        personId,
+      }) as unknown;
+
+      expect(key).toBe(personId);
+    });
+  });
+});

package/src/__tests__/createPropSelector.test.ts

@@ -0,0 +1,36 @@
+import { createPropSelector } from '../createPropSelector';
+import { createBoundSelector } from '../createBoundSelector';
+
+describe('createPropSelector', () => {
+  test('should implement basic access to properties', () => {
+    type Props = {
+      range?: {
+        from?: number;
+        to?: number;
+      };
+    };
+    const props: Props = {
+      range: {
+        from: 30,
+        to: 70,
+      },
+    };
+
+    const propSelector = createPropSelector<Props>();
+
+    expect(propSelector.range.from()({}, props)).toEqual(30);
+    expect(propSelector.range.to()({}, props)).toEqual(70);
+
+    expect(propSelector.range.from(0)({}, {})).toEqual(0);
+    expect(propSelector.range.to(100)({}, {})).toEqual(100);
+  });
+
+  test('should not be detected as prop selector if wrapped in bound selector', () => {
+    const propSelector = createPropSelector<{ value: string }>().value();
+    const boundSelector = createBoundSelector(propSelector, {
+      value: 'value',
+    });
+
+    expect(boundSelector).not.toHaveProperty('isPropSelector', true);
+  });
+});

package/src/__tests__/createSegmentSelector.test.ts

@@ -0,0 +1,31 @@
+import { describe, expect, test } from 'vitest';
+import { createSegmentSelector } from '../createSegmentSelector';
+
+describe('createSegmentSelector', () => {
+  type State = { value?: number | null; nested: { count: number } };
+
+  test('returns the selected segment when it is present', () => {
+    const selector = createSegmentSelector((state: State) => state.nested, { count: 0 });
+
+    const state: State = { nested: { count: 5 } };
+    expect(selector(state)).toBe(state.nested);
+  });
+
+  test('falls back to the initial value when the segment is undefined', () => {
+    const selector = createSegmentSelector((state: State) => state.value, 42);
+
+    expect(selector({ value: undefined, nested: { count: 0 } })).toBe(42);
+  });
+
+  test('falls back to the initial value when the segment is null', () => {
+    const selector = createSegmentSelector((state: State) => state.value, 42);
+
+    expect(selector({ value: null, nested: { count: 0 } })).toBe(42);
+  });
+
+  test('does not fall back for defined but falsy values', () => {
+    const selector = createSegmentSelector((state: State) => state.value, 42);
+
+    expect(selector({ value: 0, nested: { count: 0 } })).toBe(0);
+  });
+});