How do I dismiss an alert popup using Playwright?


Handling Popups with Playwright

Dealing with popups in Playwright is a breeze. You can easily dismiss an alert-type popup by registering a dialog handler before the action that triggers the dialog.

Here's a quick example:

// Register a dialog handler
page.on('dialog', async (dialog) => {
  // Check if it's the desired popup
  if (dialog.type() === 'alert') {
    // Dismiss or cancel the popup by clicking on "Cancel" button
    await dialog.dismiss();

// Trigger an action that opens the popup
await page.click('#open-popup-button');

In the above code, page.on('dialog') registers a dialog handler. Inside the handler function, dialog.type() checks if it's an alert-type popup. If it is, dialog.dismiss() dismisses or cancels it.

By registering this dialog handler before triggering any actions that may open popups, you ensure that any alert-type popups are automatically handled and canceled.

Remember, this example assumes you've already navigated to a web page and have access to a Playwright page object named page. You may need to adjust it to fit your specific use case.

For more tips on handling flaky tests in Playwright, check out this blog post. Happy testing!


Thank you!
Was this helpful?
Still have questions?

If you still have questions, please ask a question and I will try to answer it.

Related Discord Threads

Related Questions

AboutQuestionsDiscord ForumBrowser ExtensionTagsQA Jobs

Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email luc@ray.run.