A programming language that is used to execute a set of instructions that a computer can understand and execute to perform various tasks is known as Java. Java can be controlled autonomously using various automation tools.
Table of Content
Selenium is one such tool, that can make the work of developer and tester easier. There are various instances when the user needs to click or perform a certain action on the element that is currently not in the scope of visibility. In this article, we will see how we can forcefully click on an element that is not currently visible using Selenium webdriver.
Visibility Criteria
The conditions that decide whether the element is visible or hidden within the viewport are known as visibility criteria. For performing any action on the element in the web page, either you need to make that element appear within the viewport or forcefully click that element.
Below are the different methods of forcing Selenium WebDriver to click on the element that is not currently visible:
1. Recommended Approaches
- Wait for Visibility
- Scroll the Element into View
- Address Underlying Issues
2. Less Recommended Approach
- Forceful Click using JavaScript
Wait for Visibility
There are certain scenarios in which the element becomes visible after performing certain actions. In such cases, the user can let Selenium webdriver wait until the element is visible. This can be done using ExpectedConditions.visibilityOfElementLocated function. In this approach, we will see how we can wait for the visibility of the element before clicking on it.
Syntax:
WebDriverWait wait = new WebDriverWait(driver,Duration.ofSeconds(seconds));
wait.until(ExpectedConditions.visibilityOfElementLocated(By.linkText(element_text)));
Here,
seconds: These are the seconds for which we want the user to wait for the visibility of the element.
element_text: It is the text for which the webdriver needs to wait before clicking on that element.
Example:
In this example, we have opened the Geeks For Geeks website (link) and then waited until the element containing the text ‘Trending Now’ is visible. Once it is visible, we have clicked on that element.
//Importing the Selenium librariesimport org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.ExpectedConditions;
import org.openqa.selenium.support.ui.WebDriverWait;
import java.time.Duration;
import org.openqa.selenium.By;
public class selenium3 {
public static void main(String[] args) {
// Specify the location of the driver
System.setProperty("webdriver.chrome.driver",
"C:\\Users\\Vinayak Rai\\Downloads\\chromedriver-win64\\chromedriver-win64\\chromedriver.exe");
// Initialising the driver
WebDriver driver = new ChromeDriver();
// Launch the website
// Maximize the screen
driver.manage().window().maximize();
// Add explicit wait of 5 seconds
WebDriverWait wait = new WebDriverWait(driver,Duration.ofSeconds(5));
// Wait until the element Trending Now is visible
wait.until(ExpectedConditions.visibilityOfElementLocated(By.linkText("Trending Now")));
// Click on the element
driver.findElement(By.linkText("Trending Now")).click();
}
} |
Output:
Scroll the Element into View
The certain cases where the element is not visible within the viewport, we need to scroll the element into view before performing a specific action on them. This can be done using JavascriptExecutor, which is used to perform the actions that cannot be performed through Selenium in-built functions. In this approach, we will see how we can scroll the element into view and click on that element.
Syntax:
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript(“arguments[0].scrollIntoView();”, element);
Here,
element: It is the element that has to be brought into view by scrolling.
Example:
In this example, we have opened the Geeks For Geeks website (link) and then found the element containing the text ‘Problem of the day’ which is out of the viewport. Then, we scrolled to the element using the retry mechanism till the element was clearly in the viewport and then we clicked that element.
//Importing the Selenium librariesimport org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.By;
public class selenium3 {
public static void main(String[] args) throws InterruptedException {
//specify the location of the driver
System.setProperty("webdriver.chrome.driver",
"C:\\Users\\Vinayak Rai\\Downloads\\chromedriver-win64\\chromedriver-win64\\chromedriver.exe");
//Initialising the driver
WebDriver driver = new ChromeDriver();
//Launch the website
// Maximize the screen
driver.manage().window().maximize();
// Stating the Javascript Executor driver
JavascriptExecutor js = (JavascriptExecutor) driver;
// Find Problem of the day text
WebElement element = driver.findElement(By.xpath("// *[contains(text(),'Problem of the day')]"));
int maxRetries = 10;
int retryCount = 0;
// Run while loop
while (retryCount < maxRetries) {
try {
// Scroll to the specific position
js.executeScript("arguments[0].scrollIntoView();", element);
// Click that element
if (element.isDisplayed() && element.isEnabled()) {
element.click();
break;
}
} catch (Exception e) {
// Increment retry count if element is not found
retryCount++;
if (retryCount == maxRetries) {
// Throw exception of element is not found
throw e;
} else {
// Sleep for some time
Thread.sleep(10);
}
}
}
}
} |
Output:
Address Underlying Issues
- Challenges with scrolling: In most cases, after the Selenium has scrolled to the element, still the element is not visible within the viewport. Thus the webdriver couldn’t perform any further action on that element, such as clicking, etc. Thus, we need to implement try-catch until the element is visible within the viewport and further actions can be performed on it.
- Dynamic Loading: In certain cases where the element appears at a certain time, the user doesn’t know how much time it will take the element to load, hence Selenium needs to find the element dynamically until the element is loaded. This affects the performance of the script execution.
- Appropriate element state: The user can face the challenges of performing actions on the element if the element is not in the appropriate state, i.e., disable or not clickable.
Forceful Click using JavaScript
In the cases, where above stated approaches don’t work, we need to forcefully click on an element using Javascript. This can be done using executeScript and click functions of JavascriptExecutor. In this approach, we will see how we can forcefully click an element using JavascriptExecutor.
1. executeScript: The feature of JavascriptExecutor that enables to execution of JavaScript code within the context of the current browser window is known as executeScript.
2. click(): The function that is used to simulate a mouse click action on a web element is known as the click function.
Syntax:
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript(“arguments[0].click();”, element);
Here,
element: It is the element that is out of the viewport and you want to click forcefully.
Example:
In this example, we opened the Geeks For Geeks website (link) and then found the element containing the text ‘Problem of the day’ which is out of the viewport, and then clicked on that element using JavascriptExecutor.
//Importing the Selenium librariesimport org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.By;
public class selenium3 {
public static void main(String[] args) {
// Specify the location of the driver
System.setProperty("webdriver.chrome.driver",
"C:\\Users\\Vinayak Rai\\Downloads\\chromedriver-win64\\chromedriver-win64\\chromedriver.exe");
// Initialising the driver
WebDriver driver = new ChromeDriver();
// Launch the website
// Maximize the screen
driver.manage().window().maximize();
// Stating the Javascript Executor driver
JavascriptExecutor js = (JavascriptExecutor) driver;
// Find Problem of the day text
WebElement element = driver.findElement(By.xpath("// *[contains(text(),'Problem of the day')]"));
// Forcefully click on an element
js.executeScript("arguments[0].click();", element);
}
} |
Output:
Conclusion
In conclusion, Javascript execution can help the Selenium web driver forcefully click on an element that is not currently visible. This is one of the best ways to click an element or perform some other action on an element if we are unsure about the visibility of an element. I hope after reading the various approaches mentioned in the article, you will be able to forcefully click on the element that is not currently visible using Selenium Webdriver.
FAQs
1. When the error element is not currently visible in Selenium WebDriver popped up?
The error element is not currently visible in the Selenium webdriver usually popped up when the element is not visible within the viewport, thus limiting the webdriver to perform certain actions on that element.
2. Why is the forcefully clicking of elements using Javascript a less recommended approach?
This approach is less recommended than other approaches as it bypasses the webdriver’s visibility checks. Thus, the user needs to be sure that we need to click that element or not.
3. Is there any way to determine if the element is visible or not in the viewport?
Yes, we can use the built-in function of Selenium, i.e., isDisplayed to check if the particular element is visible or not within the viewport.