Firefox Dev Tools highlight DOM nodes when clicking an element

To be clear, this is not highlighting in the sense of finding an element from the DOM Inspector to the page, or vice versa. It's behavior I haven't seen before, but then I usually use Chrome.

I'm debugging a textarea that won't accept clicks, or allow selection, or basically gain focus in any way. I noticed that clicking on the textarea, in the page, caused several DOM nodes in the Inspector to highlight, and then fade away after a second. None of the nodes that highlighted were the textarea; they were parents of the textarea, including the body, but not necessarily all of the parents in between the textarea and the body. There was also a sibling of one of the parents highlighted, as well.

It's one of those things where Firefox is trying to tell me something, but I don't know what. I feel like the answer to my original problem is probably contained in this highlight, if only I knew what it meant.

In the attached screenshot, you can see the textarea highlighted in blue, being the selected element, and the rather grossly-colored highlights on a few other elements; this was right after I clicked on the textarea (in the page, like I was trying to enter some text in it; not in the inspector) screenshot of highlight

What does it mean?

Solution

When the nodes in the markup view (the thing in your screenshot) highlights, it means that these nodes have gone through mutations. These can be of the following manner:

Attribute value change on the node
Addition/Removal of child nodes

Now, what you are actually looking a way to hover the textbox and get the markup view to select your textbox, right ?

You can do that in two ways:

Hit the shortcut Ctrl + Shift + C. You will see an overlay on the page which follows your mouse. Head over to text box and click it.
Click the "Pick an element from the page" button on top left corner of the developer tools and the same node-selector will appear.

For more and deep information : visit the MDN page : https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector