Showing posts with label Alert. Show all posts
Showing posts with label Alert. Show all posts

How to handle alerts in Cypress

 Alerts, in the context of web development and user interfaces, are pop-up dialog boxes that display important information or notifications to users. They are commonly used to convey messages, warnings, errors, or requests for user input. Here's a brief description of different types of alerts:

  • Alerts: Alerts are simple pop-up boxes that display a message to the user. They typically have an "OK" button to acknowledge and dismiss the message. They are often used to convey information or provide notifications.
it('Alerts', () => {
cy.visit('http://the-internet.herokuapp.com/javascript_alerts')
cy.get('button[onclick="jsAlert()"]').click()
cy.on('window:alert', (a) => {
expect(a).to.contains('JS')
})
cy.get('#result').should('have.text','You successfully clicked an alert')
})
  • Confirm Dialogs: Confirm dialogs are similar to alerts but include two buttons, usually "OK" and "Cancel." They are used to prompt the user for confirmation or to make a decision, such as confirming the deletion of an item.
it('confirm alert', () => {
cy.visit('http://the-internet.herokuapp.com/javascript_alerts')
cy.get('button[onclick="jsConfirm()"]').click()
cy.on('window:confirm',(b) => {
expect(b).contains('JS')
})
cy.on('window:confirm', () => true);
cy.get('#result').should('have.text' ,'You clicked: Ok')
  • Prompt Dialogs: Prompt dialogs are like confirm dialogs but also include a text input field. They ask the user for input, such as their name or a value, and often have "OK" and "Cancel" buttons. Prompt dialogs are used when user input is required.