3

Note:

This is intended as a Q and A post for sharing successful strategies. Please, feel free to add more solutions!

Problem background:

  • Automating a web application
  • Tester with limited access to the codebase
  • Using Selenium and DevTools

Problem:

There is a spinner element (for example: "Loading... Please wait.") to notify the user of the temporarily unresponsive page (by design, while the content is being loaded). You are trying to write a locator (id, name, CSS, XPath ...) for the spinner element but you are unable to right click and inspect it because it is present on the page for only a fraction of a second.

How do you do that?

3

Chrome provides an inbuilt function for this:

  • Dev Console (F12)

  • Switch to the Sources tab

  • Do action in browser to get to the state you want to inspect

  • Press F8

Chrome will pause the browser and the Elements tab will not update until you go back to Sources and Press F8 again. While it is paused you can switch back to the Elements tab and use the normal inspection tools.

1

To me the answers about an immediate technical solution to the problem are a simple fix to the symptoms and not for the source.

You haven't mentioned testers having limited access to developers or managers so why don't you talk to them and solve also the next problem ?

Get proper access to the sources, decide on proper processes and communication channels between developers and testers and teach developers why testability is important and how can you all work together to have better tests.

  • Do you mean that tester can simply ask the dev team for "spinner" id? – Moro May 24 at 14:06
  • No, I mean the tester can explain the scenario and problem to the developer and together they can come up with a solution – Rsf May 24 at 14:17
  • This is just one of many scenarios met during automated tests, it is not a problem it is how web pages work. Technical answer is a solution here. – Moro May 24 at 14:35
  • 2
    yes and no, obviously at the end there needs to be a technical solution but the question describes teams working with the wrong (or none at all) processes. "go and ask a developer" is a solution, "have the IDs documented somewhere" is even a better solution and "let the test fail until a developer supplies the ID" is my favorite one – Rsf May 24 at 14:51
0

Solutions

1. Use "Element is not clickable at point (x, y). Other element would receive the click..."

I think most Selenium users have seen something similar to this:

org.openqa.selenium.WebDriverException: unknown error: Element is not clickable at point (1128, 997). Other element would receive the click...

when trying to click an element obscured by another element. Chances are, if you do that while not adding a wait condition before the click, you will probably try to click the spinner and you will get it's selector in the error message:

Other element would receive the click: <div class="loading-spinner"></div> 

2. Network throttling

  • go to DevTools
  • Network tab
  • Simulate Slow3G network

This might give you more time to manually inspect the element in the DOM.

3. Event listeners

After interacting with the page up to the point where spinner should appear do the following and inspect the page in slow motion:

  • go to DevTools
  • Elements tab
  • right click the <body> tag (or any other you think would be more precise)
  • break on > subtree modifications
  • provoke the spinner

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.