# Cypress > **Note:** > Cypress support in IntelliJ IDEA is provided by the [Test Automation](https://plugins.jetbrains.com/plugin/20175-test-automation) plugin, and most of the features described in this section rely on it. However, basic functionality like running Cypress tests works without the plugin. ![](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua-plugin.icons.cypress.svg) [Cypress](https://www.cypress.io/) is an open-source testing framework for web applications. It provides developers with a fast and reliable solution for automating end-to-end tests. With its unique architecture and comprehensive feature set, Cypress enables efficient test writing, debugging, and integration with popular frameworks and CI/CD pipelines. ## Create a new Cypress project Procedure: 1. In the main menu, go to `File | New | Project`. Alternatively, if you're on the Welcome screen, click New Project. 2. From the list on the left, select Cypress. ![Creating a new Cypress project](https://resources.jetbrains.com.cn/help/img/idea/2026.2/ij_cypress_new_project.png) 3. Name the new project and change its location if necessary. 4. Specify the Node.js runtime. 5. Specify the Package manager. 6. From the Language list, select the language that you want to use. 7. (Optional) Enable the Add sample code parameter. 8. (Optional) Enable the Configure E2E tests parameter to create a set of support files used to introduce custom commands or global overrides that will apply to your spec files. 9. (Optional) Enable the Configure component tests parameter to set up and configure a framework for component testing. Once the Configure component tests parameter is enabled, select the desired framework from the list. ![Create a Cypress project with component tests](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_cypress_project_w_component_tests.png) > **Note:** > All additional dependencies are added to the project automatically. 10. Click Create. A new project is created according to the options that you have selected. ## Add elements to code Procedure: 1. Open the file where you want to add an element. 2. Click ![the Web Inspector button](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua-plugin.icons.webInspector%4020x20.svg) on the right-hand sidebar to open the Web Inspector toolbar window. 3. Specify the URL of the page in the address bar. ![Address bar controls](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_address_bar_controls.png) 4. Click ![The Select Element in Page button](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua-plugin.icons.browser.expui.selectWeb.svg) and select the element that you want to add in the Web Inspector. ![Select element in page](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_select_element_in_page.png) 5. Once the element is selected, click ![Add Element to Code](https://resources.jetbrains.com.cn/help/img/idea/2026.2/app.expui.general.add.svg) to add the element to the code. ![The Add Element to Code button](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_add_element_to_code.png) To add a specific type of the selector (ID, Name, Tag with classes, and so on), click ![Add Element to Code By](https://resources.jetbrains.com.cn/help/img/idea/2026.2/app-client.expui.general.chevronDownLarge.svg) and select the required option. ![Add elements to code by](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_add_elements_to_code_by.png) If you want to switch specifically between CSS and XPath locators, click ![](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua-plugin.icons.locators.expui.css.svg) and select the required locator type. ![Select locator type](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_locator_type_switcher.png) As a result, a piece of code is generated and added to the code editor. ## Run tests Procedure: * To run your tests, click the ![the Run button](https://resources.jetbrains.com.cn/help/img/idea/2026.2/app-client.expui.gutter.run.svg) gutter icon next to the test class or test method, then select the Run option from the list. ![Run tests](https://resources.jetbrains.com.cn/help/img/idea/2026.2/ps_run_tests_cypress.png) Alternatively, place the caret at the test class to run all tests in that class, or at the test method, and press `Ctrl+Shift+F10` (Windows), `⌃ ⇧ R` (macOS), `⌃ ⇧ F10` (IntelliJ IDEA Classic (macOS)), `⌃ ⇧ R` (macOS System Shortcuts), `Ctrl+Shift+F10` (XWin), `Ctrl+Shift+F10` (GNOME), `Ctrl+Shift+F10` (KDE), `Ctrl+Shift+F10` (Emacs), `Ctrl+Shift+F10` (Sublime Text), `Ctrl+Shift+F10` (Sublime Text (macOS)), `Alt+Shift+F6` (NetBeans), `Ctrl+Alt+F5` (Visual Studio), `⌃ ⌥ F5` (Visual Studio (macOS)), `Ctrl+Shift+F10` (Eclipse), `⌃ ⇧ R` (Eclipse (macOS)). You can run tests in a more customizable way using the run/debug configurations. For more information, refer to [Run tests](performing-tests.html). ## Review test results When the tests finish running, the results are displayed on the Test Runner tab of the Run tool window. On this tab, you can rerun tests, export and import test results, see how much time it took to run each test, and perform other actions. ![Test results shown on the Test Runner tab of the Run tool window](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_cypress_review_tests.png) For more information, refer to [Explore test results](viewing-and-exploring-test-results.html). ## Debug tests > **Note:** > A classic "in-IDE" debugging approach is not really applicable to Cypress due to the limitations imposed by the specifics of the framework. However, if you have a use case where the classic approach makes sense, feel free to share it with us using [this](https://youtrack.jetbrains.com/newIssue?project=AQUA&summary=%5BIn-IDE+Cypress+Debugging%5D+%3CSpecify+a+title+here%3E&description=**Description%3A**%0A%3CProvide+a+description+of+your+use+case+and+share+your+thoughts+on+why+you+think+a+classic+%22in-IDE%22+debugging+approach+makes+sense+in+your+particular+case.%3E%0A%0A**Additional+information**%0A%3CFeel+free+to+include+any+relevant+details+such+as+the+context%2C+steps+to+reproduce%2C+screenshots%2C+etc.%3E%0A%0A**IDE**%0A%3CWhat+IDE+do+you+use%3F%3E&c=add+Board+Aqua%3A+PM+%26+Strategy&c=add+Board+Aqua%3A+Content+%26+Marketing&c=Type+Usability+Problem&c=Subsystem+Frameworks&c=Framework+Cypress) form. ## Modify a run/debug configuration If you want to modify the startup properties for your tests, edit the run/debug configuration: Procedure: 1. Click the current configuration in the run/debug configuration switcher and select the Edit Configurations… option. ![Select the run/debug configuration](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_cypress_edit_run_debug_config.png) 2. In the Run/Debug Configurations dialog, select the configuration that you want to edit. 3. Configure the required startup properties. ![Configure startup properties](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_cypress_run_debug_config_1.png) 4. Apply changes and click OK. For more information on run/debug configurations, refer to [Run/debug configurations](run-debug-configuration.html). ## Customize the locator template If you want to customize how selected elements are added to your code, you can modify the template: Procedure: 1. Click the framework name on the Status bar. The UI Automation Framework menu opens. ![Customize template](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_customize_cypress_template.png) 2. Select the Customize Template option. 3. In the File and Code Templates dialog, select the required framework from the list. ![The File and Code Templates dialog](https://resources.jetbrains.com.cn/help/img/idea/2026.2/aqua_cypress_locator_template.png) 4. Rewrite the code generation algorithms for the web element locator. > **Tip:** > [Apache Velocity](https://velocity.apache.org/) template language is used. 5. Click OK to save changes. As a result, the locators will be added to the code according to the updated code generation algorithms. ## Open Cypress Launchpad If needed, you can open your current project in [Cypress Launchpad](https://docs.cypress.io/guides/getting-started/opening-the-app#The-Launchpad). To do this, press `⌘ ⌃ ]` (Windows), `⌘ ⌃ ]` (macOS), `⌘ ⌃ ]` (IntelliJ IDEA Classic (macOS)), `⌘ ⌃ ]` (macOS System Shortcuts), `⌘ ⌃ ]` (XWin), `⌘ ⌃ ]` (GNOME), `⌘ ⌃ ]` (KDE), `⌘ ⌃ ]` (Emacs), `⌘ ⌃ ]` (Sublime Text), `⌘ ⌃ ]` (Sublime Text (macOS)), `⌘ ⌃ ]` (NetBeans), `⌘ ⌃ ]` (Visual Studio), `⌘ ⌃ ]` (Visual Studio (macOS)), `⌘ ⌃ ]` (Eclipse), `⌘ ⌃ ]` (Eclipse (macOS)). ![Cypress Launchpad](https://resources.jetbrains.com.cn/help/img/idea/2026.2/cypress_launchpad.png) ## See also ### External Links [Cypress](https://www.cypress.io/)