Complete Installation of Cypress: Your Updated Guide

Discover the complete installation of Cypress with our updated guide, from setting up Node.js to opening the tool on your OS.

QA

Nestor Alonso

7/7/20242 min read

cypress Nestor Alonso
cypress Nestor Alonso

Welcome, Cypress Masters!

Today, we bring you an updated guide for installing Cypress, covering everything from Node.js setup to opening the tool on your operating system. Cypress is a powerful, next-generation front-end testing tool built for modern web applications. This guide will ensure you have a smooth installation process, no matter your OS or experience level.

Installing Visual Studio Code (VSC)

The first step in preparing your development environment for Cypress is to install Visual Studio Code (VSC). VSC is a free source-code editor made by Microsoft for Windows, Linux, and macOS. It includes support for debugging, embedded Git control, syntax highlighting, intelligent code completion, snippets, and code refactoring.

Installing Node.js

Node.js is essential for running JavaScript outside of a browser. It’s a fundamental tool for Cypress, enabling the environment needed for the testing framework.

  • Ensure Compatibility: You need Node.js version 18.x or higher.

  • Download Node.js: Get the latest version from nodejs.org.

  • Using nvm: Alternatively, install Node.js using the Node Version Manager (nvm) from nvm's GitHub page to manage multiple Node.js versions easily.

Installing NPM (Node Package Manager)

NPM comes bundled with Node.js, so once you install Node.js, you should have NPM as well.

  • Verify Installation: Open your terminal and run:

    node -v

    npm -v

    These commands check the installed versions of Node.js and NPM.

Initializing Your Project

Before installing Cypress, you need to set up your project. This involves creating a new project directory and initializing it with NPM.

  • Create Project Folder: Create a new folder on your PC and open it in Visual Studio Code.

  • Initialize NPM: Open the terminal in VSC and run:

    npm init

    Follow the step-by-step configuration to create your project's initialization file (package.json).

Installing Cypress

Cypress can be installed in various ways, depending on your preference and needs.

  • Using NPM: This is the recommended method for most users.

    npm install cypress --save-dev

  • Using Yarn:

    yarn add cypress --dev

  • Using pnpm:

    pnpm add cypress -D

  • Direct Download: If you prefer not to use a package manager, you can download Cypress directly from the Cypress CDN.

Opening Cypress

After installing Cypress, you need to open it to start testing.

  • Using npx:

    npx cypress open

  • Direct Download Users: If you downloaded Cypress directly, unzip the file and run the executable to start Cypress.

Verifying Operating System Compatibility

Ensure that your operating system is compatible with Cypress to avoid any installation or runtime issues.

  • Supported OS:

    • macOS: 10.9 and above

    • Linux: Ubuntu 20.04 and above, Fedora 21, Debian 8

    • Windows: 10 and above (64-bit only)