@gluonjs/test-utils / packages/test-utils/src/ssr / hydrateSsrFixture

Function: hydrateSsrFixture()

hydrateSsrFixture<Hydrated>(server, options): Promise<HydratedSsrFixture<Hydrated>>

Installs one server result into a real document and hydrates it through the caller's public application boundary.

Type Parameters

Hydrated

Hydrated

Parameters

server

SsrFixture

options

HydrateSsrFixtureOptions<Hydrated>

Returns

Promise<HydratedSsrFixture<Hydrated>>

Example

Install one complete SSR response in a real document and invoke the application's public hydration boundary:

import type { SsrRequestResult } from '@gluonjs/ssr';
import {
  activeSsrFixtureNames,
  assertNoSsrFixtureLeaks,
  cleanupSsrFixtures,
  hydrateSsrFixture,
  renderSsrFixture,
  type HydratedSsrFixture,
  type HydrateSsrFixtureOptions,
  type HydrationFixtureContext,
  type RenderSsrFixtureOptions,
  type SsrFixture,
} from '@gluonjs/test-utils/ssr';

async function verifyShopRequest(render: () => Promise<SsrRequestResult>) {
  const renderOptions = { name: 'shop-product' } satisfies RenderSsrFixtureOptions;
  const server: SsrFixture = await renderSsrFixture(render, renderOptions);
  const options = {
    hydrate: async (context: HydrationFixtureContext) => ({
      retained: context.container.querySelector('#product-title') !== null,
    }),
    dispose: () => undefined,
  } satisfies HydrateSsrFixtureOptions<{ retained: boolean }>;
  const fixture: HydratedSsrFixture<{ retained: boolean }> = await hydrateSsrFixture(server, options);
  console.log(server.contains('Orbit Lamp'), fixture.hydrated.retained, activeSsrFixtureNames());
  await fixture.cleanup();
  await cleanupSsrFixtures();
  assertNoSsrFixtureLeaks();
}
void verifyShopRequest;