Run your first Cypress test with Automate Turboscale

Install the latest version of the browserstack-cypress-cli npm package

Install the BrowserStack CLI. Use the npm command to install the BrowserStack - Cypress CLI as shown below:

# Install the BrowserStack Cypress CLI
npm install -g browserstack-cypress-cli

Clone the Kitchen Sink app

Clone the sample application using the following command:

# Clone the Kitchen Sink repo for Cypress v10 and higher
git clone https://github.com/cypress-io/cypress-example-kitchensink.git && cd cypress-example-kitchensink

After you clone the repository, the Cypress project will be in the following structure:

app
...
cypress
|-- fixtures
|-- e2e
|-- support
cypress.config.js
...

Install node modules

Use the npm command to install dependent node modules required to run the Kitchen Sink example app:

npm install

Create the configuration file

Create and configure the browserstack.json file which contains configurations, such as BrowserStack credentials, capabilities, etc., that are required for running the tests. Use the following init command to initialize the app project folder and create a boilerplate browserstack.json file:

browserstack-cypress init

After the browserstack.json file is created, modify or add the mandatory configurations that are required to run the Cypress test as shown in the following sample code. The mandatory configurations are BrowserStack credentials, Turboscale parameters, Cypress configuration file, browser-device combinations, and the number of parallels:

// browserstack.json

{
  "auth": {
    "username": "YOUR_USERNAME",
    "access_key": "YOUR_ACCESS_KEY"
  },
  "browsers": [{
      "browser": "chrome",
            "os": "windows",
            "versions": ["latest"]
    } 
  ],
  "run_settings": {
        "cypress_config_file": "./cypress.config.js",
        "project_name": "new-project",
        "build_name": "new-build",
        "exclude": [],
        "parallels": "2",
        "npm_dependencies": {
            "react": "^18.2.0",
            "react-dom": "^18.2.0",
            "react-modal": "^3.16.1",
            "react-router-dom": "^6.15.0"
        },
        "record": true,
        "record-key": "87b774c4-a373-43fa-986e-0833a55dc6d7",
        "projectId": "2m6i88",
        "package_config_options": {},
        "headless": true,
        "turboScale": true,
        "turboScaleOptions": {
            "gridName": "turboscale-trial-grid"
        }
    },
    "disable_usage_reporting": true
}

In the above sample code snippet, the following parameters are mandatory for the test to run:

• username, access_key
• browser, os
• record-key, projectId, turboScale

Set up the application server.

Run the Kitchen sink sample app using the Cypress Kitchen Sink sample app public URL.

In your IDE, open the Kitchen Sink App project.

Replace URLs

Search the project for http://localhost:8080, and then replace all instances with https://example.cypress.io as shown in the following IDE sample:

Ensure that you replace the instances in all *.spec.js files.

Run tests

Run the test using the following command:

npx browserstack-cypress run