packages/react-query/test/mutationkey.test.tsx - main - githubmirror/trpc

packages/react-query/test/mutationkey.test.tsx

76 строк2 KB

Alex / KATT

patch: typescript 5.9 support (#6877)

04 авг 2025, 18:19

04 авг 2025, 18:19b7b8d3a

import { getServerAndReactClient } from './__reactHelpers';
import { useIsMutating, useQueryClient } from '@tanstack/react-query';
import { render } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { initTRPC } from '@trpc/server';
import { konn } from 'konn';
import React from 'react';

const ctx = konn()
  .beforeEach(() => {
    const t = initTRPC.create();

    const appRouter = t.router({
      post: t.router({
        create: t.procedure.mutation(() => 'ok' as const),
      }),
    });

    return getServerAndReactClient(appRouter);
  })
  .afterEach(async (ctx) => {
    await ctx?.close?.();
  })
  .done();

describe('mutation keys', () => {
  test('can grab from cache using correct key', async () => {
    const { client, App } = ctx;
    const mutationKey = [['post', 'create']];

    function MyComponent() {
      const postCreate = client.post.create.useMutation();

      const isMutating = useIsMutating({ mutationKey });

      return (
        <div>
          <button
            onClick={() => {
              postCreate.mutate();
            }}
            data-testid="mutate"
          />
          <pre data-testid="status">{isMutating}</pre>
        </div>
      );
    }

    const utils = render(
      <App>
        <MyComponent />
      </App>,
    );

    expect(
      ctx.queryClient.getMutationCache().find({ mutationKey }),
    ).toBeUndefined();

    await vi.waitFor(() => {
      expect(utils.getByTestId('status')).toHaveTextContent('0');
    });

    // should be mutating after button press
    await userEvent.click(utils.getByTestId('mutate'));
    expect(utils.getByTestId('status')).toHaveTextContent('1');

    expect(
      ctx.queryClient.getMutationCache().find({ mutationKey }),
    ).not.toBeUndefined();

    // should be mutating due to effect
    await vi.waitFor(() => {
      expect(utils.getByTestId('status')).toHaveTextContent('0');
    });
  });
});