Please explain how you - a human - know the element in the test is interactable?
When this happens, it’s easy to focus in on the element(s) giving you a problem and the test case step you think might be causing it to happen. When you see a lot of these, it’s time to rethink your strategy.
The best strategy - some might call it a philosophy - is to not move forward with actionable test steps (like click, or setText) until the page is loaded and every actionable element is ready.
What does ready mean?
For the page itself:
- Finished retrieving all data (not the same thing as #1)
- All actionable elements are ready, too.
For actionable elements:
- Present in the DOM.
- Visible on the screen and not obstructed by other elements.
- Clickable (if relevant).
- Populated (if relevant)
Once all the above has been accomplished, only then can you proceed with your actual verification steps.
// Wait for page to load
// Wait for ajax/fetch data to finish
// Wait for elements to be Present/Visible/Clickable/Populated
// Regular Test Steps: