• Selenium Video Tutorials

Selenium Webdriver - Scroll Operations



Scrolling operations are performed on an application when we try to reach a particular element on a web page. As per the requirement, we would normally do a vertical or a horizontal scrolling.

Selenium webdriver can be used to do scrolling actions on a web page with the help of the JavaScriptExecutor(an interface). Selenium Webdriver can execute the JavaScript commands using the JavaScriptExecutor.

How to Perform Horizontal Scroll?

The horizontal scroll on a web page can be done using the scrollBy method. The scrollBy method has two parameters - horizontal and vertical pixel values. Since Selenium cannot perform scroll operations on its own, we will use the scrollBy method along with JavaScriptExecutor for achieving this.

JavascriptExecutor javascriptExecutor = (JavascriptExecutor) driver;
javascriptExecutor.executeScript("window.scrollBy(2000,0)", "");

Example - Horizontal Scroll

Let us take the example of the below page, where we would perform a horizontal scrolling.

Selenium Scroll Operations 1

On doing a horizontal scroll by a few pixels, we would get the page like the below image.

Selenium Scroll Operations 2

Code Implementation on HorizontalScrolls.java class file.

package org.example;

import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import java.util.concurrent.TimeUnit;

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

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      // adding implicit wait of 12 secs
      driver.manage().timeouts().implicitlyWait(12, TimeUnit.SECONDS);

      // Opening the webpage where we will perform horizontal scroll
      driver.get("https://www.tutorialspoint.com/selenium/practice/horizontal-scroll.php");

      // JavascriptExecutor to perform horizontal scroll by 20000, 0 pixels
      JavascriptExecutor javascriptExecutor = (JavascriptExecutor) driver;
      javascriptExecutor.executeScript("window.scrollBy(20000,0)", "");

   }
}

Output

Process finished with exit code 0

Finally, the message Process finished with exit code 0 was received, signifying successful execution of the code.

Selenium Scroll Operations 3

How to Perform Vertical Scroll?

The vertical scroll on a web page can be done using the scrollBy method. The scrollBy method has two parameters - horizontal and vertical pixel values. Since Selenium cannot perform scroll operations on its own, we will use the scrollBy method along with JavaScriptExecutor for achieving this.

JavascriptExecutor javascriptExecutor = (JavascriptExecutor) driver;
javascriptExecutor.executeScript("window.scrollBy(0,600)", "");

Example - Vertical Scroll

Let us take another example of the below page, where we would perform a vertical scroll down.

Selenium Scroll Operations 4

On doing a vertical scroll down by some pixels, we would be able to access the text - Where can I get some?

Selenium Scroll Operations 5

Code Implementation on VerticalScrolls.java class file.

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import java.util.concurrent.TimeUnit;

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

      //Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      //adding implicit wait of 12 secs
      driver.manage().timeouts().implicitlyWait(12, TimeUnit.SECONDS);

      //Opening the webpage where we will perform vertical scroll
      driver.get("https://www.tutorialspoint.com/selenium/practice/scroll-top.php");

      // JavascriptExecutor to perform vertical scroll by 0, and 1200 pixels
      JavascriptExecutor javascriptExecutor = (JavascriptExecutor) driver;
      javascriptExecutor.executeScript("window.scrollBy(0,1200)", "");

      // identify text
      WebElement t = driver.findElement
         (By.xpath("/html/body/main/div/div/div[2]/h3[3]"));
      System.out.println("Text found on vertical scroll is: " + t.getText());

      // quitting browser
      driver.quit();

   }
}

Output

Text found on vertical scroll is: Where can I get some?

Process finished with exit code 0

In the above example, we had performed a vertical scroll down by some pixels and accessed the element available only on scrolling down with the message in the console - Text found on vertical scroll is: Where can I get some?

Finally, the message Process finished with exit code 0 was received, signifying successful execution of the code.

How to Perform Vertical Scroll Down to Page Bottom?

The vertical scroll down to the bottom of the web page can be done using the scrollTo method. The scrollTo method has two parameters - horizontal and vertical pixel values.

JavascriptExecutor javascriptExecutor = (JavascriptExecutor) driver;
javascriptExecutor.executeScript
   ("window.scrollBy(0,document.body.scrollHeight)");

Example - Vertical Scroll Down To Page Bottom

Let us take another example of the below page, where we would perform a vertical scroll down to the bottom of the web page.

Selenium Scroll Operations 6

On doing a vertical scroll down to the page bottom, we would be able to access the text - Where does it come from?

Selenium Scroll Operations 7

Code Implementation on PageDownScrolls.java class file.

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import java.util.concurrent.TimeUnit;

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

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      // adding implicit wait of 12 secs
      driver.manage().timeouts().implicitlyWait(12, TimeUnit.SECONDS);

      //Opening the webpage where we will perform the scroll down
      driver.get("https://www.tutorialspoint.com/selenium/practice/scroll-top.php");

      // JavascriptExecutor to scrolling to page bottom
      JavascriptExecutor javascriptExecutor = (JavascriptExecutor) driver;
      javascriptExecutor.executeScript("window.scrollBy(0,document.body.scrollHeight)");

      // access element at page bottom after scrolling
      String text = driver.findElement
         (By.xpath("/html/body/main/div/div/div[2]/h3[4]")).getText();
      System.out.println("Get text at page bottom: " + text);

      // quitting the browser
      driver.quit();
   }
}

