playwright-gitlab-ci-cd.md

description	Running Playwright test in parallel using GitLab CI/CD

Quick Start

{% hint style="info" %} TL;DR take a look at the example repository:

https://gitlab.com/currents.dev/gitlab-playwright-currents {% endhint %}

The example .gitlab-ci.yml file creates a GitLab CI pipeline with 3 workers using 3 Playwright Shards:

# .gitlab-ci.yml
default:
  image: space.vars.PW_IMAGE_ROUTE + ":" + space.vars.LATEST_PW_IMAGE_VERSION

stages:
  - test

test:
  image: space.vars.PW_IMAGE_ROUTE + ":" + space.vars.LATEST_PW_IMAGE_VERSION
  stage: test
  parallel: 3

  script:
    - npm ci
    - npx playwright install
    - cd ./basic
    - npx pwc --key $CURRENTS_RECORD_KEY --project-id bnsqNa --shard=$CI_NODE_INDEX/$CI_NODE_TOTAL

Running 3 parallel jobs Playwright jobs in GitLab CI

Setup

• Create an account at https://app.currents.dev and grab the Project ID and Record Key.
• Add CURRENTS_RECORD_KEY as GitLab CI/CD Secrets (make sure it's not protected)

Additional resources:

• Playwright Features on Currents: https://currents.dev/playwright
• Integration Documentation: https://currents.dev/readme/integration-with-playwright/currents-playwright
• CI Build ID Guide: https://currents.dev/readme/guides/cypress-ci-build-id

GitLab CI Playwright Results

The results are being reported to Currents for more efficient troubleshooting, and monitoring test suite flakiness and performance.

Currents will collect the following information:

• console output
• screenshots
• videos
• trace files
• timing
• outcomes
• flaky tests
• error details
• tags for more convenient management of the tests

GitLab Merge Request Notes

Take a look at the example merge request: https://gitlab.com/currents.dev/gitlab-playwright-currents/-/merge_requests/3

When GitLab integration is enabled, Currents will post a Merge Commit note with run results:

Currents Merge Request Notes

In addition, Currents will post an External Status check for every Playwright project configured. For example:

Example of GitLab CI External Status Check