@bleedingdev/modern-js-plugin-tanstack 3.9.0-ultramodern.9 → 3.9.3-ultramodern.1

package/tests/router/clientHydration.test.tsx

@@ -1,200 +0,0 @@
-import type { AnyRouter } from '@tanstack/react-router';
-import { act, render, screen, waitFor } from '@testing-library/react';
-import React, { Suspense } from 'react';
-import { ModernRouterClient } from '../../src/runtime/clientHydration';
-import { createTreeGetterFromFlightStream } from '../../src/runtime/rsc/treeGetter';
-
-let hydrateImpl: () => Promise<unknown>;
-let createFromReadableStreamImpl: () => Promise<unknown>;
-let registeredCallServer: unknown;
-let decoderCallServer: unknown;
-
-rstest.mock('@tanstack/react-router', () => ({
-  RouterProvider: ({ router }: { router: { label: string } }) => (
-    <div data-testid="router-provider">{router.label}</div>
-  ),
-}));
-
-rstest.mock('@tanstack/react-router/ssr/client', () => ({
-  hydrate: () => hydrateImpl(),
-}));
-
-rstest.mock('@modern-js/runtime/rsc/client', () => {
-  const callServer = () => undefined;
-
-  return {
-    callServer,
-    createFromReadableStream: (
-      _stream: ReadableStream<Uint8Array>,
-      options: { callServer: unknown },
-    ) => {
-      decoderCallServer = options.callServer;
-      return createFromReadableStreamImpl();
-    },
-    setServerCallback: (callback: unknown) => {
-      registeredCallServer = callback;
-    },
-  };
-});
-
-function createDeferred<T>() {
-  let resolve!: (value: T | PromiseLike<T>) => void;
-  let reject!: (reason?: unknown) => void;
-  const promise = new Promise<T>((resolvePromise, rejectPromise) => {
-    resolve = resolvePromise;
-    reject = rejectPromise;
-  });
-  return { promise, reject, resolve };
-}
-
-function createRouter(label: string): AnyRouter {
-  return {
-    label,
-    routesById: {},
-    stores: {
-      matches: {
-        get: () => [],
-      },
-    },
-  } as unknown as AnyRouter;
-}
-
-function FlightTree({ getTree }: { getTree: () => unknown }) {
-  const tree = getTree();
-  if (
-    typeof tree !== 'object' ||
-    tree === null ||
-    !('label' in tree) ||
-    typeof tree.label !== 'string'
-  ) {
-    throw new Error('Expected the decoded Flight tree to contain a label.');
-  }
-  return <div data-testid="flight-tree">{tree.label}</div>;
-}
-
-class FlightErrorBoundary extends React.Component<
-  { children: React.ReactNode; onError: (error: unknown) => void },
-  { error: unknown }
-> {
-  state = { error: undefined };
-
-  static getDerivedStateFromError(error: unknown) {
-    return { error };
-  }
-
-  componentDidCatch(error: unknown) {
-    this.props.onError(error);
-  }
-
-  render() {
-    if (this.state.error !== undefined) {
-      return <div data-testid="flight-error">failed</div>;
-    }
-    return this.props.children;
-  }
-}
-
-describe('TanStack SSR client hydration', () => {
-  it('keeps the router behind Suspense until late SSR hydration completes', async () => {
-    const hydration = createDeferred<void>();
-    hydrateImpl = () => hydration.promise;
-
-    render(
-      <Suspense fallback={<div data-testid="hydrating">hydrating</div>}>
-        <ModernRouterClient router={createRouter('inventory')} />
-      </Suspense>,
-    );
-
-    expect(screen.getByTestId('hydrating')).toBeTruthy();
-    expect(screen.queryByTestId('router-provider')).toBeNull();
-
-    hydration.resolve();
-
-    expect(
-      (await screen.findByTestId('router-provider')).textContent,
-    ).toContain('inventory');
-    expect(screen.queryByTestId('hydrating')).toBeNull();
-  });
-
-  it('reuses one Flight decode while suspended and returns the resolved tree synchronously', async () => {
-    const flight = createDeferred<unknown>();
-    const decodeFlight = rstest.fn(() => flight.promise);
-    createFromReadableStreamImpl = decodeFlight;
-    registeredCallServer = undefined;
-    decoderCallServer = undefined;
-
-    const getTree = createTreeGetterFromFlightStream(
-      new ReadableStream<Uint8Array>(),
-    );
-    const view = (
-      <Suspense fallback={<div data-testid="flight-loading">loading</div>}>
-        <FlightTree getTree={getTree} />
-      </Suspense>
-    );
-    const { rerender } = render(view);
-
-    expect(screen.getByTestId('flight-loading')).toBeTruthy();
-    await waitFor(() => expect(decodeFlight).toHaveBeenCalledTimes(1));
-    expect(registeredCallServer).toBe(decoderCallServer);
-
-    await act(() => rerender(view));
-    expect(screen.getByTestId('flight-loading')).toBeTruthy();
-    expect(decodeFlight).toHaveBeenCalledTimes(1);
-
-    const tree = { label: 'decoded inventory' };
-    await act(async () => {
-      flight.resolve(tree);
-      await flight.promise;
-    });
-
-    expect((await screen.findByTestId('flight-tree')).textContent).toBe(
-      tree.label,
-    );
-    expect(decodeFlight).toHaveBeenCalledTimes(1);
-    expect(getTree()).toBe(tree);
-  });
-
-  it('preserves the original Flight decode rejection for the error boundary', async () => {
-    const flight = createDeferred<unknown>();
-    const failure = new Error('Flight decode failed');
-    const decodeFlight = rstest.fn(() => flight.promise);
-    createFromReadableStreamImpl = decodeFlight;
-    let caughtError: unknown;
-    const errorLog = rstest
-      .spyOn(console, 'error')
-      .mockImplementation(() => undefined);
-
-    try {
-      const getTree = createTreeGetterFromFlightStream(
-        new ReadableStream<Uint8Array>(),
-      );
-      await act(() =>
-        render(
-          <FlightErrorBoundary
-            onError={error => {
-              caughtError = error;
-            }}
-          >
-            <Suspense
-              fallback={<div data-testid="flight-loading">loading</div>}
-            >
-              <FlightTree getTree={getTree} />
-            </Suspense>
-          </FlightErrorBoundary>,
-        ),
-      );
-
-      expect(screen.getByTestId('flight-loading')).toBeTruthy();
-      await waitFor(() => expect(decodeFlight).toHaveBeenCalledTimes(1));
-      await act(async () => {
-        flight.reject(failure);
-        await flight.promise.catch(() => undefined);
-      });
-
-      expect(await screen.findByTestId('flight-error')).toBeTruthy();
-      expect(caughtError).toBe(failure);
-    } finally {
-      errorLog.mockRestore();
-    }
-  });
-});

