Why plugins extend Cypress capabilities - Automation Benefits in Action

Verify that a Cypress plugin extends Cypress commands

Preconditions (2)

Step 1: Open the Cypress plugins file and add a custom command plugin

Step 2: Write a test that uses the new custom command

Step 3: Run the test in Cypress Test Runner

✅ Expected Result: The test should run successfully using the new custom command added by the plugin

Automation Requirements - Cypress

Assertions Needed:

Verify the custom command is available and works as expected

Verify the test passes using the plugin command

Best Practices:

Use Cypress.Commands.add to add commands

Keep plugins code modular

Use descriptive command names

Use Cypress Test Runner for execution

Automated Solution

Cypress

/// <reference types="cypress" />

// cypress/support/commands.js
Cypress.Commands.add('loginByCustomCommand', (email, password) => {
  cy.get('input[name=email]').type(email)
  cy.get('input[name=password]').type(password)
  cy.get('button[type=submit]').click()
})

// cypress/e2e/login_spec.cy.js

describe('Login with custom plugin command', () => {
  it('should login successfully using the custom command', () => {
    cy.visit('https://example.cypress.io/login')
    cy.loginByCustomCommand('[e-mail]', 'Password123!')
    cy.url().should('include', '/dashboard')
  })
})

The Cypress.Commands.add function is used to add a new custom command called loginByCustomCommand. This command types the email and password into the login form and clicks submit.

The test file login_spec.cy.js uses this new command to perform login. It visits the login page, calls the custom command with test credentials, and then asserts that the URL includes '/dashboard' indicating successful login.

This shows how plugins extend Cypress by adding reusable commands that simplify test scripts.

Common Mistakes - 4 Pitfalls

{'mistake': 'Not importing or referencing the commands file in the support file', 'why_bad': "The custom commands won't be registered and tests will fail with 'command not found' errors.", 'correct_approach': 'Ensure the commands file is imported in cypress/support/e2e.js or cypress/support/index.js.'}

Using non-descriptive or generic command names

Hardcoding selectors inside the test instead of inside the command

Not using Cypress best practices like chaining commands

Bonus Challenge

Now add data-driven testing with 3 different sets of login credentials using the custom command

Show Hint