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

How to apply Lean - Kanban for your business

This is the topic of Scrum Breakfast meetup this time, speaker: Ms. Phuong Bui - Technical Project Manager of YOOSE Pte. Ltd. http://www.meetup.com/Scrum-Breakfast-Vietnam-Agile-and-Scrum-Meetup/events/230313727/ Lean comes from Lean manufacturing is a method that focuses on elimination of wastes. In other words, this is a set of principles for archiving the quality, speed and customer alignment. The first time I knew about the term "Lean" is  from the book Software Craftsmanship . Sandro recommends if we want to transform our pet projects into a real business, we should get familiar with Lean Startup concepts. In this talk, Ms. Phuong pointed out some major wastes includes information (ex: unclear requirements), processes (ex: waiting), physical environment and people. Knowing what the problems should be the best way to eliminate them. The difference between  Single item flow and Batch processing is the second main point; and it is the Lean's idea. Batch pr...

Performance of a Data Structure

Why data structures matter The fact is that programs are all about processing data. Data structures are referred to how data is organized which affects the time of executing a program. How to measure the performance of a data structure In order to measure "how fast"/efficiency/performance of a data structure, we measure the performance of its operations. There are four basic operations including reading , searching , insertion , and deletion . A pure time consuming is not used for the measuring because it is not reliable depending on the hardware that it is run on. But instead, we use the term time complexity which refers to how many steps an operation takes. An example of how a single rule can affect efficiency Let's compare two data structures: Array and Set (with N elements). 1. Array - Reading : 1 step (because the computer has the ability to jump to any particular index in the array) - Searching : N steps (the worst case with linear search) - Inserti...

How I did customize "rasa-nlu-trainer" as my own tool

Check out my implementation here Background I wanted to have a tool for human beings to classify intents and extract entities of texts which were obtained from a raw dataset such as Rocket.chat's conversation, Maluuba Frames or  here . Then, the output (labeled texts) could be consumed by an NLU tool such as Rasa NLU. rasa-nlu-trainer was a potential one which I didn't need to build an app from scratch. However, I needed to add more of my own features to fulfill my needs. They were: 1. Loading/displaying raw texts stored by a database such as MongoDB 2. Manually labeling intents and entities for the loaded texts 3. Persisting labeled texts into the database I firstly did look up what rasa-nlu-trainer 's technologies were used in order to see how to implement my mentioned features. At first glance rasa-nlu-trainer was bootstrapped with Create React App. Create React App is a tool to create a React app with no build configuration, as it said. This too...

Adding a default text to the beginning of an text area

I have a text area where I can enter a SQL statement. The text "SELECT TOP 1" is used at the begining of the sql statement as a default prefix that can not be removed. In order to archive this functionality, I found three options: 1. Use an inputMask and build a pattern for the entered text. We can use the prefix inside the text area: http://jsfiddle.net/SEXAj/2130/ 2. Create an javascript event listener on event "input" and calculate to prevent the prefix is removed http://jsfiddle.net/sarbbottam/TUc94/ 3. Use another html tag like "div"/"span" that contains the prefix and calculate the suitable position + Tag "span": http://jsfiddle.net/4YzZy/ + Tag "div": http://jsfiddle.net/215b34fs/ I chose the 3rd approach with tag "div" because it's the most easiest solution and suitable for me at that monment. References: [1].  http://stackoverflow.com/questions/24846041/how-do-i-add-a-default-text...

My must-have apps for daily work

There is no doubt that cool apps can help us be more productive and enjoyable at work. For the time being, I really love the following apps which are used by me almost every day. 1. A personal Kanban In fact, a personal kanban is the most useful app for me. Why does it matter? It is not just a to-do list, but it keeps me motivated every day because it helps me be able to know what my "big picture" is. I usually set up my plans together with a path to reach them.  KanbanFlow  is my preferred tool. KanbanFlow 2. A terminal Needless to say, a terminal is a must-have app for every developer, especially the ones use macOS/Linux. Due to its importance, I love to decorate and enhance it to be super exciting with various tools such as  iTerm ,  oh-my- zsh , and  thefuck . ;) iTerm + oh-my-zsh 3. A documentation "ecosystem" As a developer, I can not remember all things that I have experimented a day. Moreover, a document is really useful for sharing an...