Cypress.io - save value with JavaScript window.prompt

Question

I am new in Cypress and I have a problem.

I the app, I have a "Save Button". When you click the button, it is triggered JS window.prompt(). Inside the prompt you write the name of the save (like "Save from John") and click to "OK" - inside the prompt.

I need to cover this user story by the E2E test in Cypress.io.

Problem is, when I click the "Save button", cypress freeze in Click() event, when the prompt is displayed.

it('Make a new save with JS prompt', () => {
   cy.get('#save-changes-button')
   .should('be.visible')
   .click() //here the prompt is displayed, cypress stop and wait for click() event finish
})

May I ask for some help? I did not found siutable solution in Cypress.io Docs or elsewhere.

Answer 1

Ok, fact is, the current version of the Cypress.io does not support interaction with window events. The way how to cheat it is the cy.stub() method.

This is my solution. The scenario:

1. Click the "Save Button" in GUI.
2. window.prompt() is opened.
3. Write the save name (like "Saved by Thomas") into the prompt.
4. Click "OK" in prompt and save the value.

And the code in Cypress:

    it('Save the value inside Prompt', () => {
            cy.window().then(win => {
                cy.stub(win, 'prompt').returns('The value you write inside prompt')
                cy.get('#save-changes-in-gui-button').click();
                //... Saved value assert
            })
    })

Cypress by default change window.pompt() event by the stub and simulate click "OK". This solution works for me now. Hope, it could help someone else :)