Skip to main content

Complex scenarios automation in Selenium- Part 1

So for this exercise we will be clicking an any state in this SVG map.

https://petdiseasealerts.org/forecast-map#/




So for this exercise, the best chance you getting a valid result is getting the correct xpath. So most of you will get this xpath.

String stateXpath =
"(//*[name()='svg'])/*[@id='features']/*[@id='regions']/*[@id='"+state+"']";

or this

String stateXpath= "//*[name()='svg']//*[name()='g' and @id = ' "+state+" ']";

with one of this implementations if you ran following code, you will fail at state Florida, with element click intercept exception.

package org.example;

import io.github.bonigarcia.wdm.WebDriverManager;
import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;

import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.chrome.ChromeOptions;
import org.openqa.selenium.support.ui.ExpectedConditions;
import org.openqa.selenium.support.ui.WebDriverWait;


/**
 * Hello world!
 *
 */
public class App
{
public static WebDriver driver;

 public static void main( String[] args ) throws InterruptedException {

String state ="Georgia";
 String stateXpath =
"(//*[name()='svg'])/*[@id='features']/*[@id='regions']/*[@id='"+state+"']";
 By framename = By.xpath("//iframe[contains(@id,'map-instance')]");

ChromeOptions chromeOptions = new ChromeOptions();
 WebDriverManager.chromedriver().setup();
 driver = new ChromeDriver(chromeOptions);

 driver.get("https://petdiseasealerts.org/forecast-map#/");

 driver.manage().window().maximize();
 JavascriptExecutor js = (JavascriptExecutor) driver;
 js.executeScript("javascript:window.scrollBy(250,350)");

 Thread.sleep(10000);



 //Implementation 1
 WebDriverWait wait = new WebDriverWait(driver,30);
 wait.until(ExpectedConditions.frameToBeAvailableAndSwitchToIt(framename));
 driver.findElement(By.xpath(stateXpath)).click();
}
}



But if you get the correct xpath there won't be any issue in automating any state in here. Also need to keep in mind that we have to use js.executeScript to execute the click, normal click will not work for this scenario.

package org.example;

import io.github.bonigarcia.wdm.WebDriverManager;
import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;

import java.util.List;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.chrome.ChromeOptions;
import org.openqa.selenium.support.ui.ExpectedConditions;
import org.openqa.selenium.support.ui.WebDriverWait;


/**
 * Hello world!
 *
 */
public class App
{
public static WebDriver driver;

 public static void main( String[] args ) throws InterruptedException {

String state ="Georgia";
 By framename = By.xpath("//iframe[contains(@id,'map-instance')]");




 ChromeOptions chromeOptions = new ChromeOptions();
 WebDriverManager.chromedriver().setup();
 driver = new ChromeDriver(chromeOptions);

 driver.get("https://petdiseasealerts.org/forecast-map#/");

 driver.manage().window().maximize();
 JavascriptExecutor js = (JavascriptExecutor) driver;
 js.executeScript("javascript:window.scrollBy(250,350)");

 Thread.sleep(10000);


 //Implementation 2
 String commonXpath = "//*[@id='regions']/*[@class='region']";
 WebDriverWait wait = new WebDriverWait(driver,30);
 wait.until(ExpectedConditions.frameToBeAvailableAndSwitchToIt(framename));
 List<WebElement> statesList = driver.findElements(By.xpath(commonXpath));
 System.out.println("States count: "+ statesList.size());

 String newXpath = commonXpath +
"/*[@class='rpath']/*[contains(@name,'"+state+"')]";
 js.executeScript("arguments[0].dispatchEvent(new Event('click'))",
driver.findElement(By.xpath(newXpath)));



 }
}

Thats the best solution for this scenario.


Labels:

Comments

Post a Comment

Popular posts from this blog

Creating fully functional page object model automation framework with Playwright in 1 hour

 We are back with another 1hour tutorial  😇 . This time we will be creating Playwright and Typescript page object model framework. For this we will be using Visual Studio Code editor. Hope you have a basic idea on Playwright. There are plenty of resources you can refer to get the basic idea of the Playwright. In this tutorial we will be focussing more on how to implement Page Object model in Playwright. So let's begin. Before all of this, you must need to have  node js  installed. I hope you have already done that. 1. Download the relevant nodejs packages by using following command  npm init playwright@latest 2. Lets create our project structure. Unlike Selenium 1 hour lesson for this we will be creating just two folders. To write page objects we use "pages" folder and to write tests we create "tests" folder. Just for now, run the default tests which Playwright automatically create with its installation. use  npx playwright test command in your CMD. By de...
Post a Comment
Read more

How to create Push Notification System for your Cordova app with OneSignal and Firebase

H ello Everyone, today i'm going to show you how to add push notification system for your Cordova mobile app with OneSignal. First let's talk little bit about OneSignal. OneSignal is a multi-platform push notification service, which gives you variety of features. It lets you to send push notifications to almost all current mobile Operating Systems. You can check out their documentation if you want or start straightly this tutorial. If you need to see the project structure  and stuff  go to github repo Lets begin our tutorial 😎😎😎 First lets create a Cordova project. type following command in your CMD.    C:\Users\acer>cordova create push There will be a structure like this,      Now run android emulator, if you don't know how to run emulator from your CMD see this tutorial and do it exactly like that. Go to your project folder and then type the following command in your CMD  C:\Users\acer\push>cordova platfor...
2 comments
Read more

How to deploy Android Emulator from CMD in Windows

First go to your C drive Then find Users folder and your Personal folder in my case acer Then go to .android folder Now first you have to check what are the available emulators first emulator -list-avds you will get some thing like this, if not you have to create emulator device first .  Now run following command by specifying which device you want. For me i will pick Nexus_5_API_24 emulator -avd Nexus_5_API_24 And your job is done.
Post a Comment
Read more