Cypress: Configurable pause/delay between commands to help with debugging

[jhanink]

ability to slow down the execution of a test via a configurable delay, e.g.

Cypress.config("waitAfterEachCommand", 2000)

[QuackMartins]

:+1:

[mmysik]

Hi guys, I am curious, is there any update on this ticket so far? I am looking for such a feature right now to avoid myself to add delay between all test steps. Thanks for your response.

[tnrich]

Also whenever a drag command lands it would be nice to have the option to specify the speed of the drag.

[jacobgardner]

This is what I've been doing to get a delay between commands. You just have to make sure you're enumerating all the commands that you want a delay on in that array.

// support/commands.js
const COMMAND_DELAY = 500;


for (const command of ['visit', 'click', 'trigger', 'type', 'clear', 'reload', 'contains']) {
    Cypress.Commands.overwrite(command, (originalFn, ...args) => {
        const origVal = originalFn(...args);

        return new Promise((resolve) => {
            setTimeout(() => {
                resolve(origVal);
            }, COMMAND_DELAY);
        });
    });
} 

[olegario96]

@jacobgardner this solution is way better than cypress-wait-until package. Thank you!

[heitrix]

This is what I've been doing to get a delay between commands. You just have to make sure you're enumerating all the commands that you want a delay on in that array.

// support/commands.js
const COMMAND_DELAY = 500;


for (const command of ['visit', 'click', 'trigger', 'type', 'clear', 'reload', 'contains']) {
    Cypress.Commands.overwrite(command, (originalFn, ...args) => {
        const origVal = originalFn(...args);

        return new Promise((resolve) => {
            setTimeout(() => {
                resolve(origVal);
            }, COMMAND_DELAY);
        });
    });
} 

How do I use this in the spec.js script? @jacobgardner
I'm a beginner.

something like this?

cy.get(".item").click(1000)

[BrettHoutz]

@heitrix All you have to do is add the code to support/index.js (or support/commands.js if it exists). Then you just call the commands as usual: cy.get(".item").click(). The commands will have the delay set by COMMAND_DELAY.

[WillGibson]

Update on the snippets above so you can just decide when to introduce the delay on an adhoc basis...

// support/commands.js
// Set CYPRESS_COMMAND_DELAY above zero for demoing to stakeholders,
// E.g. CYPRESS_COMMAND_DELAY=1000 node_modules/.bin/cypress open
const COMMAND_DELAY = Cypress.env('COMMAND_DELAY') || 0;
if (COMMAND_DELAY > 0) {
    for (const command of ['visit', 'click', 'trigger', 'type', 'clear', 'reload', 'contains']) {
        Cypress.Commands.overwrite(command, (originalFn, ...args) => {
            const origVal = originalFn(...args);

            return new Promise((resolve) => {
                setTimeout(() => {
                    resolve(origVal);
                }, COMMAND_DELAY);
            });
        });
    }
}

[bahmutov]

I am slowing down certain commands in this repo http://github.com/bahmutov/cypress-movie