web-renderer-test

SKILL.md

Visual snapshot testing for web renderer components using vitest fixtures.

Create test fixtures in packages/web-renderer/src/test/fixtures that define a React component, dimensions, frame rate, and duration

Register fixtures in packages/web-renderer/src/test/Root.tsx to enable preview functionality

Write test cases that render stills using renderStillOnWeb() and validate output with testImage() snapshot comparison

Run tests with bunx vitest src/test/video.test.tsx and update documentation in limitations.mdx when adding new supported properties

The web renderer is in packages/web-renderer and the test suite is in packages/web-renderer/src/test.

It uses visual snapshot testing using vitest. A test file can for example be executed using:

bunx vitest src/test/video.test.tsx

Example

Each test is powered by a fixture in packages/web-renderer/src/test/fixtures.
A fixture looks like this for example:

import {AbsoluteFill} from 'remotion';