Skip to main content

Selenium - Use Explicit Waits for checking elements quickly disappear like loading icon


I have a table that is displayed a list of competence groups. When I click on a competence group, it will display a table that contains a lot of criteria belong to the competence group. Each times I click on a competence group, a "loading" icon is displayed while waiting for all criteria is fully displayed.

<div id="loading" style="display: none;">
<div></div>
<div></div>

I tried to write a Selenium test to make sure this behavior is covered. I saw that the loading icon element is always available on DOM tree because I just used Jquery to handle its displaying. Beside that, the loading icon is appeared dynamically and quickly disappear afterwards. It is hard to checking the visibility on GUI of loading icon. By normal way that I frequently used, the code looks like:

 
public boolean isLoadingIconDisplayed() {
  List<WebElement> loadingIcons = driver.findElements(By.id("loading"));
  if(!loadingIcons.isEmpty()){
    for(WebElement loadingIcon: loadingIcons){
     if(loadingIcon.getCssValue("display").equals("none")){
      return false;
     }
    }
  };
  return true;
}

But, it did not work. I thought that I need a waiter likes a listener to check this loading appearing before clicking on table. I found the solution with Explicit Waits:
 
public boolean isLoadingIconDisplayed() {
 try {
  (new WebDriverWait(driver, 3)).until(ExpectedConditions.invisibilityOfElementLocated(By.id("loading")));
  return true;
 } catch (Exception e) {
  return false;
 }
}

"An explicit waits is code you define to wait for a certain condition to occur before proceeding further in the code".

References:

[1]. http://stackoverflow.com/questions/25239856/wait-for-loading-icon-to-disappear-from-the-page
[2]. http://stackoverflow.com/questions/12779575/selenium-how-to-locate-dynamic-element-like-notification-messages
[3]. http://docs.seleniumhq.org/docs/04_webdriver_advanced.jsp

Comments

Popular posts from this blog

BIRT - Fix the size of an image

I use a dynamic image as a logo my report in pdf. At the beginning, I use table to align the logo in left or right. I meet a problem with some images with a large width or height. My customer requires that the logo should be displayed in original size. These following steps solves my problem: 1. Use Grid instead of Table 2. Set Grid "Height" is 100%  and "Width" is blank 3. Set "Fit to container" for images are "true". Download the the template here .

Math fundamentals and Katex

It was really tough for me to understand many articles about data science due to the requirements of understanding mathematics (especially linear algebra). I’ve started to gain some basic knowledges about Math by reading a book first. The great tool Typora and stackedit with supporting Katex syntax simply helps me to display Math-related symbols. Let’s start! The fundamental ideas of mathematics: “doing math” with numbers and functions. Linear algebra: “doing math” with vectors and linear transformations. 1. Solving equations Solving equations means finding the value of the unknown in the equation. To find the solution, we must break the problem down into simpler steps. E.g: x 2 − 4 = 4 5 x 2 − 4 + 4 = 4 5 + 4 x 2 = 4 9 x = 4 9 ∣ x ∣ = 7 x = 7  or  x = − 7 \begin{aligned} x^2 - 4 &= 45\\ x^2 - 4 + 4 &= 45 + 4\\ x^2 &= 49\\ \sqrt{x}&=\sqrt{49}\\ |x| &= 7\\ x=7 &\text{ or } x=-7 \end{aligned} x 2 − 4 x 2 − 4 + 4 x 2 x ​ ∣ x ∣ x = 7 ​ = 4 5 = 4 ...

Styling Sort Icons Using Font Awesome for Primefaces' Data Table

So far, Primefaces has used image sprites for displaying the sort icons. This leads to a problem if we want to make a different style for these icons; for example, I would make the icon "arrow up" more blurry at the first time the table loading because I want to highlight the icon "arrow down". I found a way that I can replace these icons with Font Awesome icons. We will use "CSS Pseudo-classes" to achieve it. The hardest thing here is that we should handle displaying icons in different cases. There is a case both "arrow up" and "arrow down" showing and other case is only one of these icons is shown. .ui-sortable-column-icon.ui-icon.ui-icon-carat-2-n-s { background-image: none; margin-left: 5px; font-size: 1.1666em; position: relative; } .ui-sortable-column-icon.ui-icon.ui-icon-carat-2-n-s:not(.ui-icon-triangle-1-s)::before { content: "\f106"; font-family: "FontAwesome"; position: ...

A Template for Software Engineering Standards

Software engineering standard template A well-structured standard acts as a blueprint that guides engineers in their daily tasks and long-term goals. Below, I will outline a template for creating a comprehensive software engineering standard. Header The header serves as the document's identifier. It contains the following: Authors : The people who have contributed to the creation of the standard. Created Date : The date when the document was initially created. Version : The version of the standard. It is typically updated with significant changes. Status : The current status of the document, whether it's in draft, in-review, or official. Next Review Date : The date when the standard will be reviewed for relevancy and accuracy. Table of Contents A table of contents provides an overview of what the document contains, making it easier for readers to navigate through the document. Body The body of the standard comprises: Values : The core beliefs that guide the decision-maki...

Improving the execution time of CI pipelines

Executing a large number of tests, especially integration tests, takes a lot of time. For instance, the pipeline of one of our projects for each Pull Request previously took nearly 30 minutes, including over 1 thousand test cases. This article guides you through several good techniques that we have discovered and applied to improve the time-consuming process. Parallel stages Analyze the current phases in your pipeline and categorize them in parallel. For example, we can separate the build and verify code of Node.js and Maven modules simultaneously in our Jenkins pipelines. Please mind using the setting failFast whether you want to abort the pipeline immediately. Read more: Parallel stages with Declarative Pipeline 1.2 (jenkins.io) Parallel test execution If you use Maven, t he plugin maven-failsafe-plugin is used to execute integration tests during phases integration-test and verify  the build lifecycle. It allows us to execute tests in parallel. There are many settings related ...