Import from:
1import { TestUtils } from "@reface/recast/test-utils";
Test utilities for Recast components and elements.
Basic Usage
1import { TestUtils } from "@reface/recast/test-utils";
2
3const utils = new TestUtils();
4
5// Test template rendering
6utils.assertRender(
7 ​div({ class: "container" })`Content`,
8 ​'<div class="container">Content</div>'
9);
Configuration
TestUtils can be configured with plugins:
1import { StyledPlugin } from "@reface/styled";
2
3const utils = new TestUtils({
4 ​plugins: [new StyledPlugin()],
5});
Testing Different Syntaxes
1// JSX Syntax
2utils.assertRender(
3 ​<div class="container">
4 ​ ​<h1>Title</h1>
5 ​ ​<p>Content</p>
6 ​</div>,
7 ​'<div class="container"><h1>Title</h1><p>Content</p></div>'
8);
9
10// Template Literal Syntax
11utils.assertRender(
12 ​html` <div class="container">${h1`Title`} ${p`Content`}</div> `,
13 ​'<div class="container"><h1>Title</h1><p>Content</p></div>'
14);
15
16// Mixed Syntax
17utils.assertRender(
18 ​<Layout title="My Page">
19 ​ ​<Content />${div({ class: "dynamic" })`Dynamic Content`}
20 ​</Layout>,
21 ​"..."
22);
Debug Output
When assertion fails, TestUtils provides detailed logging:
1// On failure outputs:
2// Render assertion failed:
3// Expected: <expected HTML>
4// Received: <actual HTML>
5// Render log: <detailed render process log>