59 lines
2.5 KiB
Markdown
59 lines
2.5 KiB
Markdown
# test-wrap
|
|
|
|
<!-- begin:auto-docs -->
|
|
_(no submodules)_
|
|
<!-- end:auto-docs -->
|
|
|
|
## Purpose
|
|
|
|
Internal test helper consumed only by the Wave 2 form `.test.tsx` files in `src/components/<form>/`. The helper wraps a node in every provider the forms need to mount inside a happy-dom environment: `<MemoryRouter>`, `<TranslationProvider>`, and `<ThemeProvider>`. Without these providers, `@suaveplan/react-ui` primitives (which the forms compose) throw `react-ui.use_themed_variants.no_provider` and `react-i18n` `useTranslation()` panics on first render. The helper centralises the wrap so every form test mounts under the same conditions.
|
|
|
|
## Features
|
|
|
|
- Single `wrapForm(node)` function returning a fully-wrapped `ReactElement`.
|
|
- A module-scope `createI18n` call that yields an empty-message i18n instance — the tests assert against the form's own translation defaults rather than catalog lookups, so an empty catalog is correct.
|
|
- Uses Wave 1's `@suaveplan/react-ui`'s `lightTheme` via the dedicated subpath export so the theme bundle is the same one production callers ship.
|
|
- Renders inside a `<MemoryRouter>` because every form ships at least one `<Link>` to `/auth/login` / `/auth/register`.
|
|
|
|
## Usage: Basic
|
|
|
|
```tsx
|
|
import { render } from "@testing-library/react";
|
|
import { wrapForm } from "../test-wrap.js";
|
|
import { LoginForm } from "./login-form.js";
|
|
|
|
const { getByLabelText } = render(
|
|
wrapForm(<LoginForm onSubmit={async () => {}} />)
|
|
);
|
|
```
|
|
|
|
## Usage: Advanced
|
|
|
|
Pass any node — including nested fragments and arrays — and the wrap is the same:
|
|
|
|
```tsx
|
|
import { wrapForm } from "../test-wrap.js";
|
|
import { LoginForm, RegisterForm } from "@suaveplan/react-auth";
|
|
|
|
render(
|
|
wrapForm(
|
|
<>
|
|
<LoginForm onSubmit={async () => {}} />
|
|
<RegisterForm onSubmit={async () => {}} />
|
|
</>
|
|
)
|
|
);
|
|
```
|
|
|
|
## API Reference
|
|
|
|
### `wrapForm(node: ReactNode): ReactElement`
|
|
|
|
Returns the input node wrapped in `<MemoryRouter><TranslationProvider><ThemeProvider>{node}</ThemeProvider></TranslationProvider></MemoryRouter>`.
|
|
|
|
## Implementation Notes
|
|
|
|
- Not exported from the package root barrel — `wrapForm` is internal test plumbing only.
|
|
- Excluded from coverage via `vitest.config.ts` (`exclude: ["src/components/test-wrap.tsx"]`) so it does not skew the 100/100/100/100 threshold.
|
|
- The empty `messages` map on the i18n instance keeps tests deterministic — every translation lookup returns its key, and the forms supply their own English defaults via the `translations` prop.
|