Level up your Playwright E2E tests

Add @artilleryio/playwright-reporter to your Playwright project to get:

• Cloud dashboard for Playwright test reports
• Real-time reporting with screenshots, traces, and attachments
• Automatic tracking of Web Vitals performance metrics
• Debug CI failures with traces
• GitHub Actions integration with PR comments

Get started with a free Artillery Cloud account at https://app.artillery.io

Learn more

• Installation
• GitHub Actions
• Performance Tracking
• Screenshots
• Current limitations

Usage

Install the reporter

Add @artilleryio/playwright-reporter to your project as a dev dependency:

npm install -D @artilleryio/playwright-reporter

Enable the reporter

Enable the reporter in your Playwright config (playwright.config.ts):

const config: PlaywrightTestConfig = {
  reporter: [
    ['@artilleryio/playwright-reporter', { name: 'My Test Suite' }],
  ],
  // ... rest of your config
};

[!NOTE] Upgrading from an earlier version of the reporter? The blob reporter is no longer required to use @artilleryio/playwright-reporter. You can remove it from the list of reporters in your config.

Set your Artillery Cloud API key

Sign up for Artillery Cloud (it's free) and create an API key: https://app.artillery.io/settings/api-keys.

Then export your ARTILLERY_CLOUD_API_KEY:

export ARTILLERY_CLOUD_API_KEY=a9_your_api_key

Run your Playwright tests

npx playwright test

When the test starts the reporter will print the URL of the test run to the console. The URL will look like this:

https://app.artillery.io/b9j745e5cx4yrxcrb4qwpfty7p8r3/playwright/pwzxhq_abcdefabcdefghi_7atf

You can track the progress of the test run in real time in Artillery Cloud, with screenshots and traces for each test.

GitHub Actions

When the reporter is used in a GitHub Actions workflow, it can post comments to the PR with the test results. To enable PR comments, set GITHUB_TOKEN environment variable in your GitHub Actions job that runs Playwright tests:

jobs:
  test:
    steps:
      - uses: actions/checkout@v4
        with:
          fetch-depth: 0

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: '22'
          cache: 'npm'

      - name: Run Playwright tests
        env:
          ARTILLERY_CLOUD_API_KEY: "${{ secrets.ARTILLERY_CLOUD_API_KEY }}" # API key to send results to Artillery Cloud
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} # Enable PR comments
        run: npx playwright test

Performance tracking with Web Vitals (experimental)

You can configure your tests to track Web Vitals automatically for every page in your tests (LCP, CLS, FCP, TTFB, and INP).

To enable performance tracking, use the withPerformanceTracking() method to extend Playwright's built-in test function:

// Rename the "test" import from @playwright/test to "base":
import { test as base } from '@playwright/test';
// Import the withPerformanceTracking function:
import { withPerformanceTracking } from '@artilleryio/playwright-reporter';

// Extend the base test function with performance tracking. This needs to be at the top before using test()
const test = withPerformanceTracking(base);

// The rest of your tests remain the same, e.g.:

test('has title', async ({ page }) => {
  await page.goto('https://playwright.dev/');
  await expect(page).toHaveTitle(/Playwright/);
});

Screenshots

| Report overview | Debug errors | |---|---| | | |

Current limitations

• Tests running in sharded mode are not fully supported yet. Each run will produce multiple partial reports in Artillery Cloud, one per shard. We'll be releasing full support for sharded runs soon.

Roadmap

These are some of the things we're actively working on. If you have feature requests or ideas, let us know on [email protected].

• Full support for sharded test runs
• Better GitHub Actions integration

License

Artillery Cloud Playwright reporter is licensed under the FSL-1.1-ALv2 Fair Source License. See the LICENSE.txt file for details.