How to assert that an alert does not appear?

Question

When a certain UI bug appears, an alert pops up with an error message. I fixed that bug, and now I want to write a Cypress test.

How do I write a Cypress test that passes if the alert does not appear?

I realize that I must be careful with negative assertions, so I'll want to make the test as robust as possible.

Related post: Cypress: Test if element does not exist

Answer 1

How do I write a Cypress test that passes if the alert does not appear?

1. Spy on the window:alert event.
2. Wait a few seconds to give the alert time to appear.
3. Use a positive assertion to make sure the spy is what you're expecting.
4. Assert that the spy isn't called.

// Typing enter should not produce an alert
let spy = cy.spy(window, 'alert');
cy.get('input[name="MyField"]')
    .type('{enter}')
    .wait(4000)
    .then(() => {
        expect(spy).to.haveOwnProperty('callCount');
        expect(spy).to.not.be.called;
    });

5. Also make a positive assertion for whatever is supposed to happen when the bug is fixed.