How to verify whether an WebElement is displayed in the viewport using WebDriver?

Question

Consider the following scenario,

1. The webpage is displayed along with a vertical scroll bar
2. Scroll bar is present at the bottom
3. WebElement 'Test' is present at the top of the page and is now not visible in the current view port.

Functionality to be verified:

Clicking 'Goto Top' link in the bottom of the page should scroll the page such that the WebElement 'Test' gets displayed within the view port.

Please let me know how to verify whether an element is displayed in the current view port or not using WebDriver.

Note: element.isDisplayed will always be true in the above case as the function checks the whole page rather than checking the current view port only.

Answer 1

@Vel Ganesh - I dont know if this can be verified using selenium. But can be definitely done using Sikuli. You can check sikuli.org for details. Sikuli has a Java API and so can be integrated with WebDriver code as well.

Answer 2

Well, as the very last thing coming to my mind, I'd go for something like this:

1. get screenshot on whatever you have after clicking the link at the bottom (make sure it gives you view port screenshot only)
2. use Webdriver's window.scrollTo to go to top (see bellow)
3. repeat the 1.st step
4. compare the results of the 1.st and 3.rd step

Where for scrolling using webdriver should work following:

JavascriptExecutor js = (JavascriptExecutor)driver;
js.executeScript("window.scrollTo(0,0)");

It seems like a desperate workaround, but might be worth an effort if no other solution is suggested.