package/tests/router/dataMutation.test.tsx

@@ -1,428 +0,0 @@
-import { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import React, { act } from 'react';
-import type { Fetcher } from '../../src/runtime/dataMutation';
-import { Form, useFetcher } from '../../src/runtime/dataMutation';
-import { createFormDataFromSubmit } from '../../src/runtime/formData';
-
-type RouteHandler = (args: {
-  request: Request;
-  params: Record<string, string>;
-  context?: unknown;
-}) => Promise<unknown> | unknown;
-
-let currentRouter: any;
-
-rstest.mock('@tanstack/react-router', () => ({
-  useRouter: () => currentRouter,
-}));
-
-function createDeferred<T>() {
-  let resolve!: (value: T | PromiseLike<T>) => void;
-  let reject!: (reason?: unknown) => void;
-  const promise = new Promise<T>((resolvePromise, rejectPromise) => {
-    resolve = resolvePromise;
-    reject = rejectPromise;
-  });
-  return {
-    promise,
-    resolve,
-    reject,
-  };
-}
-
-function createRouter(handler: {
-  action?: RouteHandler;
-  loader?: RouteHandler;
-  invalidate?: () => Promise<void>;
-  params?: Record<string, string>;
-}) {
-  return {
-    buildLocation: ({ to }: { to?: string }) => {
-      const href = typeof to === 'string' ? to : '/';
-      const url = new URL(href, 'http://localhost');
-      return {
-        href: `${url.pathname}${url.search}${url.hash}`,
-        pathname: url.pathname,
-      };
-    },
-    getMatchedRoutes: () => [
-      [],
-      handler.params || {},
-      {
-        options: {
-          staticData: {
-            modernRouteAction: handler.action,
-            modernRouteLoader: handler.loader,
-          },
-        },
-      },
-    ],
-    navigate: rstest.fn(async () => undefined),
-    invalidate: rstest.fn(handler.invalidate || (async () => undefined)),
-  };
-}
-
-function formatFetcherError(error: unknown) {
-  if (error instanceof Error) {
-    return error.message;
-  }
-  if (typeof error === 'string') {
-    return error;
-  }
-  if (error == null) {
-    return '';
-  }
-  return JSON.stringify(error);
-}
-
-describe('tanstack data mutation fetcher', () => {
-  let latestFetcher: Fetcher | undefined;
-  const states: string[] = [];
-
-  function FetcherHarness() {
-    const fetcher = useFetcher();
-    latestFetcher = fetcher;
-
-    React.useEffect(() => {
-      states.push(fetcher.state);
-    }, [fetcher.state]);
-
-    return (
-      <div>
-        <div data-testid="state">{fetcher.state}</div>
-        <div data-testid="data">
-          {fetcher.data === undefined
-            ? 'undefined'
-            : JSON.stringify(fetcher.data)}
-        </div>
-        <div data-testid="error">{formatFetcherError(fetcher.error)}</div>
-      </div>
-    );
-  }
-
-  beforeEach(() => {
-    latestFetcher = undefined;
-    states.length = 0;
-  });
-
-  test.each([
-    { amount: 2, count: 2, method: 'post' as const, name: 'explicit method' },
-    { amount: 1, count: 1, method: undefined, name: 'default method' },
-  ])('tracks submitting/loading phases with the $name', async ({
-    amount,
-    count,
-    method,
-  }) => {
-    const actionResult = createDeferred<Response>();
-    const invalidateResult = createDeferred<void>();
-    const action = rstest.fn(async () => actionResult.promise);
-    const loader = rstest.fn(async () => ({ count: 0 }));
-
-    currentRouter = createRouter({
-      action,
-      loader,
-      invalidate: async () => invalidateResult.promise,
-    });
-
-    render(<FetcherHarness />);
-    expect(screen.getByTestId('state').textContent).toBe('idle');
-
-    let submitPromise: Promise<void> | undefined;
-    act(() => {
-      submitPromise = latestFetcher!.submit(
-        { amount },
-        {
-          ...(method === undefined ? {} : { method }),
-          action: '/mutation',
-        },
-      );
-    });
-
-    await waitFor(() => {
-      expect(screen.getByTestId('state').textContent).toBe('submitting');
-    });
-    expect(action).toHaveBeenCalledTimes(1);
-    expect(loader).not.toHaveBeenCalled();
-
-    actionResult.resolve(
-      new Response(JSON.stringify({ count }), {
-        headers: {
-          'Content-Type': 'application/json',
-        },
-      }),
-    );
-
-    await waitFor(() => {
-      expect(screen.getByTestId('state').textContent).toBe('loading');
-    });
-
-    invalidateResult.resolve();
-
-    await act(async () => {
-      await submitPromise;
-    });
-
-    expect(screen.getByTestId('state').textContent).toBe('idle');
-    expect(screen.getByTestId('data').textContent).toBe(
-      JSON.stringify({ count }),
-    );
-    expect(states).toEqual(['idle', 'submitting', 'loading', 'idle']);
-  });
-
-  test('passes built href and matched route params to mutation actions', async () => {
-    const action = rstest.fn(
-      async ({ request, params }: Parameters<RouteHandler>[0]) => ({
-        params,
-        requestUrl: request.url,
-      }),
-    );
-    currentRouter = createRouter({
-      action,
-      params: { userId: '42' },
-    });
-
-    render(<FetcherHarness />);
-
-    await act(async () => {
-      await latestFetcher!.submit(
-        { amount: 2 },
-        {
-          method: 'post',
-          action: '/users/42?tab=edit#details',
-        },
-      );
-    });
-
-    expect(action).toHaveBeenCalledTimes(1);
-    const actionArgs = action.mock.calls[0][0];
-    const expectedRequestUrl = `${window.location.origin}/users/42?tab=edit#details`;
-    expect(actionArgs.params).toEqual({ userId: '42' });
-    expect(actionArgs.request.url).toBe(expectedRequestUrl);
-    expect(latestFetcher?.data).toEqual({
-      params: { userId: '42' },
-      requestUrl: expectedRequestUrl,
-    });
-    expect(currentRouter.invalidate).toHaveBeenCalledTimes(1);
-  });
-
-  test('surfaces non-2xx action responses as fetcher errors', async () => {
-    const actionResult = createDeferred<Response>();
-    currentRouter = createRouter({
-      action: async () => actionResult.promise,
-    });
-
-    render(<FetcherHarness />);
-
-    let thrownError: unknown;
-    let submitPromise: Promise<void> | undefined;
-    act(() => {
-      submitPromise = latestFetcher!.submit(
-        { amount: 'not-a-number' },
-        { method: 'post', action: '/mutation' },
-      );
-    });
-
-    await waitFor(() => {
-      expect(screen.getByTestId('state').textContent).toBe('submitting');
-    });
-
-    actionResult.resolve(
-      new Response(JSON.stringify({ message: 'invalid amount' }), {
-        status: 422,
-        headers: {
-          'Content-Type': 'application/json',
-        },
-      }),
-    );
-
-    await act(async () => {
-      try {
-        await submitPromise;
-      } catch (error) {
-        thrownError = error;
-      }
-    });
-
-    expect(thrownError).toBeInstanceOf(Error);
-    expect(screen.getByTestId('state').textContent).toBe('idle');
-    expect(screen.getByTestId('error').textContent).toContain('422');
-    expect(currentRouter.invalidate).not.toHaveBeenCalled();
-    expect(states).toEqual(['idle', 'submitting', 'idle']);
-  });
-
-  test('uses loading state for loader fetches', async () => {
-    const loaderResult = createDeferred<{ count: number }>();
-
-    currentRouter = createRouter({
-      loader: async () => loaderResult.promise,
-    });
-
-    render(<FetcherHarness />);
-
-    let submitPromise: Promise<void> | undefined;
-    act(() => {
-      submitPromise = latestFetcher!.submit(
-        {},
-        { method: 'get', action: '/mutation' },
-      );
-    });
-
-    await waitFor(() => {
-      expect(screen.getByTestId('state').textContent).toBe('loading');
-    });
-
-    loaderResult.resolve({ count: 7 });
-
-    await act(async () => {
-      await submitPromise;
-    });
-
-    expect(screen.getByTestId('state').textContent).toBe('idle');
-    expect(screen.getByTestId('data').textContent).toBe('{"count":7}');
-    expect(currentRouter.invalidate).not.toHaveBeenCalled();
-    expect(states).toEqual(['idle', 'loading', 'idle']);
-  });
-
-  test('GET Form navigation replaces action query before hash', async () => {
-    currentRouter = createRouter({});
-
-    render(
-      <Form method="get" action="/products?sort=old#results">
-        <input name="q" defaultValue="boots" />
-        <button type="submit">Search</button>
-      </Form>,
-    );
-
-    const form = document.querySelector('form');
-    expect(form).toBeTruthy();
-
-    await act(async () => {
-      fireEvent.submit(form!);
-    });
-
-    expect(currentRouter.navigate).toHaveBeenCalledWith({
-      href: '/products?q=boots#results',
-    });
-  });
-
-  test('keeps non-idle state while overlapping mutation submits are still active', async () => {
-    const actionResults = [
-      createDeferred<Response>(),
-      createDeferred<Response>(),
-    ];
-    const invalidateResults = [createDeferred<void>(), createDeferred<void>()];
-    let actionCallIndex = 0;
-    let invalidateCallIndex = 0;
-
-    currentRouter = createRouter({
-      action: async () => {
-        const current = actionResults[actionCallIndex];
-        actionCallIndex += 1;
-        return current.promise;
-      },
-      invalidate: async () => {
-        const current = invalidateResults[invalidateCallIndex];
-        invalidateCallIndex += 1;
-        return current.promise;
-      },
-    });
-
-    render(<FetcherHarness />);
-
-    let firstSubmit: Promise<void> | undefined;
-    let secondSubmit: Promise<void> | undefined;
-
-    act(() => {
-      firstSubmit = latestFetcher!.submit(
-        { amount: 1 },
-        { method: 'post', action: '/mutation' },
-      );
-    });
-    await waitFor(() => {
-      expect(screen.getByTestId('state').textContent).toBe('submitting');
-    });
-
-    act(() => {
-      secondSubmit = latestFetcher!.submit(
-        { amount: 2 },
-        { method: 'post', action: '/mutation' },
-      );
-    });
-    await waitFor(() => {
-      expect(screen.getByTestId('state').textContent).toBe('submitting');
-    });
-
-    actionResults[0].resolve(
-      new Response(JSON.stringify({ count: 1 }), {
-        headers: {
-          'Content-Type': 'application/json',
-        },
-      }),
-    );
-    await waitFor(() => {
-      expect(currentRouter.invalidate).toHaveBeenCalledTimes(1);
-      expect(screen.getByTestId('state').textContent).toBe('submitting');
-    });
-
-    invalidateResults[0].resolve();
-    await waitFor(() => {
-      expect(screen.getByTestId('state').textContent).toBe('submitting');
-    });
-
-    actionResults[1].resolve(
-      new Response(JSON.stringify({ count: 3 }), {
-        headers: {
-          'Content-Type': 'application/json',
-        },
-      }),
-    );
-    await waitFor(() => {
-      expect(currentRouter.invalidate).toHaveBeenCalledTimes(2);
-      expect(screen.getByTestId('state').textContent).toBe('loading');
-    });
-
-    invalidateResults[1].resolve();
-    await act(async () => {
-      await Promise.all([firstSubmit, secondSubmit]);
-    });
-
-    expect(screen.getByTestId('state').textContent).toBe('idle');
-    expect(screen.getByTestId('data').textContent).toBe('{"count":3}');
-  });
-
-  test('preserves submitter name value when FormData submitter overload is unavailable', () => {
-    const NativeFormData = globalThis.FormData;
-
-    class SingleArgumentFormData extends NativeFormData {
-      constructor(form?: HTMLFormElement, submitter?: HTMLElement) {
-        if (submitter) {
-          throw new TypeError('FormData submitter overload unavailable');
-        }
-        super(form);
-      }
-    }
-
-    globalThis.FormData = SingleArgumentFormData as typeof FormData;
-
-    try {
-      const form = document.createElement('form');
-      form.innerHTML = `
-        <input name="amount" value="2" />
-        <button type="submit" name="intent" value="save">Save</button>
-      `;
-
-      const submitter = form.querySelector('button');
-      expect(submitter).toBeInstanceOf(HTMLButtonElement);
-
-      const formData = createFormDataFromSubmit({
-        form,
-        submitter,
-      });
-
-      expect(formData.get('amount')).toBe('2');
-      expect(formData.get('intent')).toBe('save');
-    } finally {
-      globalThis.FormData = NativeFormData;
-    }
-  });
-});

package/tests/router/fixtures/router-gen.oxlint.json

@@ -1,5 +0,0 @@
-{
-  "rules": {
-    "no-unused-vars": "error"
-  }
-}