@gluonjs/test-utils / packages/test-utils/src / FixtureEventRecord

Interface: FixtureEventRecord

Properties

event

readonly event: Event

name

readonly name: string

Example

Represent one captured DOM event with its public name so tests can inspect emitted interaction history:

import { html } from '@gluonjs/core';
import {
  mountComponent,
  renderFixture,
  type ComponentMountOptions,
  type FixtureEventRecord,
} from '@gluonjs/test-utils';

type CounterProps = { count: number; save(value: number): void };
const options = {
  name: 'counter',
  props: { count: 1, save: (value: number) => console.log(value) },
} satisfies ComponentMountOptions<CounterProps>;
const counter = mountComponent(
  ({ count, save }: CounterProps) => html`<button @click=${() => save(count)}>${count}</button>`,
  options,
);
await counter.setProps({ count: 2 });
counter.get<HTMLButtonElement>('button').click();

const event = { name: 'save', event: new CustomEvent('save', { detail: 2 }) } satisfies FixtureEventRecord;
const staticFixture = renderFixture(() => html`<p>${event.name}</p>`);
console.log(counter.text(), staticFixture.text());
staticFixture.cleanup();
counter.cleanup();