Selenium: How selenium identifies elements visible or not? Is is possible that it is loaded in DOM but not rendered on UI?
Asked Answered
T

1

4
  1. Selenium: How selenium identifies elements visible or not? Is is possible that it is loaded in DOM but not rendered on UI? I would like to verify a scenario where element is clickable, I know web drive has method "ElementToBeClickable" however, I would like to know the inner working. Please help me on this.
  2. Also,how to handle a scenario where the element is loaded in the DOM but UI shows loading in progress, how to wait for complete load?
  3. Please let me know, if the UI is not loaded then will selenium directly call the DOM element or if UI element is being loaded then it will fail the execution? I would really appreciate more technical explanation on this.
Tradespeople answered 26/2, 2018 at 12:55 Comment(0)
B
5
  • Selenium can identify the presence or visibility of the elements as soon as they are present or visible in the HTML DOM. From user perspective you can invoke isDisplayed() method on an WebElement to examine if the intended WebElement is displayed or not. As per current implementation Selenium may not be distinguishing between loaded and rendered elements. The ElementToBeClickable method in ExpectedConditions class sets an expectation for checking if an element is visible and enabled so that you can click it.

  • When the element is loaded in the DOM but UI shows loading in progress you still have to wait for the JavaScript and AJAX Calls to complete loading the page so all the WebElements on the page becomes interactable. At most to wait for complete load you can set the pageLoadStrategy to normal but may still have to induce WebDriverWait for the intended WebElement to become present, visible, interactable or clickable.

Here you can find a detailed discussion on Page load strategy

  • Of-coarse if the UI is not loaded Selenium may not be able to interact with a few of the DOM elements.

Update

As per your counter question here are the different stages of an WebElement and the respective ExpectedConditions to check the stages :

  • Presence of an element :

     presenceOfElementLocated(By locator)
     An expectation for checking that an element is present on the DOM of a page. This does not necessarily mean that the element is visible.
    
  • Visibility of an element :

     visibilityOf(WebElement element)
     An expectation for checking that an element, known to be present on the DOM of a page, is visible. Visibility means that the element is not only displayed but also has a height and width that is greater than 0.
    
  • Element to be Clickable :

     elementToBeClickable(By locator)
     An expectation for checking an element is visible and enabled such that you can click it.
    

Note : As per the docs Element is Clickable - it is Displayed and Enabled.

Bernitabernj answered 26/2, 2018 at 13:54 Comment(4)
Thanks for quick reply, Please allow me to ask follow-up query, about ElementToBeClickable, I have gone through the official docs and stiil confused with the statement "An expectation for checking an element is visible and enabled such that you can click it." does this mean it will click only when it is visible on the UI or it has something to do with DOM again, I know the literal meaning but still would like to be sure about. Please helpTradespeople
Thanks. Please bear with me and allow me to ask follow-up queries, 1) for visibility of an element and Element to be Clickable, both are partially related to DOM, when it say's "element displayed but also has a height and width that is greater than 0" does this mean it is checking the UI element is actually displayed or based on downloaded css it determines that element is displayed. The only point I am trying to ensure that 2.) Is there any way to assert that element is actually displayed on the web page or just based on DOM and loaded css, html selenium is performing actions?Tradespeople
presence, visibility(displayed) and interactability(clickability) all are related to different states of an WebElement with in the HTML DOM. The states are distinct. Use the appropriate ExpectedConditions as per your requirement.Bernitabernj
Thanks a lot for clarificationTradespeople

© 2022 - 2024 — McMap. All rights reserved.