How to Handle Alerts and pop-ups in Selenium 4

In this blog, we will go through the javascript Alert and pop-up boxes in selenium. in this blog, we will see how we can handle javascript alerts and JS confirmation boxes, and JS prompt boxes.

What is alerts and pop-up in Selenium?

Let’s take an example if we go to “https://the-internet.herokuapp.com”. this is a demo website and here we have some examples of javascript alerts. if we go there and you can see there are three types of javascript alerts. so we have 3 types of pop-up boxes JS alerts, JS confirm, and JS Prompt. if we click on JS alert we get a pop-up box that says I am a JS alert. when we click on JS Prompt we will get a pop-up box along with a text box where we can write something.

So Let us see how we can handle this in our Selenium 4

package test;

import java.time.Duration;

import org.openqa.selenium.By;

import org.openqa.selenium.WebDriver;

import org.openqa.selenium.chrome.Chormedriver;


public class alert {

    public static void main(String[] args){

        WebDriverManager.chromedriver().setup();

        WebDriver driver = new ChromeDriver();

        driver.manage().timeouts().implicitWwait(Duration.ofSeconds(10));

        driver.get("https://the-internet.herokuapp.com/javascript_alerts");

        //this is js alerts

                       driver.findElement(By.xpath("//button[@onclick='jsAlert()']")).click();

        Alert alerts1 = driver.switchTo().alert();

        System.out.println(alert1.getText());

        alert1.accept();

        if(driver.getPageSource().contains("sucessfully clicked an alert"))

        System.out.println("sucessfully clicked an alert");


        //this is js confirm

                        driver.findElement(By.xpath("//button[@onclick='jsConfirm()']")).click();

        Alert alerts2 = driver.switchTo().alert();

        System.out.println(alert2.getText());

        alerts2.dismiss();

        if(driver.getPageSource().contains("you clicked: Cancel"))

        System.out.println("you clicked: Cancel");


        //js Prompt

        driver.findElement(By.xpath("//button[@onclick='jsPrompt()']")).click();

        Alert alerts3 = driver.switchTo().alert();

        System.out.println(alert3.getText());

        alerts2.sendKeys("this is selenium 4");

        alert3.accept();

        if(driver.getPageSource().contains("you entered: this is selenium 4"))

        System.out.println("you entered: this is selenium 4");


        driver.close();

        driver.quit();
    }
}

Let’s start with this script for javascript Alert

• Firstly we have to invoke our chrome browser

//launch chrome browser

 WebDriver driver = new ChromeDriver();

And hit the URL 

“https://the-internet.herokuapp.com“.

• Now we have to open our JavaScripts page. After that, we will start clicking on the alerts and then handle the JavaScripts alerts. So let us see the first alert this is the first pop-up box we will see that is “JavaScript Alert”.

driver.findElement(By.xpath("//button[@onclick='jsAlert()']")).click();

Here is a type button and an onclick property and the property value are JS Alert. Then we will click on the button and it brings up the alert box. Now after that, we have to switch to the alert so here we will say driver.switchTo().alert() this is the function we will use, and then we will store it in an alert object. 

Alert alerts1 = driver.switchTo().alert();

• Now this will switch to the particular alert so now we can say “alert1.accept()” (we can dismiss or accept the alert, in this case, we will accept the alert) so this is all that how we can accept an alert.

But if you want to verify it has actually done all the right things we can verify the text on the screen. for example, if we click on a JS Alert button and we will say “ok” then we get “successfully clicked an alert”. so we can check that by giving a condition.

 if(driver.getPageSource().contains("sucessfully clicked an alert"))

            System.out.println("sucessfully clicked an alert")

• Now we will do the same for JS Confirm and this time we will dismiss this alert.

driver.findElement(By.xpath("//button[@onclick='jsConfirm()']")).click();

        Alert alerts2 = driver.switchTo().alert();

        System.out.println(alert2.getText());

        alerts2.dismiss();

This time we click on a JS Alert button and we will say “cancel” then we get “you clicked: Cancel”. so we can check that by giving a condition.

 if(driver.getPageSource().contains("you clicked: Cancel"))

            System.out.println("you clicked: Cancel");

• Now let us see the JS Prompt box

driver.findElement(By.xpath("//button[@onclick='jsPrompt()']")).click();

        Alert alerts3 = driver.switchTo().alert();

        System.out.println(alert3.getText());

So here is when we will click on the JS Prompt. the button we get a text box then we have to add something in this box by this and accept the alert.

   alerts2.sendKeys("this is selenium 4");

        alert3.accept();

And then we will verify that we will get the text by this condition

f(driver.getPageSource().contains("you entered: this is selenium 4"))

            System.out.println("you entered: this is selenium 4");

References

https://www.selenium.dev/documentation/webdriver/