Playwright Component Testing for Solid
npm install @sand4rt/experimental-ct-solid> Note
> The API has been designed to closely resemble Playwright's API wherever applicable. This library is _(without guarantee)_ aimed at facilitating a smooth transition once Playwright offers official support for Solid component testing.
- Run tests fast, in parallel and optionally over multiple machines with sharding or Azure's Testing Service.
- Run the test headless or headed accross multiple _real_ desktop and/or mobile browser engines.
- Full support for shadow DOM, multiple origins, (i)frames, browser tabs and contexts.
- Minimizes flakyness, due to auto waiting, web first assertions and ensures that every test runs in full isolation.
- Advanced emulation capabilities such as modifying screen size, geolocation, color scheme and the network.
- Interactions with the components are indistinguishable from real user behavior.
- Visual regression / screenshot testing.
- Zero-configuration TypeScript support.
Along with all these ✨ awesome capabilities ✨ that come with Playwright, you will also get:
- Watch mode _(BETA)_.
- Visual Studio Code intergration.
- UI mode for debuging tests with a time travel experience complete with watch mode.
- Playwright Tracing for post-mortem debugging in CI.
- Playwright Test Code generation to record and generate tests suites.
Initialize Playwright Solid component testing with PNPM, NPM or Yarn and follow the installation steps:
``sh`
pnpm create playwright-sand4rt --ct`sh`
npm init playwright-sand4rt@latest -- --ct`sh`
yarn create playwright-sand4rt --ct
Now you can start creating your tests:
`ts
// button.tsx
type ButtonProps = {
title: string;
}
export function Button(props: ButtonProps) {
return
}
`
`jsx
// button.test.tsx
import { test, expect } from '@sand4rt/experimental-ct-solid';
import { Button } from './components/button';
test('render props', async ({ mount }) => {
const component = await mount();
await expect(component).toContainText('Submit');
});
``
See the official playwright component testing documentation and the tests for more information on how to use it.