Registry / testing / playwright-performance

playwright-performance

library2.0.6jsnpmunverified

playwright-performance is a plugin for Playwright that enables detailed performance analysis of end-to-end test flows, including UI, API, or hybrid scenarios. It measures the 'apparent response time' of key user procedures within your application, helping identify bottlenecks and areas for optimization. The current stable version is 2.0.6, with recent updates introducing HTML chart generation. The library maintains an active release cadence, with a major breaking change in version 2.x.x simplifying its integration model. Its key differentiator is the seamless integration into Playwright's `test.extend` fixture system, allowing developers to easily add performance sampling to existing tests without significant refactoring, and providing configurable output options for results.

testing

npm install playwright-performance

github ↗package ↗

INSTALL

IMPORT

SIG · PLAYWRIGHT-PERFORM

playwright-performance

testingjavascriptv2.0.6

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

extendPlaywrightPerformance

✓ import extendPlaywrightPerformance from 'playwright-performance';

✗ const extendPlaywrightPerformance = require('playwright-performance');

This is the default export used to extend the Playwright 'test' object. CommonJS 'require()' is not supported since v2.

PlaywrightPerformance

✓ import type { PlaywrightPerformance } from 'playwright-performance';

✗ const PlaywrightPerformance = require('playwright-performance').PlaywrightPerformance;

This type defines the 'performance' fixture added to your extended Playwright test context. It's generally imported as a type.

PerformanceOptions

✓ import type { PerformanceOptions } from 'playwright-performance';

This type defines the configuration options for the performance plugin. It's primarily used for type hints when setting up options.

Demonstrates how to extend Playwright's `test` object with performance fixtures, record startup times for multiple URLs, and assert on individual sample durations within an extended test.

import { test as base, expect } from '@playwright/test'; import extendPlaywrightPerformance, { PerformanceOptions, PlaywrightPerformance } from 'playwright-performance'; // Extend the Playwright test object with performance fixtures const test = base.extend<PlaywrightPerformance, PerformanceOptions>(extendPlaywrightPerformance()); test.describe('Website Startup Performance', () => { test('should load GitHub and SourceForge within acceptable limits', async ({ page, performance }) => { // Sample startup time for GitHub performance.sampleStart('GH-startup'); await page.goto('https://github.com/', { waitUntil: 'domcontentloaded' }); performance.sampleEnd('GH-startup'); // Sample startup time for SourceForge performance.sampleStart('SF-startup'); await page.goto('https://sourceforge.net/', { waitUntil: 'domcontentloaded' }); performance.sampleEnd('SF-startup'); // You can also get individual sample times within the test const githubStartupTime = performance.getSampleTime('GH-startup'); const sourceForgeStartupTime = performance.getSampleTime('SF-startup'); // Assertions for performance metrics expect(githubStartupTime).toBeLessThanOrEqual(5000); // Expect GitHub to load in under 5 seconds expect(sourceForgeStartupTime).toBeLessThanOrEqual(8000); // Expect SourceForge to load in under 8 seconds console.log(`GitHub Startup Time: ${githubStartupTime}ms`); console.log(`SourceForge Startup Time: ${sourceForgeStartupTime}ms`); }); });

Debug

Known issues

breakingVersion 2.x.x introduced significant breaking changes, particularly in how the plugin is imported and used to extend the Playwright `test` object. Existing `require()` statements and older `test.extend` patterns will no longer work.

fix

Migrate to the new ESM-first import syntax (`import extendPlaywrightPerformance, { ... } from 'playwright-performance'`) and update your `test.extend` call as shown in the updated usage documentation for v2.x.x.

affects: >=2.0.2

breakingStarting with version 2.x.x, `playwright-performance` is primarily an ESM module. CommonJS `require()` syntax is no longer supported for importing the plugin.

fix

Ensure your project is configured for ESM, and update all imports to use `import` statements. If you strictly require CommonJS, consider using an older version (pre-2.x.x) or transpiling your code.

affects: >=2.0.2

gotchaDefining the extended `test` object (`const test = base.extend<...>(...)`) directly within each test file can lead to unnecessary setup overhead, redundant code, and potential inconsistencies across tests.

fix

Always define your extended `test` object in a separate, reusable 'test-base' file (e.g., `tests/fixtures/performance-test.ts`) and import it into your individual test files. This ensures consistent fixture application and better maintainability.

affects: >=1.0.0

gotchaBy default, performance results are saved to `performance-results/performance-results.json`. Running multiple test suites or different performance scenarios without configuring unique filenames or directories will overwrite previous results.

fix

Utilize the `performanceResultsDirectoryName` and `performanceResultsFileName` options within `PerformanceOptions` to specify unique output paths for different test runs or scenarios, preventing data loss.

affects: >=1.0.0

Errors

Common errors & fixes

TypeError: playwright_1.test.extend is not a function

This typically occurs if Playwright's 'test' object is not imported correctly, or if an older version of Playwright is used that doesn't support the 'test.extend' pattern with the plugin's structure.

fix

Ensure you are using `import { test as base } from '@playwright/test';` and that your Playwright dependency is up-to-date and compatible with 'playwright-performance' v2.x.x.

Error: Cannot find module 'playwright-performance' or its corresponding type declarations.

The package might not be installed, the import path is incorrect, or your project's TypeScript/module resolution configuration does not properly resolve the package or its types.

fix

Run `npm install playwright-performance --save-dev`. Verify your `tsconfig.json` includes `playwright-performance` in `types` or `typeRoots`, and ensure your environment supports ESM imports correctly, especially for Node.js projects.

Property 'performance' does not exist on type 'TestFixture<{ page: Page; ... }>'

The 'performance' fixture was not correctly added to your Playwright test context, meaning the 'test' object you are importing or using in your test file is not the extended one.

fix

Ensure your test file imports and uses the 'test' object that has been extended by `playwright-performance` (e.g., `import { test } from '../path/to/my-extended-test-base';`) and that 'performance' is destructured in your test function signature: `async ({ page, performance }) => { ... }`.

Upgrade

Version history

2.0.6latest on npm

Audit

Dependencies

@playwright/testrequiredThis package is a plugin that extends Playwright's test runner functionality; it is a peer dependency.

Agent activity

47 hits · last 30 days

node

Bingbot

Resources

githubhttps://github.com/tzurp/playwright-performance ↗

packagehttps://www.npmjs.com/package/playwright-performance ↗