Dismissing the "Inspect Elements" pane is NOT obvious, frustrating experience

[tiki33 (Tiki)]

I just spent a few very frustrating minutes trying to figure out how to dismiss the in-app Browser DevTools pane that pops up after selecting Inspect Element.

I ultimately figured it out by clicking on this icon, and this was very non-obvious to me as I hadn’t clicked that icon to open the pane (I had used the right click context menu).

I’m not sure the best way to fix, but one idea at the very bare minimum: make that console icon blue (as an active selected state). That would cue the user attention there to “deselect” and turn the pane off.

It was also very frustrating that the menu when clicking the vertical “…” button didn’t have a close option, as that’s where I would also expect to find it.

Another small nit - the word console seems to be overloaded. Clicking “show console drawer” in the menu above, and the “Hide Console” in the tooltip for the button.

[Colin]

Hey @tiki33!

Thanks for the feedback! It wasn’t obvious to me either how to close the dev tools when I went to try it out.

@tiki33

I’m not sure the best way to fix, but one idea at the very bare minimum: make that console icon blue (as an active selected state). That would cue the user attention there to “deselect” and turn the pane off.

This is probably the way to go about it, since this is how it works over in the IDE, and it seems that it wasn’t carried over to the Agents Window!

Will share this with the team.