Handling Alerts | Advanced Playwright TypeScript Tutorial | Part VIII | LambdaTest

About The Video

Dive into the world of Playwright with TypeScript in this detailed tutorial by Vignesh Srinivasan, a seasoned expert in automation testing. In this comprehensive session, you'll learn how to handle different types of browser alerts efficiently. From simple alerts to confirmation dialogs and prompt boxes, this video breaks down every concept step-by-step.

Discover Playwright's unique approach to alert handling, including its auto-handling feature and the importance of writing alert handling code in reverse order. Learn how to capture alert messages, handle OK/Cancel actions, work with prompt inputs, and implement robust assertions to verify your test cases.

Whether you're dealing with simple notifications, confirmation dialogs, or input prompts, this tutorial provides practical examples and best practices for handling alerts in your automation framework using Playwright.

Video Chapters

00:00 Introduction

02:01 Introduction to Alerts

06:50 Handling Simple Alerts

13:50 Working with Confirmation Alerts

17:06 Managing Prompt Alerts (Alerts with Textbox)

22:53 Code Execution and Review

26:32 Closing Words

Key Topics Covered

Introduction to Alerts

Alerts are browser dialogs that interact with users to display messages, confirm actions, or collect input. They are categorized into three types:

Simple Alerts: Display a basic message with an "OK" button.

Confirmation Alerts: Allow the user to choose between "OK" and "Cancel".

Prompt Alerts: Provide a text input field along with "OK" and "Cancel" options.

Playwright’s Auto-Alert Handling

Playwright automatically handles alerts, unlike tools like Selenium where manual handling is required. Even if you don’t write specific code for alerts, Playwright ensures smooth execution by automatically dismissing or accepting them.

Handling Alerts in Playwright

Using Playwright's page.on('dialog') method, alerts can be managed efficiently. This method listens for alert events and allows you to interact with them (e.g., accept, dismiss, or retrieve the alert message).

Reverse Order Scripting for Alerts

When automating alert handling, the handling logic must be written before triggering the alert. This ensures that the alert is captured and managed seamlessly during test execution.

Managing Different Alert Types

Simple Alerts: Use the accept() method to close the alert after capturing its message for validation. Confirmation Alerts: Use accept() for "OK" and dismiss() for "Cancel", with assertions verifying the interaction.

Prompt Alerts: Capture the input field, provide text, and use accept() to validate the entered value.

Practical Demonstrations

The video includes examples of:

Triggering alerts using locators and handling them dynamically.

Writing assertions to verify that the alert messages and user actions are correct.

Using callback functions to manage alert interactions for all three types.

Related Blogs & Hubs

Playwright End To End Testing Tutorial: A Complete Guide

Playwright Tutorial: Getting Started With Playwright Framework

Playwright Tutorial: How to Handle Alerts and Dropdowns