Scroll to Element in Selenium WebDriver

Scroll to Element is a Selenium WebDriver technique used to move the browser viewport until a specific web element becomes visible or reaches a desired position inside the viewport. It is especially useful when the target element is located below the currently visible area of a long webpage.

In Selenium automation, scrolling to a particular element can be performed using JavaScriptExecutor's scrollIntoView() method or Selenium's Actions API. The technique is commonly used before interacting with buttons, forms, checkboxes, tables, products, links, footer sections, dynamically loaded content, and other elements that are outside the current viewport.

JustAcademy's Selenium training curriculum covers Selenium WebDriver, WebElements, advanced browser interactions, waits and synchronization, Actions class, dynamic elements, TestNG, Page Object Model, automation frameworks, and practical automation projects.

Selenium Training Course | Register for Course Demo

1. What is Scroll to Element?

Scroll to Element means moving the webpage viewport so that a particular HTML element comes into the visible area of the browser window.

For example, consider a long registration page:

Header

    ↓
Personal Information
    ↓
Address
    ↓
Education
    ↓
Experience
    ↓
Terms and Conditions
    ↓
Submit Button

If the Submit Button is below the current viewport, Selenium can scroll directly to that element before interacting with it.

2. Why is Scroll to Element Required?

• The target element may be below the current viewport.
• The webpage may contain a large amount of content.
• The element may be located near the bottom of the page.
• A long form may contain fields outside the visible area.
• A product may appear far down an e-commerce page.
• A dashboard may contain scrollable reports.
• Lazy-loaded content may become available after scrolling.
• Infinite-scroll applications may require progressive scrolling.
• A sticky header may cover an element after scrolling.
• Scrolling can make element interaction and debugging easier.

3. Basic Scroll to Element Flow

Open Browser

      ↓
Open Web Application
      ↓
Locate Target Element
      ↓
Wait for Element
      ↓
Scroll Target into View
      ↓
Check Element State
      ↓
Perform Action
      ↓
Validate Result

4. Common Ways to Scroll to an Element

5. Using JavaScriptExecutor

The most common method for scrolling directly to a specific element is JavaScript's scrollIntoView().

JavascriptExecutor js = (JavascriptExecutor) driver;

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

6. Understanding JavascriptExecutor

JavascriptExecutor is a Selenium interface that allows Java code to execute JavaScript in the current browser context.

JavascriptExecutor js =

    (JavascriptExecutor) driver;

After creating the object, JavaScript can be executed using executeScript().

7. Basic scrollIntoView() Example

WebElement element =

    driver.findElement(By.id("submit"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView();",
    element
);

8. Understanding arguments[0]

The arguments[0] expression represents the first argument supplied to JavaScript through Selenium.

js.executeScript(

    "arguments[0].scrollIntoView();",
    element
);

Here:

• arguments[0] = the first JavaScript argument
• element = Selenium WebElement passed to the script
• scrollIntoView() = browser DOM method used for scrolling

9. Scroll Element to the Top

js.executeScript(

    "arguments[0].scrollIntoView(true);",
    element
);

The element is generally positioned toward the top of the viewport.

10. Scroll Element to the Bottom

js.executeScript(

    "arguments[0].scrollIntoView(false);",
    element
);

The element is generally positioned toward the bottom of the viewport.

11. Scroll Element to the Center

Center positioning is particularly useful on pages containing sticky navigation bars.

js.executeScript(

    "arguments[0].scrollIntoView({block:'center'});",
    element
);

12. Why Center Alignment is Useful

• The target is easier to see.
• A fixed header is less likely to cover the element.
• It provides a predictable visual position.
• It is useful before screenshots.
• It is convenient for debugging automated tests.

13. Scroll to Start Position

js.executeScript(

    "arguments[0].scrollIntoView({block:'start'});",
    element
);

14. Scroll to End Position

js.executeScript(

    "arguments[0].scrollIntoView({block:'end'});",
    element
);

15. Using Nearest Position

js.executeScript(

    "arguments[0].scrollIntoView({block:'nearest'});",
    element
);

nearest attempts to move the element into view with minimal scrolling.

16. Smooth Scrolling

js.executeScript(

    "arguments[0].scrollIntoView({
        behavior:'smooth',
        block:'center'
    });",
    element
);

