useCacheEntry.test.mjs

// @ts-check

import "./test/polyfillCustomEvent.mjs";

import { deepStrictEqual, ok, strictEqual, throws } from "node:assert";
import { describe, it } from "node:test";

import React from "react";
import ReactTestRenderer from "react-test-renderer";

import Cache from "./Cache.mjs";
import CacheContext from "./CacheContext.mjs";
import cacheEntryDelete from "./cacheEntryDelete.mjs";
import cacheEntrySet from "./cacheEntrySet.mjs";
import assertBundleSize from "./test/assertBundleSize.mjs";
import createReactTestRenderer from "./test/createReactTestRenderer.mjs";
import ReactHookTest from "./test/ReactHookTest.mjs";
import useCacheEntry from "./useCacheEntry.mjs";

describe("React hook `useCacheEntry`.", { concurrency: true }, () => {
  it("Bundle size.", async () => {
    await assertBundleSize(
      new URL("./useCacheEntry.mjs", import.meta.url),
      550,
    );
  });

  it("Argument 1 `cacheKey` not a string.", () => {
    throws(() => {
      useCacheEntry(
        // @ts-expect-error Testing invalid.
        true,
      );
    }, new TypeError("Argument 1 `cacheKey` must be a string."));
  });

  it("Cache context missing.", () => {
    /** @type {Array<import("./test/ReactHookTest.mjs").ReactHookResult>} */
    const results = [];

    createReactTestRenderer(
      React.createElement(ReactHookTest, {
        useHook: () => useCacheEntry("a"),
        results,
      }),
    );

    strictEqual(results.length, 1);
    ok("threw" in results[0]);
    deepStrictEqual(results[0].threw, new TypeError("Cache context missing."));
  });

  it("Cache context value not a `Cache` instance.", () => {
    /** @type {Array<import("./test/ReactHookTest.mjs").ReactHookResult>} */
    const results = [];

    createReactTestRenderer(
      React.createElement(
        CacheContext.Provider,
        {
          // @ts-expect-error Testing invalid.
          value: true,
        },
        React.createElement(ReactHookTest, {
          useHook: () => useCacheEntry("a"),
          results,
        }),
      ),
    );

    strictEqual(results.length, 1);
    ok("threw" in results[0]);
    deepStrictEqual(
      results[0].threw,
      new TypeError("Cache context value must be a `Cache` instance."),
    );
  });

  it("Without initial cache values for each cache key used.", () => {
    const cache = new Cache();
    const cacheKeyA = "a";

    /** @type {Array<import("./test/ReactHookTest.mjs").ReactHookResult>} */
    const results = [];

    const testRenderer = createReactTestRenderer(
      React.createElement(
        CacheContext.Provider,
        { value: cache },
        React.createElement(ReactHookTest, {
          useHook: () => useCacheEntry(cacheKeyA),
          results,
        }),
      ),
    );

    strictEqual(results.length, 1);
    ok("returned" in results[0]);
    strictEqual(results[0].returned, undefined);

    const cacheValueA2 = "a2";

    ReactTestRenderer.act(() => {
      cacheEntrySet(cache, cacheKeyA, cacheValueA2);
    });

    strictEqual(results.length, 2);
    ok("returned" in results[1]);
    strictEqual(results[1].returned, cacheValueA2);

    ReactTestRenderer.act(() => {
      cacheEntryDelete(cache, cacheKeyA);
    });

    strictEqual(results.length, 3);
    ok("returned" in results[2]);
    strictEqual(results[2].returned, undefined);

    const cacheKeyB = "b";

    ReactTestRenderer.act(() => {
      testRenderer.update(
        React.createElement(
          CacheContext.Provider,
          { value: cache },
          React.createElement(ReactHookTest, {
            useHook: () => useCacheEntry(cacheKeyB),
            results,
          }),
        ),
      );
    });

    strictEqual(results.length, 4);
    ok("returned" in results[3]);
    strictEqual(results[3].returned, undefined);

    const cacheValueB2 = "b2";

    ReactTestRenderer.act(() => {
      cacheEntrySet(cache, cacheKeyB, cacheValueB2);
    });

    strictEqual(results.length, 5);
    ok("returned" in results[4]);
    strictEqual(results[4].returned, cacheValueB2);

    ReactTestRenderer.act(() => {
      cacheEntryDelete(cache, cacheKeyB);
    });

    strictEqual(results.length, 6);
    ok("returned" in results[5]);
    strictEqual(results[5].returned, undefined);
  });

  it("Initial cache values for each cache key used, replacing cache values.", () => {
    const cacheKeyA = "a";
    const cacheValueA1 = "a1";
    const cacheKeyB = "b";
    const cacheValueB1 = "b1";
    const cache = new Cache({
      [cacheKeyA]: cacheValueA1,
      [cacheKeyB]: cacheValueB1,
    });

    /** @type {Array<import("./test/ReactHookTest.mjs").ReactHookResult>} */
    const results = [];

    const testRenderer = createReactTestRenderer(
      React.createElement(
        CacheContext.Provider,
        { value: cache },
        React.createElement(ReactHookTest, {
          useHook: () => useCacheEntry(cacheKeyA),
          results,
        }),
      ),
    );

    strictEqual(results.length, 1);
    ok("returned" in results[0]);
    strictEqual(results[0].returned, cacheValueA1);

    const cacheValueA2 = "a2";

    ReactTestRenderer.act(() => {
      cacheEntrySet(cache, cacheKeyA, cacheValueA2);
    });

    strictEqual(results.length, 2);
    ok("returned" in results[1]);
    strictEqual(results[1].returned, cacheValueA2);

    ReactTestRenderer.act(() => {
      cacheEntryDelete(cache, cacheKeyA);
    });

    strictEqual(results.length, 3);
    ok("returned" in results[2]);
    strictEqual(results[2].returned, undefined);

    ReactTestRenderer.act(() => {
      testRenderer.update(
        React.createElement(
          CacheContext.Provider,
          { value: cache },
          React.createElement(ReactHookTest, {
            useHook: () => useCacheEntry(cacheKeyB),
            results,
          }),
        ),
      );
    });

    strictEqual(results.length, 4);
    ok("returned" in results[3]);
    strictEqual(results[3].returned, cacheValueB1);

    const cacheValueB2 = "b2";

    ReactTestRenderer.act(() => {
      cacheEntrySet(cache, cacheKeyB, cacheValueB2);
    });

    strictEqual(results.length, 5);
    ok("returned" in results[4]);
    strictEqual(results[4].returned, cacheValueB2);

    ReactTestRenderer.act(() => {
      cacheEntryDelete(cache, cacheKeyB);
    });

    strictEqual(results.length, 6);
    ok("returned" in results[5]);
    strictEqual(results[5].returned, undefined);
  });

  it("Initial cache value, mutating cache value.", () => {
    const cacheKey = "a";
    const cacheValue = { a: 1 };
    const cache = new Cache({
      [cacheKey]: cacheValue,
    });

    /** @type {Array<import("./test/ReactHookTest.mjs").ReactHookResult>} */
    const results = [];

    createReactTestRenderer(
      React.createElement(
        CacheContext.Provider,
        { value: cache },
        React.createElement(ReactHookTest, {
          useHook: () => useCacheEntry(cacheKey),
          results,
        }),
      ),
    );

    strictEqual(results.length, 1);
    ok("returned" in results[0]);
    strictEqual(results[0].returned, cacheValue);

    ReactTestRenderer.act(() => {
      cacheValue.a = 2;
      cache.dispatchEvent(
        new CustomEvent(`${cacheKey}/set`, {
          detail: {
            cacheValue,
          },
        }),
      );
    });

    strictEqual(results.length, 2);
    ok("returned" in results[1]);
    strictEqual(results[1].returned, cacheValue);

    ReactTestRenderer.act(() => {
      cacheEntryDelete(cache, cacheKey);
    });

    strictEqual(results.length, 3);
    ok("returned" in results[2]);
    strictEqual(results[2].returned, undefined);
  });
});