Getting Started

You can follow along with the installation steps below to start a new project, or you can clone the example project here.


Create a new Playwright project (see Playwright documentation)
npm init playwright@latest
Then install @appetize/playwright
npm install @appetize/playwright

Playwright Config

You will need to update playwright.config.ts so that it's configured for Appetize. Update it to the following:
const config = {
testDir: './tests',
outputDir: 'test-results/',
timeout: 120 * 1000,
expect: {
// recommended ratio for screenshot testing
toMatchSnapshot: {
maxDiffPixelRatio: 0.05,
forbidOnly: !!process.env.CI,
retries: process.env.CI ? 3 : 0,
reporter: 'line',
// correlates to number of concurrent Appetize sessions at a time
workers: 1,
fullyParallel: false,
use: {
trace: 'retain-on-failure',
baseURL: '',
// Appetize session configuration
config: {
device: 'iphone14pro',
publicKey: '<PUBLIC KEY>'
export default config;
See Test Configuration for more advanced configurations.


Delete the example test files that Playwright made when you generated the project and instead create an app.spec.ts file in your tests folder with the following contents:
import { test, expect } from '@appetize/playwright'
test('loads the home screen', async ({ session }) => {
await expect(session).toHaveElement({
// replace with text of element that appears on your app
text: 'Welcome',
Once you've updated the test file for your app, run the test with:
npx playwright test --headed
# or, headlessly
npx playwright test