Deconstructing Beliefs on DevTools

Deconstructing Beliefs on DevTools: Tales of Testers from Moolympics #2 

All of us have a certain kind of assumption when it comes to DevTools. This is due to the fact that we rely on them so much. 

During the course of Moolympics #2 We asked the testing community to Experiment with Selectors and Beliefs that we hold so close to our chest. 

Are our assumptions totally wrong? Can we rely totally on DevTools? 

Among the several different experiments and results shared to us we’ve selected five fantastic testers and their in-depth experiments as our winners for the event. So here are our 5 stars of Moolympics #2 : Experimenting with Selectors and Beliefs - Pooja Shah , Gaurav Khurana , Rahul Parwal , Shiva Prasad, and Dimpy Adhikary . 

Now let’s talk about the big beliefs that these testers have analyzed, tested, experimented with, and finally  deconstructed. 

A tester never claims anything without proof. So let us delve into the intriguing list of evidence they’ve offered in the contexts of these standardized beliefs. 

Belief #1: DevTools provide the Right Count of Selector’s Match 

This is indeed a very common assumption we make whilst determining the potential of the DevTools. 

A resounding ‘No’ can be concluded from Shiva’s experiment as he claims, “DevTool fails to identify total number of anchor tags present in a particular page using Search functionality in Inspect elements” 

Similar conclusion can be drawn from Gaurav’s experiment as he showcases the mismatch in the count of selectors like “//a”, and “//img” whilst using DevTools and then using SelectorsHub respectively. According to him, the latter offered a more accurate count. 

Rahul also deduced that DevTools cannot provide the right number of Selector’s matches but he also refuses to consider it as a weakness of the DevTools since they’re built to function in a certain way.

Pitted with funny anecdotes and awesome storytelling Pooja’s Moolympics responses are always a joy to read. According to her, “Depending on the locating strategy and the selector’s source, the answer is yes and no both.”  In her report she explains how a careful debugging on her part revealed a major error done by the locator of the DevTool. 

Using two ways of getting selector’s count for Chrome DevTool, Dimpy’s realization asserts the conclusion that the  placeholder Text “Search by string, text or xpath” in the search panel was misleading since in her case she  provided the correct xpath but still got two wrong results.

Summing it up, it can be said that all the five winners have rejected this belief to some extent. 

So, now let’s jump onto the next prevalent belief surrounding DevTools and see what the testers have to say about it. 

Belief #2 : When DevTools shows 0 matching nodes, it is true.

Is it true? Or not? 

Pooja doesn’t seem to agree with this assumption as she clearly mentions, “Not really! This may be a false assumption . There are some modern HTML/Javascript elements for which DevTools generated XPath doesn’t work and also there is no intuitive way to identify why the XPath/locator is not locating the element/node.” 

Similar deductions were being made by Shiva as his experiment concludes  that “DevTools fail to Verify CSS selectors for the elements inside  SHADOW DOM” 

Rahul’s experiment also derives similar results as he deduces that in certain cases DevTools cannot be fully trusted whenever they show 0 matching nodes and we need careful investigation using appropriate selectors tools to get to the reality. 

Echoing Shiva’s conclusion Gaurav with his elaborate experiments also confirmed that DevTools often misleads by showing 0 matching nodes and even though they’re not necessarily wrong with experience a tester gets to know about the Shadow Root Elements and this apparent anomaly. 

Dimpy on her part made some interesting observations as she mentioned any element present inside an iframe are not becoming  findable without inspection. The selector count is always zero in this case. Additionally she suggests a JavaScript to resolve this dichotomy. 

Now that the Fantastic Five of Moolympics #2 have analyzed and mostly rejected the first two beliefs ,we turn our focus on the third one. 

Belief #3: DevTools generates correct XPath for all the web elements

Elaborating through an informative video Gaurav very clearly demonstrates that DevTool doesn’t generate the correct XPath for ‘SVG’ elements. Gaurav’s deductions were echoed in the findings of Shiva as he concluded that DevTools don’t generate correct XPath for SVG and SHADOW DOM elements. 

Dimpy’s exclusive experiment also revealed that the xpath returned by dev tool is not correct for the svg element. 

Upon landing on the same conclusion Pooja makes further observations by stating, “There are times when even though the locator maybe correct, it’s still absolute and so quiet high chances to break when the UI changes and that’s where we talk about the relative XPath and DevTools by default can’t understand what relation we want to use to locate our element and so scrolling through the page source and building own XPath is needed.”

Rahul’s study also derived the same results as he claims that similar problems can be encountered if we as testers use a different element having a completely separate namespace. 

Developing New Ideas Around DevTools 

Taking a holistic view, it can be said that the testers have offered us with enough evidence surrounding the three assumptions which respectively  nullifies them all. 

None of the beliefs stood true at the end of their experiments. But the idea was not just to highlight the shortcomings of DevTools but to make inroads into new learning on how they actually function.

And more importantly, how much as testers we can rely on them for evaluating the elements we look for. 

*This competition was held in February 2021 and the submissions were judged by Sanjay Kumar , Founder & Creator of SelectorsHub and TestCase Studio along with Naveen Khunteta Founder of Naveen AutomationLabs . Testers love to experiment and find anomalies and so it was not a surprise that we got various responses from several testers across the community. This article is a compilation of the answers shared by the winners, published with their permission.