Fixing scrollIntoView in Selenium using JavascriptExecutor

To scroll to a specific element in selenium, we use scrollIntoView method.

Lets’ understand the scrollIntoView method very quickly.

scrollIntoView:

The Element interface's scrollIntoView() method scrolls the element's parent container such that the element on which scrollIntoView() is called is visible to the user

Ref: https://developer.mozilla.org/en/docs/Web/API/Element/scrollIntoView

Now let’s take an example to understand it properly

Let’s assume we want to scroll to the third search result in google search.

We will use the below code:

JavascriptExecutor jse =(JavascriptExecutor)driver;
jse.executeScript("arguments[0].scrollIntoView();", element);

Output:

The Problem statement:

This scrolls the element into view but it goes behind the header on the page (as mentioned on the above screenshot). And we will not able to view the heading of our desired search result…