Recording and Uploading your CI replays

We recommend running your tests with linux using Replay Chromium in CI.

The steps may be different depending on how you run tests in CI, so pick one of the options below that best applies to you.

Using GitHub Actions with `cypress-io/github-action`

If you’re already using the Cypress’s @cypress-io/github-action, simply add the two lines below:

yaml
- name: Cypress run
  uses: cypress-io/github-action@v5
	with:
		# 🙋‍♂️ Specify Replay Chromium
    browser: "Replay Chromium"
	env: 
		# 🙋‍♂️ Add these environment variable
		RECORD_REPLAY_METADATA_FILE: /tmp/replay-metadata
    RECORD_REPLAY_DISABLE_ASSERTS: 1
    RECORD_REPLAY_DISABLE_SOURCEMAP_COLLECTION: 1

Add a new step to run after this Cypress GitHub Action for uploading the replays:

yaml
- name: Upload replays
	if: always()
	uses: replayio/action-upload@v0.4.6
	with:
	  api-key: ${{ secrets.RECORD_REPLAY_API_KEY }}

Lastly, add your API key to your Secrets. To get an API key, create a new Replay team and generate an API key — instructions can be found here.

⚠️

If you run into any problems, consult our troubleshooting guide here.

Using GitHub Action without `cypress-io/github-action`

If you’re using GitHub Actions and running tests by calling a script, but aren’t using Cypress’s @cypress-io/github-action, create a similar script in package.json like this:

json
"scripts": {
  "cy:run": "cypress run", // original test script
	"cy:run:replay": "cypress run --browser='Replay Chromium'" // new test script
}

Use that new test script instead in your current workflow file, and add the environment variable(s):

yaml
- name: Cypress run
  #	run: npm run cy:run 
	run: npm run cy:run:replay
	env: 
		# 🙋‍♂️ Add this environment variable
		RECORD_REPLAY_METADATA_FILE: /tmp/replay-metadata
    RECORD_REPLAY_DISABLE_ASSERTS: 1
    RECORD_REPLAY_DISABLE_SOURCEMAP_COLLECTION: 1

Add a new step to run after this Cypress GitHub Action for uploading the replays:

yaml
- name: Upload replays
	if: always()
	uses: replayio/action-upload@v0.4.6
	with:
	  api-key: ${{ secrets.RECORD_REPLAY_API_KEY }}

Lastly, add your API key to your Secrets. To get an API key, create a new Replay team and generate an API key — instructions can be found here.

⚠️

If you run into any problems, consult our troubleshooting guide here.

Using other CI providers

Make sure you have an existing npm install or yarn command to install project dependencies:

bash
npm install
# or
yarn

Create another test script in package.json for running tests with Replay, and replace your current test script in your CI workflow file:

json
"scripts": {
  "cy:run": "cypress run", // original test script
	"cy:run:replay": "cypress run --browser='Replay Chromium'" // new test script
}

Lastly, add a new step in the workflow for uploading the replays once they’re generated. Run the scripts below, providing your own API key:

bash
npm i -g @replayio/replay
replay metadata --init --keys source --warn
replay upload-all --api-key <api key>

Lastly, add your API key to your Secrets. To get an API key, create a new Replay team and generate an API key — instructions can be found here.

⚠️

If you run into any problems, consult our troubleshooting guide here.

Using GitHub Actions with cypress-io/github-action

Using Github Actions without cypress-io/github-action

Using other CI providers

Troubleshooting guide Generating a team API key

Recording and Uploading your CI replays

Using GitHub Actions with cypress-io/github-action

Using GitHub Action without cypress-io/github-action

Using other CI providers

Using GitHub Actions with `cypress-io/github-action`

Using GitHub Action without `cypress-io/github-action`