How to Scroll Down or Up using Selenium Webdriver

Test Scroll Down to an Element in Selenium on real devices for real-like testing experience

guide-banner-qals-1x
Home Guide How to Scroll Down or Up using Selenium Webdriver

How to Scroll Down or Up using Selenium Webdriver

Scrolling is a core functionality of every modern web page, and testers must validate it to ensure a seamless user experience. While Selenium WebDriver can interact with the DOM directly, certain elements like buttons or forms become visible only after scrolling. In such cases, automating scroll operations becomes essential.

Overview

Goal of Scrolling in Selenium WebDriver

Automate vertical and horizontal scrolling to access and interact with hidden elements during test execution.

Key Scrolling Techniques in Selenium

  • Scroll by Pixels: Use scrollBy(x, y) to move vertically or horizontally by a defined number of pixels
  • Scroll to Element Visibility: Apply scrollIntoView() to bring target elements into the viewport
  • Scroll to Page Bottom: Fetch document.body.scrollHeight to navigate directly to the end of a webpage
  • Horizontal Scroll: Move sideways until the specified element is fully visible

Implementation Highlights

  • Powered by JavaScriptExecutor for executing scroll functions from Selenium scripts
  • Flexible control with positive (down/right) and negative (up/left) pixel values
  • Compatible with major browsers like Chrome, Firefox, and Safari
  • Reusable scripts for pixel-based, element-based, and full-page scrolling

Business Impact of Automating Scroll in Selenium

  • Ensures all UI elements, even hidden ones, are tested
  • Improves test coverage and reliability of automation suites
  • Reduces manual effort in validating page layout and interactions
  • Boosts product quality with consistent cross-browser validation
  • Accelerates release cycles by integrating with CI/CD pipelines on BrowserStack’s Real Device Cloud

This guide explains how to implement vertical, horizontal, and element-specific scrolling in Selenium using JavaScriptExecutor.

How to scroll down on a web page in Selenium by defining the number of pixels

Refer to the script below for performing Selenium scroll-down action on the Firefox browser.

import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.annotations.Test;

public class HandleScroll 
{

 @Test
 public void scrollDown()
         {
          System.setProperty("webdriver.gecko.driver","D://Selenium    Environment//Drivers//geckodriver.exe");
            WebDriver driver = new FirefoxDriver();
            driver.navigate().to("Website URL");

            //to perform Scroll on application using Selenium
            JavascriptExecutor js = (JavascriptExecutor) driver;
            js.executeScript("window.scrollBy(0,350)", "");
         }
}

Run Selenium Tests on Real Devices

Output: The code initializes the Geckodriver for Firefox. Then the Firefox browser is launched, and it navigates to the specified website URL. Once the website loads, the browser window is vertically scrolled down by 350 pixels.

If a user needs to scroll up, they just need to modify the pixel value of the second parameter (in this case 350) to a negative value (-350).

Refer to the script below:

import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.annotations.Test;

public class HandleScroll
{
     @Test
     public void scrollDown()

  {
      System.setProperty("webdriver.gecko.driver","D://Selenium Environment//Drivers//geckodriver.exe");

      WebDriver driver = new FirefoxDriver();
      driver.navigate().to("Website URL"); // Specify the website URL

       //to perform Scroll on application using Selenium
       JavascriptExecutor js = (JavascriptExecutor) driver;
       js.executeScript("window.scrollBy(0,-350)", "");
   }

}

BrowserStack Automate Banner 6BrowserStack Automate Banner 6

How to scroll down to an element in Selenium until it is visible

Refer to the Selenium script below.

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 org.testng.annotations.Test;

public class ScrollByVisibleElement {

    WebDriver driver;
    @Test
    public void ByVisibleElement() {
        System.setProperty("webdriver.gecko.driver","D://Selenium Environment//Drivers//geckodriver.exe"); 
        WebDriver driver = new FirefoxDriver();
        JavascriptExecutor js = (JavascriptExecutor) driver;

        //Launch the application		
        driver.get("https://www.browserstack.com/guide/selenium-scroll-tutorial");

        //Locating element by link text and store in variable "Element"        		
        WebElement Element = driver.findElement(By.linkText("Try Selenium Testing For Free"));

        // Scrolling down the page till the element is found		
        js.executeScript("arguments[0].scrollIntoView();", Element);
    }
}

Run Selenium Tests on Real Devices

Output: The above code when executed, will launch the Firefox browser, navigate to the defined URL (Selenium scroll tutorial). Further, it will perform the scroll down until the element with text –  Try Selenium Testing For Free is found.

Selenium Scroll to an elementSelenium Scroll to an element

The Javascript method scrollIntoView() performs the scroll down operation until the mentioned element is completely visible.

How to scroll down to the bottom of the webpage using Selenium?

Refer to the Selenium script below.

import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.annotations.Test;

public class HandleScroll

{
  @Test
  public void scrollDown()

  {

   System.setProperty("webdriver.gecko.driver","D://Selenium Environment//Drivers//geckodriver.exe");

   WebDriver driver = new FirefoxDriver();
   driver.navigate().to("Website URL"); // Specify the Website URL

   //to perform scroll on an application using Selenium

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

  }
}

Output: The code above will fetch the maximum height of the webpage from the Document Object Model, and then the scrollBy() method scrolls down to the bottom.

Pro Tip: Want to dive deeper into Selenium implementation on BrowserStack with free interactive courses and lab exercises? Visit Test University

Talk to an Expert

How to scroll horizontally on a web page to a specific web element using Selenium

Refer to the Selenium script below:

import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.annotations.Test;

public class HandleScroll 
{

     @Test
     public void ScrollHorizontally()

     {

        System.setProperty("webdriver.gecko.driver","D://Selenium Environment//Drivers//geckodriver.exe");
        WebDriver driver = new FirefoxDriver();

        JavascriptExecutor js = (JavascriptExecutor) driver;

         // Launch the application
         driver.get(" Website URL “); // Specify the website URL

         WebElement Element = driver.findElement(By.linkText("Auto Testing"));

         //This will scroll the page Horizontally till the element is found
         js.executeScript("arguments[0].scrollIntoView();", Element);

      }

}

Output: The code above starts the Firefox browser and navigates to the specified URL. Once the page loads, Selenium will automatically detect the specified element on the web page and will scroll horizontally until the element is fully visible in the browser window.

Testing the scroll function is non-negotiable, as it is one of the most fundamental features of a web page. Teams prefer platforms like BrowserStack that help them write a number of automated selenium tests, including operations like scrolling in Selenium for testing websites on multiple browsers like Chrome, Firefox, Safari. Using BrowserStack’s Real Device Cloud you can test your website on 3000+ real devices and browsers for a maximum test coverage. It ensures accurate test results by taking real user conditions into account while testing as opposed to testing on Emulators and Simulators that just mimic the device.

Besides BrowserStack also provides integrations with popular CI/CD tools such as Jenkins, CircleCI, Travis, and more. You can also perform cross browser testing at scale by running tests on multiple device-browser combinations simultaneously with parallel testing using BrowserStack’s Cloud Selenium Grid.

Try BrowserStack for Free

Tags
Automation Testing Selenium Selenium Webdriver

Get answers on our Discord Community

Join our Discord community to connect with others! Get your questions answered and stay informed.

Join Discord Community
DiscordDiscord