{"id":82,"date":"2016-05-01T19:44:08","date_gmt":"2016-05-01T19:44:08","guid":{"rendered":"http:\/\/loadfocus.com\/blog\/tech\/?p=82"},"modified":"2020-08-29T12:43:54","modified_gmt":"2020-08-29T12:43:54","slug":"how-to-scroll-web-page-up-or-down-using-selenium-webdriver","status":"publish","type":"post","link":"https:\/\/loadfocus.com\/blog\/tech\/2016\/05\/how-to-scroll-web-page-up-or-down-using-selenium-webdriver","title":{"rendered":"How to scroll web page UP or Down using Selenium WebDriver?"},"content":{"rendered":"<span class=\"span-reading-time rt-reading-time\" style=\"display: block;\"><span class=\"rt-label rt-prefix\"><\/span> <span class=\"rt-time\"> 3<\/span> <span class=\"rt-label rt-postfix\">minutes read<\/span><\/span><!-- pn-tldr --><h2>Key takeaways<\/h2><ul><li>Scrolling is done through the JavaScript executor, since WebDriver has no native scroll command.<\/li><li>scrollIntoView is more reliable than pixel offsets, which break on different viewports.<\/li><li>Scroll before interacting with anything below the fold or the click may miss.<\/li><\/ul><!-- \/pn-tldr -->\n<p class=\"lead\">If you want to scroll the page UP or DOWN with Selenium WebDriver in order to find web elements or make assertions, here are a few way you can do that.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">How to scroll Page Down using Selenium WebDriver:<\/h3>\n\n\n\n<p>JavaScript&nbsp;<strong>scrollBy<\/strong>() method scrolls the document by the specified number of pixels. Update the second parameter of the <strong>scrollBy<\/strong>() method with the number of pixels in order&nbsp;scroll more or less.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">The definition of the JavaScript method scrollBy() is:<\/h4>\n\n\n\n<p><code>window.scrollBy(xpixels,ypixels)<\/code><\/p>\n\n\n\n<p>where:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><strong>xpixels<\/strong> is a <em>Number<\/em> and <em>Required<\/em> parameter:\n<ul>\n<li>How many pixels to scroll by, along the x-axis (horizontal).<\/li>\n<li>Positive values will scroll to the left, while negative values will scroll to the right<\/li>\n<\/ul>\n<\/li><li><strong>ypixels<\/strong> is a <em>Number<\/em> and <em>Required<\/em> parameter:\n<ul>\n<li>How many pixels to scroll by, along the y-axis (vertical).<\/li>\n<li>Positive values will scroll down, while negative values scroll up<\/li>\n<\/ul>\n<\/li><\/ul>\n\n\n\n<p>In the examples we are using 250 pixels for vertical scrolling in order to show how scroll method works.\n<\/p>\n\n\n\n<pre class=\"wp-block-code lang-java\"><code>\n\n\n@Test(groups = {\"smoke\"})\npublic void test_Scroll_Page_Down() throws Exception {\ninit();\n\ndriver.navigate().to(\"http:\/\/www.alexa.com\/topsites\/countries;15\/LU\");\n\nJavascriptExecutor jse = (JavascriptExecutor) driver;\njse.executeScript(\"window.scrollBy(0,250)\", \"\");\n}\n\n<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">How to scroll Page UP&nbsp;using Selenium WebDriver:<\/h3>\n\n\n\n<p>Similar to scrolling Down the web page, but we set a negative number of pixels as the second parameter of the JS <strong>scrollBy<\/strong>() method to a negative number: <strong>-250<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-code lang-java\"><code>\n@Test(groups = {\"smoke\"})\npublic void test_Scroll_Page_UP() throws Exception {\ninit();\n\n\ndriver.navigate().to(\"http:\/\/www.alexa.com\/topsites\/countries;15\/LU\");\n\nJavascriptExecutor jse = (JavascriptExecutor) driver;\njse.executeScript(\"window.scrollBy(0,-250)\", \"\");\n}\n\n<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">How to scroll to the Bottom of the Web Page&nbsp;using Selenium WebDriver:<\/h3>\n\n\n\n<p>\nBasically, we get the height of the Body element from the DOM (Document Object Model) and we use the JavaScript method scrollTo() to scroll to the maximum height of the page:\n<\/p>\n\n\n\n<pre class=\"wp-block-code lang-java\"><code>\n@Test(groups = {\"smoke\"})\npublic void test_Scroll_Page_To_Bottom() throws Exception {\ninit();\n\n\ndriver.navigate().to(\"http:\/\/www.alexa.com\/topsites\/countries;15\/LU\");\n\nJavascriptExecutor jse = (JavascriptExecutor) driver;\njse.executeScript(\"window.scrollTo(0, document.body.scrollHeight)\");\n}\n\n<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">How to scroll Page to a Web Element&nbsp;Selenium WebDriver:<\/h3>\n\n\n\n<p>\nJust identify the Web Element fro the webpage and use the JS method scrollIntoView() to scroll the page to that web element until it becomes visible\n<\/p>\n\n\n\n<pre class=\"wp-block-code lang-java\"><code>\n@Test(groups = {\"smoke\"})\npublic void test_Scroll_Page_To_Element() throws Exception {\ninit();\n\n\ndriver.navigate().to(\"http:\/\/www.alexa.com\/topsites\/countries;15\/LU\");\n\nJavascriptExecutor jse = (JavascriptExecutor) driver;\n\nWebElement element = driver.findElement(By.linkText(\"Google.com.ph\"));\njse.executeScript(\"arguments[0].scrollIntoView();\", element);\n}\n<\/code><\/pre>\n\n\n\n<p><code class=\"lang-java\"><\/code><code class=\"lang-java\">\n<\/code><\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><code class=\"lang-java\">How to scroll Page Down or UP using Keys Selenium WebDriver:<\/code><\/h3>\n\n\n\n<p><code class=\"lang-java\">\nIf you want to use the keys form the keyboard to<strong> scroll UP or DOWN<\/strong> you can use the WebDriver sendKeys() method and pass the <strong>PAGE_UP<\/strong> or <strong>PAGE_DOWN<\/strong> as an argument:\n<\/code><\/p>\n\n\n\n<pre class=\"wp-block-code lang-java\"><code>\n@Test(groups = {\"smoke\"})\npublic void test_Scroll_Page_Using_Keys() throws Exception {\ninit();\n\n\ndriver.navigate().to(\"http:\/\/www.alexa.com\/topsites\/countries;15\/LU\");\n\nActions action = new Actions(driver);\naction.sendKeys(Keys.PAGE_DOWN);\nwaitSeconds(2);\naction.click(\n    driver.findElement(By.partialLinkText(\"Google.com.ph\"))\n).perform();\n}\n<\/code><\/pre>\n\n\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n\n<p>Hope you&#8217;ll find this useful. Check also how to <a href=\"https:\/\/loadfocus.com\/blog\/2013\/09\/05\/how-to-locate-web-elements-with-selenium-webdriver\/\">find web elements using Selenium WebDriver<\/a>.<\/p>\n\n\n\n<p>LoadFocus is a cloud load testing platform. <a title=\"load testing tool\" href=\"https:\/\/loadfocus.com\">Try it for free.<\/a><\/p>\n\n\n\n<p><code class=\"lang-java\"><\/code><\/p>\n<!-- pn-faq --><h2>Frequently Asked Questions<\/h2><h3>Does Selenium have a scroll command?<\/h3><p>No. Scrolling goes through the JavaScript executor, using window.scrollBy for pixel movement or scrollIntoView to bring a specific element into the viewport.<\/p><h3>Should I scroll by pixels or to an element?<\/h3><p>To the element. A pixel offset that works on your screen lands somewhere else on a different viewport or a different amount of content, whereas scrollIntoView finds the element wherever it is.<\/p><h3>Do I need to scroll before clicking?<\/h3><p>For anything below the fold, yes. An element outside the viewport can be located but not reliably clicked, and the failure looks like a bad locator rather than a scroll problem.<\/p><!-- \/pn-faq --><!-- pn-related-reading --><h2>Related reading<\/h2><ul><li><a href=\"https:\/\/loadfocus.com\/blog\/2017\/02\/how-to-open-a-new-tab-using-selenium-webdriver-with-java\">How to Open a New Tab using Selenium WebDriver with Java?<\/a><\/li><li><a href=\"https:\/\/loadfocus.com\/blog\/tech\/2015\/06\/how-to-clear-local-storage-using-selenium-webdriver\">How to Clear Local Storage using Selenium WebDriver?<\/a><\/li><li><a href=\"https:\/\/loadfocus.com\/blog\/2014\/06\/how-to-take-snapshots-of-the-browser-using-selenium-webdriver\">How to take screenshots with Selenium WebDriver<\/a><\/li><\/ul>","protected":false},"excerpt":{"rendered":"<p><span class=\"span-reading-time rt-reading-time\" style=\"display: block;\"><span class=\"rt-label rt-prefix\"><\/span> <span class=\"rt-time\"> 3<\/span> <span class=\"rt-label rt-postfix\">minutes read<\/span><\/span>Key takeaways Scrolling is done through the JavaScript executor, since WebDriver has no native scroll command. scrollIntoView is more reliable than pixel offsets, which break on different viewports. Scroll before interacting with anything below the fold or the click may miss. If you want to scroll the page UP or DOWN with Selenium WebDriver in&#8230;  <a href=\"https:\/\/loadfocus.com\/blog\/tech\/2016\/05\/how-to-scroll-web-page-up-or-down-using-selenium-webdriver\" class=\"more-link\" title=\"Read How to scroll web page UP or Down using Selenium WebDriver?\">Read more &raquo;<\/a><\/p>\n","protected":false},"author":1,"featured_media":502,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[44],"tags":[14,12,13],"class_list":["post-82","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ui-testing","tag-scroll-page-down-with-selenium-webdriver","tag-scroll-page-with-webdriver","tag-scroll-up-with-selenium-webdriver"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/loadfocus.com\/blog\/tech\/wp-json\/wp\/v2\/posts\/82","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/loadfocus.com\/blog\/tech\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/loadfocus.com\/blog\/tech\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/loadfocus.com\/blog\/tech\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/loadfocus.com\/blog\/tech\/wp-json\/wp\/v2\/comments?post=82"}],"version-history":[{"count":12,"href":"https:\/\/loadfocus.com\/blog\/tech\/wp-json\/wp\/v2\/posts\/82\/revisions"}],"predecessor-version":[{"id":350,"href":"https:\/\/loadfocus.com\/blog\/tech\/wp-json\/wp\/v2\/posts\/82\/revisions\/350"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/loadfocus.com\/blog\/tech\/wp-json\/wp\/v2\/media\/502"}],"wp:attachment":[{"href":"https:\/\/loadfocus.com\/blog\/tech\/wp-json\/wp\/v2\/media?parent=82"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/loadfocus.com\/blog\/tech\/wp-json\/wp\/v2\/categories?post=82"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/loadfocus.com\/blog\/tech\/wp-json\/wp\/v2\/tags?post=82"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}