A Visual Studio Code extension that helps you discover, navigate and run Cypress tests directly from the editor.
Features
🔍 Automatically discovers all the cypress files in your workspace
📁 Displays tests in a tree view organized by directory structure
⚡ Quick access to run individual tests or all tests
🔄 Easy refresh to update the test list
⚙️ Configurable root folder for test discovery
🗂️ Configure project path for locating cypress config file
🔧 Configure environment variables tailored to each project
Usage
View Your Tests
Click the Cypress Test Explorer icon in the Activity Bar
Your Cypress tests will be automatically discovered and displayed in a tree view
Run Tests
Click the play button next to any test to run it
When multiple tests are run simultaneously, they are executed in a queue
Use the "Run All Tests" button in the title bar to run all tests
Configure Root Folder
Click the folder icon in the Test Explorer title bar
Enter the relative path to your Cypress tests folder
The test tree will automatically refresh with tests from the specified folder
Configure Project Folder
Click the folder icon (Set Cypress Project Path) in the Test Explorer title bar.
Enter the relative path to the folder containing the Cypress configuration file.
Configure Environment Variables
In the Activity Bar, below the list of Cypress files, locate the section for Environment Variables.
Enter the environment variables, such as CY_MOCK=1, to be used for executing the Cypress run.
Click Save to apply the changes.
Configure executable command
Set the command to run Cypress tests.
Open the Command Palette by pressing Command + Shift + P (Mac) or Ctrl + Shift + P (Windows/Linux).
Type "Set Executable Cypress Command" and select it from the options.
Enter the command to run tests, e.g., npx cypress.
Refresh Test List
Click the refresh button in the Test Explorer title bar to update the list of tests.
Requirements
Visual Studio Code v1.60.0 or higher
Node.js and npm installed
Cypress installed in your project
Development
VSC Extension quickstart will provide a guide for developers getting started with creating and debugging VS Code extensions. If you're new to VS Code extension development, you can refer to this file for detailed instructions on:
Setting up your development environment.
Running the extension in a development instance of VS Code.
