Getting Started
You can follow along with the installation steps below to start a new project, or you can clone the example project here.
npm init playwright@latest
Then install
@appetize/playwright
npm install @appetize/playwright
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: 'https://appetize.io',
// Appetize session configuration
config: {
device: 'iphone14pro',
publicKey: '<PUBLIC KEY>'
}
},
}
export default config;
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
Last modified 4mo ago