{"id":15102669,"url":"https://github.com/ntrotner/playwright-performance-reporter","last_synced_at":"2026-03-05T00:10:48.012Z","repository":{"id":252999118,"uuid":"842179197","full_name":"ntrotner/playwright-performance-reporter","owner":"ntrotner","description":"Report performance metrics by test step as an structured output ","archived":false,"fork":false,"pushed_at":"2026-02-28T19:55:29.000Z","size":862,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2026-02-28T22:53:47.224Z","etag":null,"topics":["e2e","performance","playwright","playwright-typescript","reporter","typescript"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/playwright-performance-reporter","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ntrotner.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":".github/CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2024-08-13T20:44:30.000Z","updated_at":"2026-02-28T19:54:47.000Z","dependencies_parsed_at":"2024-08-15T23:50:29.862Z","dependency_job_id":"4d7a7da4-d066-40a8-a6c0-e12e93b95b32","html_url":"https://github.com/ntrotner/playwright-performance-reporter","commit_stats":{"total_commits":12,"total_committers":1,"mean_commits":12.0,"dds":0.0,"last_synced_commit":"6af1478778e41a4fdb82073b41ba030b8b065cda"},"previous_names":["ntrotner/playwright-performance-reporter"],"tags_count":33,"template":false,"template_full_name":null,"purl":"pkg:github/ntrotner/playwright-performance-reporter","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ntrotner%2Fplaywright-performance-reporter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ntrotner%2Fplaywright-performance-reporter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ntrotner%2Fplaywright-performance-reporter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ntrotner%2Fplaywright-performance-reporter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ntrotner","download_url":"https://codeload.github.com/ntrotner/playwright-performance-reporter/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ntrotner%2Fplaywright-performance-reporter/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30102192,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-04T23:59:36.199Z","status":"ssl_error","status_checked_at":"2026-03-04T23:56:48.556Z","response_time":59,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["e2e","performance","playwright","playwright-typescript","reporter","typescript"],"created_at":"2024-09-25T19:04:15.454Z","updated_at":"2026-03-05T00:10:47.983Z","avatar_url":"https://github.com/ntrotner.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# playwright-performance-reporter\n[![Release](https://github.com/ntrotner/playwright-performance-reporter/actions/workflows/release.yml/badge.svg)](https://github.com/ntrotner/playwright-performance-reporter/actions/workflows/release.yml)\n[![codecov](https://codecov.io/github/ntrotner/playwright-performance-reporter/graph/badge.svg?token=3UGRT92UT9)](https://codecov.io/github/ntrotner/playwright-performance-reporter)\n[![version](https://img.shields.io/npm/v/playwright-performance-reporter.svg?style=flat-square)](https://www.npmjs.com/package/playwright-performance-reporter)\n\n\u003e Collect performance metrics from the browser dev tools during playwright test execution\n\n\u003e [!CAUTION]\n\u003e This library is work in progress. The measurement is limited to Chromium.\n\u003e On the long run the goal is to\n\u003e - Support Firefox and Webkit\n\u003e - Useful amount of metrics to choose from\n\u003e - Insightful visualization of the results\n\n## Install\n\n```bash\nnpm install playwright-performance-reporter --save-dev\n```\nor\n```bash\nyarn add playwright-performance-reporter --dev\n```\n\n## Usage\n\nDisable parallelism:\n```ts\nexport default defineConfig({\n  ...\n  fullyParallel: false,\n  workers: 1,\n  ...\n})\n```\n\n\n### Setup Reporter\nTo register the reporter, include the code blow in your playwright config.\nPlease see the subsections for more details about browser specific cases and advanced configurations.\n\n\n```ts\nimport type { CDP, Options, Metric } from 'playwright-performance-reporter';\nimport { nativeChromiumObservers } from 'playwright-performance-reporter';\n\nconst PlaywrightPerformanceReporterOptions: Options = {\n  outputDir: '/your/path/to/dir',\n  outputFile: `${Date.now()}.json`,\n  deleteOnFailure: false,\n  browsers: {\n    chromium: {\n      onTestStep: {\n        metrics: [new nativeChromiumObservers.allPerformanceMetrics()],\n      }\n    }\n  }\n}\n\nexport default defineConfig({\n  ...\n  reporter: [\n    ['playwright-performance-reporter', PlaywrightPerformanceReporterOptions]\n  ],\n  ...\n});\n```\n\n### Chromium\n\nFollowing metrics are supported out of the box:\n- usedJsHeapSize\n- totalJsHeapSize\n- allPerformanceMetrics\n- heapDump\n- heapProfilerSampling\n\nThe `MetricsEngine` relies on the [Chrome DevTool Protocol (CDP)](https://chromedevtools.github.io/devtools-protocol/),\nwhich can be accessed through HTTP and WebSocket. To allow for a connection, make sure to expose a port for the remote debugging.\nThe reporter will try to extract that port during start-up.\n\n#### Setup Browser\n```ts\n{\n  name: 'chromium',\n  use: {\n      ...devices['Desktop Chrome'],\n    launchOptions: {\n      args: [\n        '--remote-debugging-port=9222'\n      ]\n    }\n  }\n},\n```\n\n## Advanced Configurations\n\n### Sampling\nRelying solely on the start and stop metric in a long running step leads to inaccuracies and\nrequires a large set of runs to have a meaningful amount of metrics.\nBy registering a metric to be collected every `samplingTimeoutInMilliseconds` the sampling output will\nbe written to `samplingMetrics`, similar to `startMetrics` or `startMetrics`.\n\n```ts\nimport { nativeChromiumObservers } from 'playwright-performance-reporter';\n\nconst PlaywrightPerformanceReporterOptions: Options = {\n  ...\n  browsers: {\n    chromium: {\n      onTestStep: {\n        metrics: [new nativeChromiumObservers.usedJsHeapSize(), new nativeChromiumObservers.totalJsHeapSize()],\n      },\n      sampling: {\n        metrics: [\n          {\n            samplingTimeoutInMilliseconds: 1000,\n            metric: new nativeChromiumObservers.totalJsHeapSize()\n          }\n        ]\n      }\n    }\n  }\n}\n```\n\n### Custom Metric Observer\nIf you want to extend it with custom metrics, you can create a new class that implements the `MetricObserver` interface.\nPlease see the example below how to use it, or checkout the [allPerformanceMetrics](src/browsers/chromium/observers/all-performance-metrics.ts) implementation.\n\nFor ease of implementation, the passed object can implement the interface `MetricObserver`.\nBy using custom metrics it's possible to make observers stateful and e.g. make the next output dependent on the previous one.\n\n```ts\nimport type { MetricObserver, Options } from 'playwright-performance-reporter';\n\nclass NewMetric implements MetricObserver {\n  ...\n}\n\nconst PlaywrightPerformanceReporterOptions: Options = {\n  outputDir: '/your/path/to/dir',\n  outputFile: 'output.json',\n  deleteOnFailure: false,\n  browsers: {\n    chromium: {\n      onTestStep: {\n        metrics: [new NewMetric()]\n      }\n    }\n  }\n}\n```\n\n### Custom JSON Writer\nThe output is sent in chunks to the output file one defined in the options.\nIf there is a need to provide a custom writer, then the `customJsonWriter` is of help to customize how the chunks are handled.\nIn the beginning the `initialize` function is called with the options dedicated for the writer.\nEvery new entry is sent to the `write` function. Once the test is complete `close` is called.\nIn case the test failed and `deleteOnFailure === true`, then the `delete` function is called.\n\n```ts\nimport type { JsonWriter } from 'playwright-performance-reporter';\n\nclass CustomJsonWriter implements JsonWriter {\n  ...\n}\n\nconst PlaywrightPerformanceReporterOptions: Options = {\n  outputDir: '/your/path/to/dir',\n  outputFile: 'output.json',\n  deleteOnFailure: true,\n  customJsonWriter: new CustomJsonWriter(),\n  ...\n}\n```\n\n\n## Output\n\nThe top level is hooked into `test()`.\n\n\n```json\n{\n  ...\n  \"4dde6239d9ac8c9468f3-82e3094b06379c51b729\": {\n    \"TEST_CASE_PARENT\": {\n      \"name\": \" \u003e chromium \u003e scenarios/profile.spec.ts \u003e Profile\",\n      ...\n    }\n    ...\n  }\n  ...\n}\n```\n\nThe content consists of steps of the test suite.\nPlease keep in mind that the metric request is async and is not awaited by\nPlaywright. This means that the browser API might still in the process of collecting the metrics,\neven though Playwright instructed the browser to continue to the next step. This could lead to wrong output.\nTo check if the output is invalid, the values `startMeasurementOffset` and `endMeasurementOffset` are provided, which measure\nthe time delta in milliseconds between the request until the browser provides all metrics.\n\nCheck [example/](example/) for the real-world setup.\n\nSee [example/example-output.json](example/example-output.json) for detailed reporter output.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fntrotner%2Fplaywright-performance-reporter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fntrotner%2Fplaywright-performance-reporter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fntrotner%2Fplaywright-performance-reporter/lists"}