const firstLi = document.querySelector('li:first-child');
console.log(firstLi)

Every time I save(Command + S), the web console side shows a different output randomly.

enter image description here The longer one

<li class="collective-item>...</li>

enter image description here The shorter one

li.collective-item

How do I edit the setting to show a consistent console output preferably the longer one? Because I would like to see the code structure(the longer one) not the whole list of methods(the shorter one).

And why does this show a different output randomly on JavaScript web console?