Overwriting existing commands in Cypress - Cheat Sheet & Quick Revision

Recall & Review

beginner

What does it mean to overwrite an existing command in Cypress?

It means replacing or extending a built-in Cypress command with your own version to customize its behavior.

beginner

How do you overwrite a Cypress command?

Use Cypress.Commands.overwrite('commandName', (originalFn, ...args) => { ... }) to replace the command.

intermediate

Why should you call the original command function inside your overwritten command?

To keep the original behavior and add extra steps, ensuring your changes don’t break existing functionality.

intermediate

Example: Overwrite click command to log a message before clicking. What is the correct way?

Use Cypress.Commands.overwrite('click', (originalFn, subject, options) => { console.log('Clicking element'); return originalFn(subject, options); }).

intermediate

What happens if you overwrite a command but do NOT call the original function?

The original command’s behavior is skipped, which may cause tests to fail or behave unexpectedly.

Which method is used to overwrite an existing Cypress command?

A Cypress.Commands.replace()

B Cypress.Commands.overwrite()

C Cypress.Commands.add()

D Cypress.Commands.modify()

The correct method to overwrite commands is Cypress.Commands.overwrite().

When overwriting a command, what is the first argument passed to your function?

A The original command function

B The command name

C The test context

D The command options

The first argument is the original command function, allowing you to call it inside your overwrite.

What is a good reason to overwrite a Cypress command?

A To slow down tests intentionally

B To delete the command permanently

C To add logging or extra checks before or after the original command

D To change Cypress configuration

Overwriting is useful to add extra behavior like logging or validation around the original command.

If you overwrite a command but forget to call the original function, what happens?

A The original command runs anyway

B The test passes without running the command

C Cypress throws an error automatically

D The command does nothing and may break tests

Not calling the original function means the command’s main action is skipped, likely breaking tests.

Where should you place your overwritten commands in a Cypress project?

A In the <code>cypress/support/commands.js</code> file

B In the test spec files

C In the <code>cypress/plugins</code> folder

D In the <code>cypress/fixtures</code> folder

Overwritten commands belong in cypress/support/commands.js to load before tests run.

Explain how to overwrite a Cypress command and why you might want to do it.

Think about customizing built-in commands without losing their original behavior.

Describe the risks of overwriting a command without calling the original function.

Consider what happens if the main action of a command is missing.