Scrolling a Web Page Up or Down using Selenium WebDriver

Posted By : Neha Dahiya | 07-Jun-2018

For performing Scroll operation in Selenium, JavaScriptExecutor interface is used that executes JavaScript methods through Selenium WebDriver.

 

Syntax: JavascriptExecutor js = (JavascriptExecutor) driver;  
             js.executeScript(Script,Arguments);

Let’s look at different scenarios to scroll down using Selenium WebDriver:

  • To scroll down the web page by pixel
  • ?To scroll down the web page by visibility of the element?
  • To scroll at the bottom of the web page

 

To scroll down the web page by pixel:

Find the Script to scroll down the web page by pixel below

 

package ScrollUpDown;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.Test;

public class Scroll
{
	@Test
	public void scroll()
	{
		System.setProperty("webdriver.chrome.driver", "./exefiles/chromedriver");
		WebDriver driver=new ChromeDriver();
		driver.manage().window().maximize();
		JavascriptExecutor js = (JavascriptExecutor) driver;
		driver.get("http://demo.guru99.com/test/guru99home/");
		driver.manage().timeouts().implicitlyWait(60, TimeUnit.SECONDS);
		js.executeScript("window.scrollBy(0,1000)");	
	}
}

 

Description: In the above code, the page is scrolled by 1000 pixels using the executeScript. ScrollBy() method is used to scroll the page to the specified number of pixels.

ScrollBy() methods is used as follows :

executeScript("window.scrollBy(x-pixels,y-pixels)");

If number is positive X-pixels moves to the left and if negative moves to the right.

If number is positive y-pixels moves downwards and if number is negative moves in downward direction.

For example: js.executeScript("window.scrollBy(0,1000)");

This will scroll down vertically down by 1000 pixels

 

To scroll down the web page by the visibility of the element.

 

Find the below Script to scroll down the web page by visibility of the element


package ScrollUpDown;
import java.util.concurrent.TimeUnit;
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 Scroll
{
	@Test
	public void scroll()
	{
		System.setProperty("webdriver.chrome.driver", "./exefiles/chromedriver");
		WebDriver driver=new ChromeDriver();
		driver.manage().window().maximize();
		JavascriptExecutor js = (JavascriptExecutor) driver;
		driver.get("http://demo.guru99.com/test/guru99home/");
		WebElement Element = driver.findElement(By.xpath("//a[text()='Linux']"));		
		js.executeScript("arguments[0].scrollIntoView();", Element);
		driver.manage().timeouts().implicitlyWait(60, TimeUnit.SECONDS);
			
	}
}

 

Description: Using the above script we can scroll the web page until the specified element is visible on the current web page. ScrollIntoView() Javascript method is used as follows:

js.executeScript("arguments[0].scrollIntoView();",Element );    

Where arguments[0] is first index of the page and “Element ” is locator on the page.

 

To scroll down the web page at the bottom of the page

 

Find the below Script to scroll down the web page at the bottom


package ScrollUpDown;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.Test;

public class Scroll
{
	@Test
	public void scroll()
	{
		System.setProperty("webdriver.chrome.driver", "./exefiles/chromedriver");
		WebDriver driver=new ChromeDriver();
		driver.manage().window().maximize();
		JavascriptExecutor js = (JavascriptExecutor) driver;
		driver.get("http://demo.guru99.com/test/guru99home/");
		
		js.executeScript("window.scrollTo(0, document.body.scrollHeight)");
		driver.manage().timeouts().implicitlyWait(60, TimeUnit.SECONDS);
			
	}
}

 

Description : Javascript method scrollTo() is used to scroll the page till the end. js.executeScript("window.scrollTo(0, document.body.scrollHeight)");  where document.body.scrollHeight returns the height of the complete page.

 

 

Thanks!!!

Related Tags

About Author

Author Image
Neha Dahiya

Neha is a bright QA Engineer with skills in manual testing . Apart from finding bugs in application, she loves sketching and painting.

Request for Proposal

Name is required

Comment is required

Sending message..