testing

Test components and API routes with everything already wired up.

Developer toolsClient ServerBuilt onVitestTesting Library

Every export of kitr/testing, kitr/testing/react, read from the published type definitions. The guide shows them in use.

kitr/testing

createApp

function createApp(options?: CreateAppOptions): KitrApp;

createTestApp

function createTestApp(options?: CreateAppOptions): Promise<KitrApp>;

A booted app for tests: environment: 'test', your providers and config.

createTestClient

function createTestClient(target: {
  fetch(request: Request): Promise<Response>;
} | string, defaults?: {
  headers?: Record<string, string>;
}): {
  get: <T = unknown>(path: string, init?: {
    headers?: Record<string, string>;
  }) => Promise<TestResponse<T>>;
  post: <T = unknown>(path: string, body?: unknown, init?: {
    headers?: Record<string, string>;
  }) => Promise<TestResponse<T>>;
  put: <T = unknown>(path: string, body?: unknown, init?: {
    headers?: Record<string, string>;
  }) => Promise<TestResponse<T>>;
  patch: <T = unknown>(path: string, body?: unknown, init?: {
    headers?: Record<string, string>;
  }) => Promise<TestResponse<T>>;
  delete: <T = unknown>(path: string, init?: {
    headers?: Record<string, string>;
  }) => Promise<TestResponse<T>>;
};

Request helper for API tests against anything with fetch(request): a kitr server, a Start handler, or a real URL.

TestResponse

interface TestResponse<T = unknown> {
  status: number;
  headers: Headers;
  body: T;
  response: Response;
}

kitr/testing/react

createApp

function createApp(options?: CreateAppOptions): KitrApp;

createTestApp

function createTestApp(options?: CreateAppOptions): Promise<KitrApp>;

A booted app for tests: environment: 'test', your providers and config.

createTestClient

function createTestClient(target: {
  fetch(request: Request): Promise<Response>;
} | string, defaults?: {
  headers?: Record<string, string>;
}): {
  get: <T = unknown>(path: string, init?: {
    headers?: Record<string, string>;
  }) => Promise<TestResponse<T>>;
  post: <T = unknown>(path: string, body?: unknown, init?: {
    headers?: Record<string, string>;
  }) => Promise<TestResponse<T>>;
  put: <T = unknown>(path: string, body?: unknown, init?: {
    headers?: Record<string, string>;
  }) => Promise<TestResponse<T>>;
  patch: <T = unknown>(path: string, body?: unknown, init?: {
    headers?: Record<string, string>;
  }) => Promise<TestResponse<T>>;
  delete: <T = unknown>(path: string, init?: {
    headers?: Record<string, string>;
  }) => Promise<TestResponse<T>>;
};

Request helper for API tests against anything with fetch(request): a kitr server, a Start handler, or a real URL.

renderWithKitr

function renderWithKitr(ui: ReactElement, { app, queryData, wrapper: Extra, ...options }: RenderWithKitrOptions): import("@testing-library/react").RenderResult<typeof import("@testing-library/dom/types/queries"), HTMLElement, HTMLElement>;

Render inside the same providers the app uses, with the query cache pre-seeded. Pass a wrapper to add a router (e.g. RouterProvider with a memory history).

RenderWithKitrOptions

interface RenderWithKitrOptions extends Omit<RenderOptions, 'wrapper'> {
  app: KitrApp;
  /** Seed the query cache: `[[['projects', 'detail', '1'], project]]`. Needs @kitr/query's provider. */
  queryData?: Array<[
    readonly unknown[],
    unknown
  ]>;
  wrapper?: (props: {
    children: ReactNode;
  }) => ReactElement;
}

TestResponse

interface TestResponse<T = unknown> {
  status: number;
  headers: Headers;
  body: T;
  response: Response;
}