---
title: Cypress Typescript Tutorial | TestingBot
description: Learn how to use Typescript and Cypress to run end-to-end tests in the
  cloud.
source_url:
  html: https://testingbot.com/support/web-automate/cypress/typescript
  md: https://testingbot.com/support/web-automate/cypress/typescript/index.md
---
# Cypress Typescript Testing

TestingBot offers a service similar to Cypress Cloud, where you can run Cypress tests on multiple browsers in the cloud, simultaneously. On this page, we will focus on how to run a Cypress test, built with Typescript, on TestingBot's remote browser grid.

## Setup Typescript and Cypress

TestingBot provides a ready-to-use Github example: [typescript-cypress-testingbot](https://github.com/testingbot/typescript-cypress-testingbot).

To get started, create a new project and add the necessary dependencies:

- `npm init`
- `npm install testingbot-cypress-cli typescript cypress --save-dev`
- Next, create a `tsconfig.json` file with the following contents:

- Let's also create a `cypress.config.ts` file (notice the `.ts` indicating this is a Typescript project).

## Typescript Example

Now that everything is set up, we can add a first test. Create a `cypress` directory, which will contain 2 more directories:

- `e2e`
- `support`

### e2e.cy.ts file

The `e2e.cy.ts` file in the `cypress/e2e` directory contains our test logic:

    describe('TestingBot Demo test', () => {
      beforeEach(() => {
        cy.visit('https://testingbot.com')
      })
    
      it('Verify title', () => {
        cy.title().should('include', 'TestingBot')
      })
    })

### e2e.ts file

Another file, `e2e.ts`, needs to be added in the `cypress/support` directory, containing:

    // Import commands.js using ES2015 syntax:
    import './commands'

`commands.ts` can be an empty file for now.

## Run the Cypress test

There's one more thing left for us to do. We need to create a `testingbot.json` file, which needs to contain a couple of things for TestingBot to run your test. To create the file, execute the following command in the base directory of your project:

    testingbot-cypress init

You can now edit the `testingbot.json` file.

    {
        "auth": {
            "key": "TESTINGBOT_KEY",
            "secret": "TESTINGBOT_SECRET"
        },
        "browsers": [
            {
    	        "browserName": "chrome",
    	        "platform": "VENTURA",
    	        "version": "latest"
            }
        ],
        "run_settings": {
            "cypress_project_dir": ".../cypress/cypress-example-kitchensink",
            "build_name": "cypress-build",
            "npm_dependencies": {
            	"typescript": "^5.2.2"
            },
            "package_config_options": {},
            "start_tunnel": false,
            "realTimeLogs": true,
            "parallel": 1
        },
        "tunnel_settings": {
            "verbose": false
        }
    }

Make sure to specify the same typescript dependency in `npm_dependencies` as the one in your `package.json`. This will instruct TestingBot to use the same Typescript version for running your tests.

Finally, to run the test, you can run the following command:

    testingbot-cypress run

The test results, together with a video and logs of the tests, will be available in 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)