Quick Tip: .wait() a Second

TL;DR - Add a .wait()

cy.get('YOUR-SELECTOR').wait(1000).click()

For the past week, I’ve been working on a simple task: automating the click of a tab within a page. This should be simple, right?

// Navigate to the page
// Click the tab on the page
// Click the button that displays within the tab contents

.click() failed to open the tab

.invoke() set the correct attribute, but the clicked tab contents did not display

I applied breakpoints to the click action and watched each point in the code that triggered the click.

I added .trigger() and used mouseover, hover, and mousedown

.focus() was added.

At this point, I was throwing all the spaghetti at the wall to click. this. tab.

It wasn’t until I found this answer on Stack Overflow that I discovered my first clue.

cy.get('[role="button"][ariahaspopup="listbox"]')
.trigger('mouseover').wait(1000).click().click({force:true});

At first, I laughed. Not at the person but with them. My word! We’re just trying to click a thing! Then, for funsies, I applied their answer to my code.

The tab opened.

Happy to find a solution, but wanting to know what triggered the click, I stripped away each part that might not be necessary. Here’s the result:

cy.get('YOUR-SELECTOR').wait(1000).click()

All it took was a second.

I know, I know. As QA Engineers, we stress and strain not to add waits to our code. It’s a code smell. It will slow down the tests, etc. And, that’s correct. But, sometimes, in code and life, all you need is a second.

Hope this helps someone and saves you DAYS of searching 🙏

All my posts are free to read, and clicking subscribe will bring each post to your inbox. If my work brings you joy, and you’d like to support it, you can become a paid subscriber by clicking the button above. If a paid subscription is not your thing, you can support my caffeine addiction writing by clicking the button below! Thanks!