---
title: Cypress and Chrome DevTools in the cloud
description: Learn how to run Cypress tests that have been recorded with Chrome DevTools.
source_url:
  html: https://testingbot.com/support/web-automate/cypress/devtools
  md: https://testingbot.com/support/web-automate/cypress/devtools/index.md
---
# Run Cypress tests recorded with Chrome DevTools

Chrome allows you to record your actions and generate scripts, all through Chrome DevTools. **Recorder** is a feature that can record (and replay) actions you make during a browser session.

Various export formats are supported by **Recorder** , including the ability to export as a Cypress test script.

## Requirements

Before you can get started, make sure to follow these requirements:

- You need to be using Chrome 89 or higher. Previous versions do not come with the **Recorder** feature. 
- Install the Chrome Extension [Cypress Chrome Recorder](https://chrome.google.com/webstore/detail/cypress-chrome-recorder/fellcphjglholofndfmmjmheedhomgin/related)
- TestingBot's Cypress CLI is installed, through [npm install testingbot-cypress-cli](https://testingbot.com/support/web-automate/cypress#install). 

## Record your actions in Chrome

### Enable Recorder in Chrome

First, we'll need to enable the recorder in Chrome. Please follow these steps:

1. Open Chrome and click the **More options** icon, then select **Developer Tools** from the More Tools option. 
2. Once you're in the Developer Tools, click the **More options** (a vertical ellipses icon) and select **Recorder** from the **More Tools** option. 
3. A Recorder tab will appear, with a button **Create a new recording**. You are now ready to start recording. 

### Record Actions in Chrome

We can now start recording a user flow in Chrome. Proceed with the following steps to start recording.

1. In **Recorder** , click the **Start new recording** button. 
2. Enter a name in the **RECORDING NAME** input field. 
3. Click the **Start a new recording** button at the bottom of the panel. 
4. Perform various actions in Chrome while the recorder is running. 
5. When you are finished, click the **End recording** button. 

### Export recorded Actions

Click the **Export** icon and select the **Export as a Cypress Test script** option. Save the exported file to your local disk, in a file called **cdp-testingbot.cy.js** in a folder **cypress/e2e/**. It should contain code similar to the code below.

    describe("cdp-testingbot", () => {
      it("test with cdp on testingbot", () => {
        cy.viewport(1280, 824);
        cy.visit("https://testingbot.com/");
      });
    });

Next, create a file **cypress.config.js** with the following content:

    module.exports = {
      'projectId': '4b7344',
      e2e: {},
    }

## Run the recorded Cypress actions on TestingBot

To start running the test on TestingBot, you first need to create a `testingbot.json` file.

    $ testingbot-cypress init

Please add the `key` and `secret` you obtained from the TestingBot [member dashboard](https://testingbot.com/members/user/edit) in the `testingbot.json` file.

Before you can run your tests, you need to specify on which browser (version) and platform you'd like to test.

You can specify the browsers you want to use in the `testingbot.json` file:

    {
        "auth": {
            "key": "TESTINGBOT_KEY",
            "secret": "TESTINGBOT_SECRET"
        },
        "browsers": [
            {
    	        "browserName": "chrome",
    	        "platform": "WIN10",
    	        "version": "latest"
    	    }
        ],
        "run_settings": {
            "cypress_project_dir": "folder-here",
            "build_name": "cypress-recorded-actions",
            "npm_dependencies": {},
            "package_config_options": {},
            "realTimeLogs": true
        }
    }

Make sure to change the **cypress\_project\_dir** to the folder that contains your **cypress.config.js** file.

Next, you can start running the tests.

    $ testingbot-cypress run

Test results will appear in your console and on the [TestingBot dashboard](https://testingbot.com/members).

Was this page helpful? Yes No 

## Looking for More Help?

Have questions or need more information?   
 You can reach us via the following channels:

- [Email us](https://testingbot.com/contact/new)
- [Join our Slack Channel](https://join.slack.com/t/testingb0t/shared_invite/zt-3bcw9xch-jk19~6XPs_xBrsAgAedkCw)
