Best way to wait for a spinner to disappear

General Questions
#1

Hi,

I’ve read extensively through the forums and docs, but still can’t work out the best way to wait for a save spinner to disappear. I imagine this is something needed by most if not all developers.

My current test is thinking it’s clicking on things when sometimes those things aren’t clickable at the time. The elements are in the DOM, but are sometimes obscured by a semi-transparent DIV with a spinner icon.

I’ve seen various approaches discussed and have tried a few things:

  1. Wait X seconds (bad, because the time to save is affected by load)
  2. use “Is Clickable?” — seemed to think the element was clickable when it was not (at least not by real humans)
  3. use “Click until gone” — thought the DIV was gone when it wasn’t.
  4. I’ve read about Adaptive Wait, but as far as I can tell, it seems to not wait until an element exists/doesn’t exist, but rather wait X seconds and adjust what X is.
  5. I found this forum post on the exact thing from 2020 with a feature “coming soon”, but no updates: Wait until element is not present
  6. This forum post also talks to my issue and seems like it’s been resolved, but the embedded video no longer works so I can’t see what the support engineer came up with: Continue test as soon as element disappears
  7. The docs talk about “validations” (https[://]docs[.]testproject[.]io/using-the-smart-test-recorder/available-validations), but I can’t work out how to use them in a wait loop.

I’m using the web recorder if that helps.

What’s the best way in 2022 for TestProject to do this?

Thanks, Scott

#2

Although I didn’t get a reply in the forums, I rolled up my sleeves and wrote a custom addon to do this.

In my addon you can define:

  • an xpath to an element you want to NOT exist in your DOM (the spinner)
  • the number of checks the addon will make (default: 120)
  • the wait time between checks (default 1s)
  • the number of sequential checks to make before saying the element no longer exists, which works around occasional selenium issues I’ve seen in the past (default: 2)

In my case, it’s looking for a <div class="spinner ..."></div> element. It will wait for up to 2 minutes. If the spinner disappears before the 2 minutes, the action passes. If it gets to the timeout and the spinner is still there, it fails.

I’ve shared it as “Wait for Spinner” in the addon library, and the source code is here if it can help anyone else. Feel free to fork and improve it.

Cheers, Scott