Sure, you can get the same output (screenshot, video, trace.zip file) on the HTML reporter in GitLab's CI/CD pipeline as you do locally with Playwright. Here's how to do it:
First, you need to add a step in your GitLab CI/CD pipeline configuration file (
.gitlab-ci.yml) to install Node.js using the NodeTool task:
stages: - test test: stage: test image: node:lts script: - npm install --global npx - npx playwright install-deps
Next, add a step to run your Playwright tests using the
npx playwright test command:
test: stage: test image: node:lts script: - npm install --global npx - npx playwright install-deps - npx playwright test --project=$(project) --shard=$(shardIndex)/$(shardTotal)
Remember to customize this command based on your specific project setup.
To generate and view trace files in the HTML reporter within GitLab's CI/CD pipeline, you need to:
Start and stop tracing within your Playwright tests using the
browserContext.tracing.stop methods. Save the generated trace file to a location accessible within your CI/CD pipeline.
Use GitLab's artifact upload feature to upload the generated trace file as an artifact. Then, you can download and view the traces from within GitLab's UI.
That's it! Now, Playwright should generate the same output (screenshots, videos) as it does locally when running tests. For more details on how to optimize your Playwright tests, check out Tips for Writing Efficient Playwright Test Scripts.
If you still have questions, please ask a question and I will try to answer it.
Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email email@example.com.