Search⌘ K
AI Features
Home
Courses
Frontend End-to-End Testing with Cypress

Plugins and Support

Explore how Cypress plugins allow you to customize the testing lifecycle, configure environments, and use preprocessors. Understand the role of the support folder for adding custom commands and how to create or overwrite commands to streamline your tests. This lesson helps you leverage these features to build more flexible and maintainable Cypress test suites.

We'll cover the following...

Plugins in Cypress help us to tap into the internal workings of the framework and modify it according to our taste. It allows us to execute code at various stages of the Cypress lifecycle.

The “plugins” folder comes with a single index.js file by default. This is what Cypress will automatically look for when loading plugins.

Of course, we can customize the project structure through the cypress.json configuration file:

{
    // The default location of the plugins file
    "pluginsFile": "cypress/plugins/index.js"
}

Common use cases for plugins

Let’s look at some common use cases to better understand plugins in Cypress.

Configuration

The most common way to use plugins is to configure the environment programmatically. This lets us:

  • Use different configurations for different environments
  • Modify the Cypress configuration values

The default plugin file exports a module with two arguments: on and config:

Javascript (babel-node)
module.exports = (on, config) => {
    console.log('Your Cypress config', config);
    config.env.NODE_ENV = 'development';
    return config;
};

Using the config argument, we can access the entire ...