Pop-Ups in Selenium

In HTML pages, we have different kinds of pop-ups; we will discuss them in this tutorial. Different popups will have different properties.


Types of Pop-Ups :

  • Alert Pop Up
  • Confirmation Pop Up
  • Authentication Pop Up
  • Hidden-Division Pop Up
  • Calendar Pop Up
  • Download Pop UP
  • Upload Pop Up

We have a different section for Alert and Confirmation Pop-Ups, so in this page, we are going to discuss how to handle remaining Pop-Ups in selenium

Reading QR Code from the website using Webdriver

Authentication Pop Up handling in selenium

When we open password-protected pages, we tend to get Authentication pop up. Authentication pop up will have username and password fields, the UI look of the pop up may vary browser to browser

Visit URL selenium webdriver Auth : https://chercher.tech/auth, the site expects you to provide credentials.

Credentials :
username - selenium
password - webdriver

Authentication Popup : authentication-pop-up-selenium-webdriver

Properties of the Authentication Pop up :

  • Pop up displayed on Page load
  • We can move the pop up (except in chrome)
  • We cannot inspect the pop up with browser inspection tools like (TryXpath or chrome dev tools)
  • The look varies from browser to browser


The Solution to Authentication Pop Up : We have to pass the user name and password along with the URL to handle the authentication pop in webdriver. Please find the syntax to pass the username and password

driver.get(protocol://Usename:Password@URL Address);

Protocols: Http, Https, Ftp.

To access the https://chercher.tech/auth page, you need to pass username and password like below.

driver.get(https://selenium:webdriver@chercher.tech/auth);


Complete program to handle Authentication popup

import java.util.concurrent.TimeUnit;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.FirefoxDriver;

public class AuthenticationPopUp {
	public static void main(String[] args) throws Exception {
		// set the geckodriver.exe property
		System.setProperty("webdriver.gecko.driver", "C:/~/geckodriver.exe");
		// open firefox
		WebDriver driver = new FirefoxDriver();
		driver.manage().timeouts().implicitlyWait(1, TimeUnit.MINUTES);
		// open webpage
		driver.get("https://selenium:webdriver@chercher.tech/auth");
		// verify the title
		if(driver.getTitle().equals("Authentication Successful")){
			System.out.println("Test Passed");
		}else{
			System.out.println("Test failed");
		}
	}
}


If login is successful, you will see the below page on the browser.result-authentication-popup-selenium-webdriver

Limitations:
  • Does not work for the https protocol
  • It does not work when username or password contains special characters like : '@' , ':'

Handling Custom Dropdowns in selenium

Hidden division Pop Up with Selenium

Hidden division pop is nothing but HTML code which is hidden initially, hidden division pop up also known as dialog or overlay.

The overlay is triggered when an application user performs specific tasks like clicking a button, submitting a form, or on page load...


Examples :

  • Calender Popups
  • Contact forms
  • Error and success Messages

hidden-division-modal-selenium-webdriver


Properties of Hidden division Pop up :

  • Cannot be moved here and there
  • We can inspect the overlay
  • This is not javaScript popup
  • We can resize and customize the content of the pop-up
  • If the content is more then the pop-up size, pop shows scroll bar
  • When hidden division pop is opened, pop takes the focus from the application.
  • When pop up is closed, focus automatically goes to the application
  • Hidden division popup could be nested, i.e. a hidden division pop can have another hidden division pop up
  • Hidden division pop can hold other pop-ups/ alerts on it.

Xpath in Selenium


Handle Hidden division Pop Up :

1. Navigate to : https://chercher.tech/practice/hidden-division-popup
2. Click on View Pop-Up button
3. Application opens a Model
inspect-hidden-popup-selenium-webdriver

4. Write xpath for the Name text bar : //input[@type='text']
5. Send text for the Name, using sendKeys in selenium.
6. No Special Operation required to handle hidden division popup.

Complete program for handling hidden division pop up in selenium

public class HiddenDivisionPopUp {
  public static void main(String[] args) throws Exception {
	// set the geckodriver.exe property
	System.setProperty("webdriver.gecko.driver", "C:/~/geckodriver.exe");
	// open firefox
	WebDriver driver = new FirefoxDriver();
	driver.manage().timeouts().implicitlyWait(1, TimeUnit.MINUTES);
	// open webpage
	driver.get("https://chercher.tech/practice/hidden-division-popup");
	driver.findElement(By.className("cd-popup-trigger")).click()
	// send text to Name field on overlay
	driver.findElement(By.xpath("//input[@type='text']")).sendKeys("Hidden Division Text");
  }
}


Even though pop up content is present but pop is not present on UI until we click a button, for this reason, it is called as hidden division popup.


content-hidden-division-popup-selenium-webdriver


Limitations:

Capture Screenshots in webdriver

Comment / Suggestion Section
Point our Mistakes and Post Your Suggestions
  • Reply