Handling Alert Popup Boxes In Web Apps Using Selenium

In this article, will discuss Alert popup boxes in web applications using Selenium. Generally, in a web page, we use popup boxes for various reasons.

What is a Popup box?

It is a small message/dialog box that appears on the top of a web application and it provides some information/warning to the user. Sometimes, it also expects input information from the user.

In web applications, we have three kinds of popup boxes,

  1. Alert box
  2. Confirm box
  3. Prompt box

Alert box

Alert box looks just like below.

Handling Alert popup boxes in Web Apps using Selenium

An alert box is used when an application wants to display some information to the user. The user has to click on the OK button when the alert box shows up to proceed further.

Confirm box

Confirmation popups look just like below.

Handling Alert popup boxes in Web Apps using Selenium

A confirm box is used when an application wants to get confirmation from the user. The user has to click on either Yes/Ok button or No/Cancel button when the confirm box shows up to proceed further.

Prompt box

Prompt popups look just like below.

Handling Alert popup boxes in Web Apps using Selenium 

A prompt box is used when an application expects input from the user immediately after opening it. The user has to click on either Yes/Ok button or No/Cancel button after entering the input when the confirm box shows up to proceed further.

From developer tools, we can’t inspect any button or textbox present on any type of these popup boxes. Don’t panic, because Selenium provides a way to handle these three type of popup boxes. But you may have a question in your mind; why do we need to handle these alerts?

The answer to this question is “these popup boxes will appear on top of the user’s screen and it blocks the screen. It means the user can’t perform any operation on the screen until the user handles these popup boxes.”

So it is mandatory that we need to handle these popup boxes.

The operations that we can perform on these popups using selenium are,

  1. Accept
  2. Dismiss
  3. SendKeys
  4. GetText

Accept refers to clicking on the Ok button.

Dismiss refers to clicking on the Cancel button.

Sendkeys refers to entering text into a textbox available in the prompt box.

GetText refers to get the label text present on the popup box.

Here I’m using the below Website for demonstrating the examples on popup boxes.

https://www.hyrtutorials.com/p/alertsdemo.html
 
The webpage looks some similar to the following:
 
 Handling Alert popup boxes in Web Apps using Selenium
 
The output of the popup box will be displayed below the last field; i.e., Popup box output.
 
Below is the selenium script for handling popup boxes. 
 
Selenium Script
  1. String alertBoxOutput, popupText;  
  2. System.setProperty("webdriver.chrome.driver""./Resources/chromedriver.exe");  
  3. WebDriver driver = new ChromeDriver();  
  4. driver.manage().window().maximize();  
  5. driver.manage().timeouts().setScriptTimeout(20, TimeUnit.SECONDS);  
  6. driver.get("https://www.hyrtutorials.com/p/alertsdemo.html");  
  7. Thread.sleep(2000);  
  8.   
  9. // Alert popups  
  10. driver.findElement(By.id("alertBox")).click();  
  11. popupText = driver.switchTo().alert().getText();  
  12. Assert.assertEquals(popupText, "I am an alert box!");  
  13. driver.switchTo().alert().accept();  
  14. alertBoxOutput = driver.findElement(By.id("output")).getText();  
  15. Assert.assertEquals(alertBoxOutput, "You selected alert box");  
  16.   
  17. // Confirmation popups  
  18. driver.findElement(By.id("confirmBox")).click();  
  19. popupText = driver.switchTo().alert().getText();  
  20. Assert.assertEquals(popupText, "Press a button!");  
  21. driver.switchTo().alert().accept();  
  22. alertBoxOutput = driver.findElement(By.id("output")).getText();  
  23. Assert.assertEquals(alertBoxOutput, "You pressed OK in confirm box");  
  24. driver.findElement(By.id("confirmBox")).click();  
  25. driver.switchTo().alert().dismiss();  
  26. alertBoxOutput = driver.findElement(By.id("output")).getText();  
  27. Assert.assertEquals(alertBoxOutput, "You pressed Cancel in confirm box");  
  28.   
  29. // Prompt popups  
  30. driver.findElement(By.id("promptBox")).click();  
  31. popupText = driver.switchTo().alert().getText();  
  32. Assert.assertEquals(popupText, "Please enter your name:");  
  33. driver.switchTo().alert().sendKeys("Reddy");  
  34. driver.switchTo().alert().accept();  
  35. alertBoxOutput = driver.findElement(By.id("output")).getText();  
  36. Assert.assertEquals(alertBoxOutput, "You entered text Reddy in prompt box");  
  37. driver.findElement(By.id("promptBox")).click();  
  38. driver.switchTo().alert().dismiss();  
  39. alertBoxOutput = driver.findElement(By.id("output")).getText();  
  40. Assert.assertEquals(alertBoxOutput, "You pressed Cancel in prompt box.");  
  41.   
  42. driver.quit();  
I hope you find this article useful. Please provide your valuable feedback, questions, or comments about this article.