Output

Get text at page bottom: Where does it come from?

Process finished with exit code 0

In the above example, we had performed a vertical scroll down to the page bottom and accessed the element available only on scrolling down with the message in the console - Get text at page bottom: Where does it come from?

Finally, the message Process finished with exit code 0 was received, signifying successful execution of the code.

How to Perform Vertical Scroll Up to Page Top?

The vertical scroll down to the bottom of the web page can be done using the scrollTo method. The scrollTo method has two parameters - horizontal and vertical pixel values.

JavascriptExecutor javascriptExecutor = (JavascriptExecutor) driver;
javascriptExecutor.executeScript
   ("window.scrollTo(document.body.scrollHeight, 0)");

Example - Vertical Scroll Up To Page Top

Let us take another example of the below page, where we would perform a vertical scrolling up to the top of the web page. Like the previous example, we would first scroll down to page bottom and again scroll up to the page top.

Selenium Scroll Operations 8

On doing a vertical scroll down to the page bottom, we would be able to access the text - Where does it come from?

Selenium Scroll Operations 9

Again, on scrolling up to the page top, we would be able to access the text - Selenium - Automation Practice Form.

Selenium Scroll Operations 10

Code Implementation on PageUpScrolls.java class file.

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import java.util.concurrent.TimeUnit;

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

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      // adding implicit wait of 15 secs
      driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);

      // Opening the webpage where we will perform the scrolling
      driver.get("https://www.tutorialspoint.com/selenium/practice/scroll-top.php");

      // JavascriptExecutor to scrolling to page bottom
      JavascriptExecutor javascriptExecutor = (JavascriptExecutor) driver;
      javascriptExecutor.executeScript("window.scrollBy(0,document.body.scrollHeight)");

      // access element at page bottom after scrolling
      String text = driver.findElement
         (By.xpath("/html/body/main/div/div/div[2]/h3[4]")).getText();
      System.out.println("Get the text at page bottom: " + text);

      // JavascriptExecutor to scrolling to page top
      javascriptExecutor.executeScript("window.scrollTo(document.body.scrollHeight, 0)");

      // access element at page top after scrolling
      String text1 = driver.findElement
         (By.xpath("/html/body/div/header/div[2]/h1")).getText();
      System.out.println("Get the text at page top: " + text1);

      // quitting the browser
      driver.quit();
   }
}

Output

Get the text at page bottom: Where does it come from?
Get the text at page top: Selenium - Automation Practice Form

Process finished with exit code 0

In the above example, we had first performed a vertical scroll down to the page bottom and accessed the element available only on scrolling down with the message in the console - Get the text at page bottom: Where does it come from? Then obtained text at the page top with the message in the console - Get the text at page top: Selenium - Automation Practice Form.

Finally, the message Process finished with exit code 0 was received, signifying successful execution of the code.

How to Perform Scroll to Visibility of an Element?

The scrolling till the visibility of an element on a web page can be done with the help of the scrollIntoView method.

Example - Scroll to Element Visibility

Let us take another example of the same page, where we would perform a scrolling till the highlighted text on the below image.

Selenium Scroll Operations 11

Code Implementation on ScrollToViews.java class file.

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import java.util.concurrent.TimeUnit;

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

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      // adding implicit wait of 15 secs
      driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);

      // Opening the webpage where we will perform the scroll
      driver.get("https://www.tutorialspoint.com/selenium/practice/scroll-top.php");
      WebElement text = driver.findElement
        (By.xpath("/html/body/main/div/div/div[2]/p[7]"));

      // JavascriptExecutor to scrolling to view of an element
      JavascriptExecutor javascriptExecutor = (JavascriptExecutor) driver;
      javascriptExecutor.executeScript("arguments[0].scrollIntoView();", text);

      // get text after scrolling
      System.out.println("Get text on after scrolling to element visibility: " + text.getText());

      // quitting the browser
      driver.quit();
   }
}

Output

Get text on after scrolling to element visibility: Contrary to popular 
belief, Lorem Ipsum is not simply random text. It has roots in a piece of 
classical Latin literature from 45 BC, making it over 2000 years old. 
Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, 
looked up one of the more obscure Latin words, consectetur, from a Lorem 
Ipsum passage, and going through the cites of the word in classical 
literature, discovered the undoubtable source. Lorem Ipsum comes from 
sections 1.10.32 and 1.10.33 of "de Finibus Bonorum et Malorum" 
(The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a 
treatise on the theory of ethics, very popular during the Renaissance. 
The first line of Lorem Ipsum, "Lorem ipsum dolor 
sit amet..", comes from a line in section 1.10.32.

Process finished with exit code 0

In the above example, we had performed a scroll down to the visibility of an element on a web page and then obtained its text.

Finally, the message Process finished with exit code 0 was received, signifying successful execution of the code.

This concludes our comprehensive take on the tutorial on Selenium Webdriver - Scroll Operations. We’ve started with describing various examples on scrolling operations like how to perform vertical and horizontal scrolls by pixels, how to perform vertical scroll down to page bottom, how to do a scroll up to page top, and how to perform scrolling up to the visibility of an element on a web page with Selenium. This equips you with in-depth knowledge of the Scroll operations in Selenium. It is wise to keep practicing what you’ve learned and exploring others relevant to Selenium to deepen your understanding and expand your horizons.

Advertisements