Smooth scrolling produces an animated movement. In automated tests, synchronization should still be based on meaningful application conditions rather than assuming that a visual animation has completed.

17. Scroll and Click

WebElement button =

    driver.findElement(By.id("submit"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    button
);
 
button.click();

When possible, use Selenium's normal click() after scrolling instead of automatically replacing it with a JavaScript click.

18. Scroll and Type

WebElement username =

    driver.findElement(By.id("username"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    username
);
 
username.clear();
username.sendKeys("admin");

19. Scroll to a Checkbox

WebElement checkbox =

    driver.findElement(By.id("terms"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    checkbox
);
 
if (!checkbox.isSelected()) {
    checkbox.click();
}

20. Scroll to a Radio Button

WebElement radio =

    driver.findElement(By.id("male"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    radio
);
 
radio.click();

21. Scroll to a Dropdown

WebElement dropdown =

    driver.findElement(By.id("country"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    dropdown
);
 
dropdown.click();

22. Scroll to a Form Field

WebElement email =

    driver.findElement(By.id("email"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    email
);
 
email.sendKeys("[email protected]");

23. Scroll to a Submit Button

WebElement submit =

    driver.findElement(
        By.cssSelector("button[type='submit']")
    );
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    submit
);
 
submit.click();

24. Scroll to a Link

WebElement link =

    driver.findElement(By.linkText("Contact Us"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    link
);
 
link.click();

25. Scroll to an Image

WebElement image =

    driver.findElement(By.cssSelector(".product-image"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    image
);

26. Scroll to a Web Table

WebElement table =

    driver.findElement(By.id("employeeTable"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    table
);

27. Scroll to a Specific Table Row

WebElement row =

    driver.findElement(
        By.xpath("//table[@id='employees']//tr[10]")
    );
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    row
);

28. Scroll to a Footer

WebElement footer =

    driver.findElement(By.tagName("footer"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    footer
);

29. Scroll to a Product

WebElement product =

    driver.findElement(
        By.xpath("//h3[text()='Laptop']")
    );
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    product
);

30. Using Actions Class

Selenium's Actions API also provides a scrolling operation for a particular element.

WebElement element =

    driver.findElement(By.id("submit"));
 
Actions actions =
    new Actions(driver);
 
actions.scrollToElement(element).perform();

31. scrollToElement() Syntax

Actions actions = new Actions(driver);

 
actions
    .scrollToElement(element)
    .perform();

32. JavaScriptExecutor vs Actions

33. Scroll to Element with Explicit Wait

Scrolling should not be treated as a replacement for synchronization. If the element is dynamically created, first wait for the required condition.

WebDriverWait wait =

    new WebDriverWait(
        driver,
        Duration.ofSeconds(10)
    );
 
WebElement element = wait.until(
    ExpectedConditions.visibilityOfElementLocated(
        By.id("submit")
    )
);
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    element
);

34. Scroll and Wait for Clickability

WebDriverWait wait =

    new WebDriverWait(
        driver,
        Duration.ofSeconds(10)
    );
 
WebElement element = wait.until(
    ExpectedConditions.visibilityOfElementLocated(
        By.id("submit")
    )
);
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    element
);
 
wait.until(
    ExpectedConditions.elementToBeClickable(element)
).click();

35. Why Explicit Wait is Important?

• The element may not initially exist.
• The element may be dynamically rendered.
• The application may still be loading data.
• JavaScript frameworks may update the DOM.
• The element may be visible but not yet clickable.
• Lazy-loaded sections may appear after scrolling.

36. Scroll to Element in a Long Registration Form

WebElement phone =

    driver.findElement(By.id("phone"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    phone
);
 
phone.clear();
phone.sendKeys("9876543210");

37. Scroll to Element in an E-Commerce Application

WebElement addToCart =

    driver.findElement(
        By.xpath("//button[text()='Add to Cart']")
    );
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    addToCart
);
 
addToCart.click();

38. Scroll to Element in a Dashboard

WebElement report =

    driver.findElement(By.id("salesReport"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    report
);

39. Scroll to Element Before Hover

WebElement menu =

    driver.findElement(By.id("products"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    menu
);
 
Actions actions =
    new Actions(driver);
 
actions.moveToElement(menu).perform();

40. Scroll to Element Before Double Click

WebElement item =

    driver.findElement(By.id("item"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    item
);
 
new Actions(driver)
    .doubleClick(item)
    .perform();

41. Scroll to Element Before Right Click

WebElement item =

    driver.findElement(By.id("contextMenu"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    item
);
 
new Actions(driver)
    .contextClick(item)
    .perform();

42. Scroll to Element Before Drag and Drop

WebElement source =

    driver.findElement(By.id("source"));
 
WebElement target =
    driver.findElement(By.id("target"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    target
);
 
new Actions(driver)
    .dragAndDrop(source, target)
    .perform();

43. Scroll to Element Before Taking Screenshot

WebElement section =

    driver.findElement(By.id("paymentSection"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    section
);
 
section.getScreenshot(
    new File("payment-section.png")
);

44. Handling Sticky Headers

Many modern websites use fixed or sticky navigation bars. If an element is aligned directly to the top, the header may cover part of the element.

Center alignment is often a practical solution:

js.executeScript(

    "arguments[0].scrollIntoView({block:'center'});",
    element
);

45. Custom Offset for Sticky Header

If a fixed header has a known height, JavaScript can scroll to a calculated position.

js.executeScript(

    "window.scrollTo({top: arguments[0].getBoundingClientRect().top + window.pageYOffset - 100, behavior:'smooth'});",
    element
);

The value 100 represents an example header offset and should be adjusted according to the application's layout.

46. Understanding getBoundingClientRect()

getBoundingClientRect() provides the element's position and dimensions relative to the browser viewport.

Long position = (Long) js.executeScript(

    "return Math.round(arguments[0].getBoundingClientRect().top);",
    element
);

47. Scroll to Element Inside an iframe

If the element exists inside an iframe, Selenium must switch to the iframe before locating and scrolling to the element.

WebElement frame =

    driver.findElement(By.id("paymentFrame"));
 
driver.switchTo().frame(frame);
 
WebElement payButton =
    driver.findElement(By.id("pay"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    payButton
);
 
payButton.click();
 
driver.switchTo().defaultContent();

48. Scroll to Element Inside a Scrollable Div

Modern dashboards and web applications frequently contain internal scrollable panels instead of relying only on the browser's main scrollbar.

WebElement container =

    driver.findElement(
        By.cssSelector(".scroll-container")
    );
 
WebElement target =
    container.findElement(
        By.cssSelector(".target")
    );
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    target
);

49. Scroll a Specific Container

js.executeScript(

    "arguments[0].scrollTop = arguments[0].scrollTop + 500;",
    container
);

50. Window Scroll vs Container Scroll

51. Scroll to Element in a Modal

WebElement modal =

    driver.findElement(
        By.cssSelector(".modal")
    );
 
WebElement target =
    modal.findElement(
        By.cssSelector(".target")
    );
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    target
);

52. Scroll to Lazy-Loaded Element

Some applications load additional content only after the user scrolls. In such applications, the target element may not initially exist in the DOM.

WebDriverWait wait =

    new WebDriverWait(
        driver,
        Duration.ofSeconds(10)
    );
 
WebElement target = wait.until(
    ExpectedConditions.presenceOfElementLocated(
        By.id("lazyElement")
    )
);
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    target
);

53. Infinite Scroll and Target Element

In an infinite-scroll application, the automation script may need to scroll progressively until the required content becomes available.

JavascriptExecutor js =

    (JavascriptExecutor) driver;
 
for (int i = 0; i < 10; i++) {
 
    List<WebElement> products =
        driver.findElements(
            By.cssSelector(".product")
        );
 
    if (!products.isEmpty()) {
        break;
    }
 
    js.executeScript(
        "window.scrollBy(0, 700);"
    );
}

54. Avoid Blind Scrolling

If the target element is already known, repeatedly scrolling by arbitrary pixel values is usually less maintainable than scrolling directly to that element.

Prefer:

js.executeScript(

    "arguments[0].scrollIntoView({block:'center'});",
    target
);

Instead of:

js.executeScript("window.scrollBy(0, 500);");

js.executeScript("window.scrollBy(0, 500);");
js.executeScript("window.scrollBy(0, 500);");
js.executeScript("window.scrollBy(0, 500);");

55. Scroll by Amount

js.executeScript(

    "window.scrollBy(0, 500);"
);

scrollBy() moves the viewport relative to its current position.

56. Scroll to an Absolute Position

js.executeScript(

    "window.scrollTo(0, 1000);"
);

scrollTo() moves the viewport to an absolute document position.

57. Scroll to Top

js.executeScript(

    "window.scrollTo(0, 0);"
);

58. Scroll to Bottom

js.executeScript(

    "window.scrollTo(0, document.body.scrollHeight);"
);

59. Horizontal Scroll

Some tables and panels require horizontal scrolling.

js.executeScript(

    "arguments[0].scrollIntoView({block:'center', inline:'center'});",
    element
);

60. Scroll with Inline Alignment

js.executeScript(

    "arguments[0].scrollIntoView({block:'center', inline:'nearest'});",
    element
);

61. Scroll to Element in Page Object Model

In a Page Object Model framework, scrolling logic can be encapsulated in page methods or a reusable utility class.

public class RegistrationPage {

 
    private WebDriver driver;
 
    private By submitButton =
        By.id("submit");
 
    public RegistrationPage(WebDriver driver) {
        this.driver = driver;
    }
 
    public void scrollToSubmitButton() {
 
        WebElement button =
            driver.findElement(submitButton);
 
        JavascriptExecutor js =
            (JavascriptExecutor) driver;
 
        js.executeScript(
            "arguments[0].scrollIntoView({block:'center'});",
            button
        );
    }
 
    public void clickSubmit() {
        driver.findElement(submitButton).click();
    }
}

62. Reusable Scroll Utility

public class ScrollUtils {

 
    private WebDriver driver;
 
    public ScrollUtils(WebDriver driver) {
        this.driver = driver;
    }
 
    public void scrollToElement(WebElement element) {
 
        JavascriptExecutor js =
            (JavascriptExecutor) driver;
 
        js.executeScript(
            "arguments[0].scrollIntoView({block:'center'});",
            element
        );
    }
 
    public void scrollToTop() {
 
        JavascriptExecutor js =
            (JavascriptExecutor) driver;
 
        js.executeScript(
            "window.scrollTo(0, 0);"
        );
    }
 
    public void scrollToBottom() {
 
        JavascriptExecutor js =
            (JavascriptExecutor) driver;
 
        js.executeScript(
            "window.scrollTo(0, document.body.scrollHeight);"
        );
    }
}

63. Using Scroll Utility

ScrollUtils scroll =

    new ScrollUtils(driver);
 
scroll.scrollToElement(submitButton);
 
submitButton.click();

64. Scroll Utility with Center Alignment

public void scrollToElement(WebElement element) {

 
    JavascriptExecutor js =
        (JavascriptExecutor) driver;
 
    js.executeScript(
        "arguments[0].scrollIntoView({block:'center'});",
        element
    );
}

65. Scroll and Verify Text

WebElement message =

    driver.findElement(By.id("successMessage"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    message
);
 
System.out.println(
    "Message: " + message.getText()
);

66. Scroll and Verify Visibility

WebElement element =

    driver.findElement(By.id("target"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    element
);
 
System.out.println(
    "Displayed: " + element.isDisplayed()
);

67. Scroll and Verify URL After Click

WebElement contact =

    driver.findElement(By.linkText("Contact"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    contact
);
 
contact.click();
 
WebDriverWait wait =
    new WebDriverWait(
        driver,
        Duration.ofSeconds(10)
    );
 
wait.until(
    ExpectedConditions.urlContains("contact")
);

68. Scroll and Verify Application Result

WebElement submit =

    driver.findElement(By.id("submit"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    submit
);
 
submit.click();
 
WebElement success =
    new WebDriverWait(
        driver,
        Duration.ofSeconds(10)
    ).until(
        ExpectedConditions.visibilityOfElementLocated(
            By.id("success")
        )
    );
 
System.out.println(
    success.getText()
);

69. Common Exceptions

70. Handling StaleElementReferenceException

If the webpage changes its DOM after an element was located, the previously stored WebElement may become stale. In such cases, locate the element again.

WebDriverWait wait =

    new WebDriverWait(
        driver,
        Duration.ofSeconds(10)
    );
 
WebElement element = wait.until(
    ExpectedConditions.presenceOfElementLocated(
        By.id("submit")
    )
);
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    element
);

71. Handling ElementClickInterceptedException

Scrolling does not guarantee that an element is free from overlays. Check for:

• Cookie banners
• Popups
• Loading screens
• Sticky headers
• Modal dialogs
• Other overlapping elements

72. Common Mistake: Using Thread.sleep()

Do not use long fixed sleeps as the primary synchronization strategy.

Thread.sleep(5000);

Prefer explicit waits:

WebDriverWait wait =

    new WebDriverWait(
        driver,
        Duration.ofSeconds(10)
    );
 
WebElement element = wait.until(
    ExpectedConditions.visibilityOfElementLocated(
        By.id("target")
    )
);

73. Common Mistake: Using an Incorrect Locator

Scrolling cannot fix an incorrect locator. First verify that the locator identifies the intended element.

WebElement target =

    driver.findElement(
        By.id("correctElement")
    );

74. Common Mistake: Using JavaScript Click Unnecessarily

JavaScript scrolling does not mean that JavaScript clicking must also be used.

Preferred:

js.executeScript(

    "arguments[0].scrollIntoView({block:'center'});",
    element
);
 
element.click();

75. Common Mistake: Ignoring iframe Context

If the element is inside an iframe, switch to the iframe before locating the element.

driver.switchTo().frame(frameElement);

76. Common Mistake: Using Large Fixed Scroll Values

Fixed values such as 5000 pixels may behave differently on different pages, browser sizes, responsive layouts, and dynamically generated content.

77. Best Practice: Use Element-Based Scrolling

js.executeScript(

    "arguments[0].scrollIntoView({block:'center'});",
    target
);

78. Best Practice: Use Explicit Waits

WebDriverWait wait =

    new WebDriverWait(
        driver,
        Duration.ofSeconds(10)
    );
 
WebElement target = wait.until(
    ExpectedConditions.visibilityOfElementLocated(
        By.id("target")
    )
);

79. Best Practice: Use Center Alignment When Appropriate

js.executeScript(

    "arguments[0].scrollIntoView({block:'center'});",
    target
);

80. Best Practice: Validate the Result

The objective of an automation test is not simply to scroll. After scrolling and interacting with the element, verify the expected business result.

element.click();

 
wait.until(
    ExpectedConditions.visibilityOfElementLocated(
        By.id("successMessage")
    )
);

81. Best Practice: Keep Scrolling Reusable

Large automation frameworks should avoid repeating the same JavaScript code in every test. Put common scrolling operations into a reusable utility.

82. Best Practice: Re-Locate Dynamic Elements

For applications that frequently refresh or update the DOM, locate elements close to the time of interaction to reduce stale element problems.

83. Best Practice: Separate Scrolling from Business Logic

Scrolling is an interaction utility. Business methods should describe meaningful actions such as submitRegistration(), selectPaymentMethod(), or addProductToCart().

84. Scroll to Element in Headless Browser

Scrolling also works in headless execution. However, viewport dimensions and responsive layout can affect what appears in the visible area, so tests should avoid assumptions based on a single screen size.

85. Scroll to Element in Responsive Testing

Responsive layouts can move elements to different positions depending on viewport width. Element-based scrolling is generally more adaptable than relying on fixed coordinates.

86. Scroll to Element After Page Load

WebDriverWait wait =

    new WebDriverWait(
        driver,
        Duration.ofSeconds(10)
    );
 
wait.until(driver ->
    ((JavascriptExecutor) driver)
        .executeScript(
            "return document.readyState"
        )
        .equals("complete")
);
 
WebElement target =
    driver.findElement(By.id("target"));
 
((JavascriptExecutor) driver).executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    target
);

87. Scroll to Element in Dynamic Applications

Applications built using React, Angular, Vue, and other JavaScript frameworks can update the DOM after initial page loading. Tests should synchronize with the specific application condition they need instead of relying only on page-load completion.

88. Scroll to Element Before Keyboard Interaction

WebElement field =

    driver.findElement(By.id("search"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    field
);
 
field.click();
field.sendKeys("Selenium");

89. Scroll to Element in Checkout

WebElement payment =

    driver.findElement(By.id("paymentMethod"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    payment
);
 
payment.click();
 
WebElement placeOrder =
    driver.findElement(By.id("placeOrder"));
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    placeOrder
);
 
placeOrder.click();

90. Scroll to Element in Registration

WebElement terms =

    driver.findElement(By.id("terms"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    terms
);
 
if (!terms.isSelected()) {
    terms.click();
}
 
WebElement register =
    driver.findElement(By.id("register"));
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    register
);
 
register.click();

91. Scroll to Element in a Product Listing

WebElement product =

    driver.findElement(
        By.xpath(
            "//div[@class='product-card'][5]"
        )
    );
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    product
);

92. Scroll to Element in a Report

WebElement report =

    driver.findElement(By.id("monthlyReport"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    report
);
 
System.out.println(report.getText());

93. Complete Java Selenium Example

import java.time.Duration;

 
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.openqa.selenium.support.ui.ExpectedConditions;
import org.openqa.selenium.support.ui.WebDriverWait;
 
public class ScrollToElementExample {
 
    public static void main(String[] args) {
 
        WebDriver driver =
            new ChromeDriver();
 
        try {
 
            driver.manage()
                  .window()
                  .maximize();
 
            driver.get("https://example.com");
 
            WebDriverWait wait =
                new WebDriverWait(
                    driver,
                    Duration.ofSeconds(10)
                );
 
            WebElement target = wait.until(
                ExpectedConditions.visibilityOfElementLocated(
                    By.id("submit")
                )
            );
 
            JavascriptExecutor js =
                (JavascriptExecutor) driver;
 
            js.executeScript(
                "arguments[0].scrollIntoView({block:'center'});",
                target
            );
 
            wait.until(
                ExpectedConditions.elementToBeClickable(target)
            ).click();
 
        } finally {
 
            driver.quit();
        }
    }
}

94. TestNG Example

import org.testng.annotations.Test;

 
public class ScrollTest {
 
    @Test
    public void scrollToElementTest() {
 
        WebElement target =
            driver.findElement(By.id("submit"));
 
        JavascriptExecutor js =
            (JavascriptExecutor) driver;
 
        js.executeScript(
            "arguments[0].scrollIntoView({block:'center'});",
            target
        );
 
        target.click();
    }
}

95. Practical Scroll-to-Element Workflow

Launch Browser

      ↓
Open Application
      ↓
Wait for Page/Application
      ↓
Locate Target Element
      ↓
Verify Frame/Window Context
      ↓
Scroll Element into View
      ↓
Wait for Interaction State
      ↓
Perform Selenium Action
      ↓
Validate Result
      ↓
Capture Screenshot/Logs if Required

96. Interview Question: What is Scroll to Element in Selenium?

Scroll to Element is the process of moving the browser viewport until a particular Selenium WebElement becomes visible or is positioned appropriately within the viewport. It is commonly implemented using JavaScript scrollIntoView() or Selenium Actions.

97. Interview Question: How do you scroll to a specific element?

WebElement element =

    driver.findElement(By.id("target"));
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    element
);

98. Interview Question: What is scrollIntoView()?

scrollIntoView() is a browser DOM method that scrolls an element into the visible portion of its scrollable container.

99. Interview Question: What is the difference between scrollIntoView(true) and scrollIntoView(false)?

scrollIntoView(true) generally aligns the element toward the top of the viewport, while scrollIntoView(false) generally aligns it toward the bottom.

100. Interview Question: How do you scroll an element to the center?

js.executeScript(

    "arguments[0].scrollIntoView({block:'center'});",
    element
);

101. Interview Question: Can Selenium scroll to an element without JavaScript?

Yes. Selenium's Actions API provides scrollToElement().

new Actions(driver)

    .scrollToElement(element)
    .perform();

102. Interview Question: Does scrolling guarantee that an element can be clicked?

No. Scrolling only changes the viewport position. The element may still be blocked by an overlay, disabled, stale, outside the correct frame, or otherwise unavailable for interaction.

103. Interview Question: Should JavaScript click always be used after scrolling?

No. JavaScript scrolling and JavaScript clicking are separate operations. When normal Selenium interaction works, prefer the normal Selenium click() method.

104. Interview Question: How do you handle an element inside an iframe?

Switch to the iframe first, locate the element inside the frame, and then scroll to it.

driver.switchTo().frame(frame);

 
WebElement element =
    driver.findElement(By.id("target"));
 
((JavascriptExecutor) driver).executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    element
);

105. Interview Question: What is the difference between scrollTo() and scrollBy()?

106. Interview Question: How do you scroll to the bottom?

js.executeScript(

    "window.scrollTo(0, document.body.scrollHeight);"
);

107. Interview Question: How do you scroll to the top?

js.executeScript(

    "window.scrollTo(0, 0);"
);

108. Interview Question: How do you handle a sticky header?

One approach is to use center alignment:

js.executeScript(

    "arguments[0].scrollIntoView({block:'center'});",
    element
);

For a layout requiring a specific offset, a calculated scroll position can be used.

109. Interview Question: Why is fixed-pixel scrolling less reliable?

Fixed pixel values depend on the page layout and viewport. Responsive designs, dynamic content, browser dimensions, and different screen sizes can change the target's position.

110. Interview Question: What should you do when the target element is dynamically loaded?

Wait for the required element or application condition, locate the element, and then scroll to it.

111. Interview Question: Can scrollIntoView() work inside a scrollable div?

Yes. It can bring the target element into view within its relevant scrollable container.

112. Interview Question: What is the role of explicit wait?

Explicit wait synchronizes the automation with a specific condition, such as visibility, presence, or clickability, before the test interacts with the target.

113. Quick Revision Table

114. Scroll to Element Checklist

• Identify the correct target element.
• Use a stable locator.
• Wait for the element when necessary.
• Check the correct iframe or window context.
• Scroll the target into view.
• Use center alignment when sticky headers are present.
• Prefer native Selenium interaction after scrolling.
• Handle overlays separately.
• Re-locate elements after major DOM changes.
• Validate the expected business result.
• Keep common scrolling operations reusable.
• Avoid unnecessary fixed-pixel scrolling.

115. Best Practice Summary

116. Final Practical Example

WebDriverWait wait =

    new WebDriverWait(
        driver,
        Duration.ofSeconds(10)
    );
 
WebElement target = wait.until(
    ExpectedConditions.visibilityOfElementLocated(
        By.id("target")
    )
);
 
JavascriptExecutor js =
    (JavascriptExecutor) driver;
 
js.executeScript(
    "arguments[0].scrollIntoView({block:'center'});",
    target
);
 
wait.until(
    ExpectedConditions.elementToBeClickable(target)
).click();
 
WebElement success = wait.until(
    ExpectedConditions.visibilityOfElementLocated(
        By.id("successMessage")
    )
);
 
System.out.println(
    "Result: " + success.getText()
);

117. Conclusion

Scroll to Element is an important Selenium WebDriver technique for handling elements that are outside the current browser viewport. The two important approaches are JavaScript scrollIntoView() and Selenium Actions scrollToElement().

A reliable Selenium test should not use scrolling as a substitute for proper synchronization or element handling. The recommended workflow is to locate the correct element, wait for the required condition, verify the correct browsing context, scroll the element into a suitable position, perform the Selenium action, and finally validate the expected application behavior.

These concepts fit naturally into a broader Selenium automation curriculum covering WebElements, Actions, waits, dynamic elements, TestNG, Page Object Model, frameworks, and practical automation projects.

Selenium Training Course | Register for Course Demo