Modal Steps

HTML modal overlays. Visibility, content, scoped clicks, close. Modal flows are notoriously flaky; these steps are battle tested.

Step phrasings in this group

The book sidebar lists each individual step page under this group.

Then I should see a modal

Assert that a modal dialog is visible or not visible on the page.

Then I should see a modal with title "Confirm Action"

Assert that a modal dialog with a given title is visible or not visible.

Then I should see a "confirmation-modal" modal

Assert that a specific modal by id/class/data-modal is visible or not.

Then I should see "Are you sure?" in the modal

Assert that a modal contains or does not contain specific text.

Then the modal should contain "Welcome modal text"

Assert that the modal contains the given text (alternate phrasing).

Then the modal should not contain "Goodbye"

Assert that the modal does NOT contain the given text.

When I click "Confirm" in the modal

Click a button or link inside a modal dialog by its visible text.

When I click on "#close-btn" in the modal

Click a CSS-selector-addressed element inside the active modal.

When I close the modal

Close or dismiss a modal dialog (uses close button, or Escape fallback).

Back to all step groups