1080264 - Browser Toolbox Element Picker doesn't pick nodes in menus

Status: RESOLVED INVALID

(DevTools :: General, defect)

Description

[Luís Miguel [:quicksaver] (not reading bugmail)]

STR:

1. Latest Nightly (only version I've tried at least)
2. Open Browser Toolbox
3. Click element picker button to activate pick mode
4. Switch to main browser window (alt+tab)
5. Open any menu using the keyboard (context menu, alt+something...)
6. Try to hover and click on the menu

The menus are completely unresponsive to the mouse movement, and the clicks go through to whatever node is beneath them.

I would expect the clicks to pick the menu item node clicked itself.

Brian, CC'ing you because you asked in the message to firefox-dev what keeps us using DOMi. Well, this keeps me using DOMi. :)

Comment 1

[Brian Grinstead [:bgrins]]

I'm curious how you handle this case with DOMi?  I've used the shift+right click addon to open on the element below the mouse, which works great for this, but inspecting popups is definitely tricky since they tend to disappear right after selecting them.

Comment 2

[Luís Miguel [:quicksaver] (not reading bugmail)]

I've actually never used the shift+right click add-on, just really DOMi itself. I just follow the exact steps that I mentioned for the browser toolbox, except in the DOMi window instead of the browser toolbox window. The popup/menu itself stays open after clicking on it while in pick mode. I don't know the code, but I assume it enforces some kind of "return false" or "preventDefault/stopPropagation" on the click events so that it uses that click to only pick the node to inspect, and not to interact with the menu. (This may not have been your question, but I'm not sure so saying it anyway.)

When menus disappear after switching away, yeah that can be a bother. But at least in my case, this isn't very common at all, most of the menus I interact with are always in #mainPopupSet in the DOM tree. I usually use the picker on them because I may not know exactly which menu it is, so it's much easier to just click on it rather than having to surf through the code to see what's the trigger, what JS methods are called, what menu nodes it references, etc, just to find which menu/items it is.

Plus, even when I do know what node I need, clicking on it is usually just so much faster than navigating the DOM to get to it. :)

Comment 3

[Luís Miguel [:quicksaver] (not reading bugmail)]

https://dl.dropboxusercontent.com/u/28360981/DOMiMenus.mp4 : little screencast of my usual workflow for inspecting menu nodes in DOMi, and how the same doesn't work at all with the browser toolbox. Pretty much the same STR as in the first post, and I should mention I bound Ctrl+Shift+I to DOMi instead of the web tools.

Comment 4

[Brian Grinstead [:bgrins]]

(In reply to Luís Miguel [:Quicksaver] from comment #3)
> https://dl.dropboxusercontent.com/u/28360981/DOMiMenus.mp4 : little
> screencast of my usual workflow for inspecting menu nodes in DOMi, and how
> the same doesn't work at all with the browser toolbox. Pretty much the same
> STR as in the first post, and I should mention I bound Ctrl+Shift+I to DOMi
> instead of the web tools.

Nice, that is really handy.  I didn't realize it would work this way because I can't get that working in osx - selecting the menu items actually never selects the element in DOMi (I'll upload a screencast following the same steps).

Comment 5

[Brian Grinstead [:bgrins]]

Attachment: domi-inspect-osx.mp4

The workflow from Comment 3 doesn't seem to work on OSX

Comment 6

[Brian Grinstead [:bgrins]]

(In reply to Brian Grinstead [:bgrins] from comment #5)
> Created attachment 8502501 [details]
> domi-inspect-osx.mp4
> 
> The workflow from Comment 3 doesn't seem to work on OSX

Oh, and I can't cmd+tab back to the main window after pressing the select element button since that focuses the previously used app altogether, not the main browser window.  Doesn't seem to be an issue though since the first click to focus doesn't select an element.

This is what has led me to try to find some kind of shortcut to make it easier to open a disappearing element (shift+right click for instance).  However, we should also make this workflow from Comment 3 work with Browser Toolbox - seems like it should be possible since it's working with DOMi.

Comment 7

[Luís Miguel [:quicksaver] (not reading bugmail)]

(In reply to Brian Grinstead [:bgrins] from comment #5)
> Created attachment 8502501 [details]
> domi-inspect-osx.mp4
> 
> The workflow from Comment 3 doesn't seem to work on OSX

I wonder if picking elements this way from any context menu (right-click menu) works? It does in windows, but I have to open the menu through the actual context menu key in the keyboard, as right-clicks also count for the element picker (so right-clicking anywhere on the browser window will pick a node as well as left-clicking). Don't know if OS X has any equivalent, and I don't have a Mac so I can't test this unfortunately.

If the picker works in the context menu, maybe the reason why it doesn't in the top menus in OS X is because those are rendered outside of the main browser window context AFAICT, which may make it more difficult to implement this in the Browser Toolbox as well...

Comment 8

[Brian Grinstead [:bgrins]]

(In reply to Luís Miguel [:Quicksaver] from comment #7)
> (In reply to Brian Grinstead [:bgrins] from comment #5)
> > Created attachment 8502501 [details]
> > domi-inspect-osx.mp4
> > 
> > The workflow from Comment 3 doesn't seem to work on OSX
> 
> I wonder if picking elements this way from any context menu (right-click
> menu) works? It does in windows, but I have to open the menu through the
> actual context menu key in the keyboard, as right-clicks also count for the
> element picker (so right-clicking anywhere on the browser window will pick a
> node as well as left-clicking). Don't know if OS X has any equivalent, and I
> don't have a Mac so I can't test this unfortunately.

I'm pretty sure that there is no way to simulate the context menu through a keyboard shortcut, and just like in Windows the right click triggers the node selection.

> If the picker works in the context menu, maybe the reason why it doesn't in
> the top menus in OS X is because those are rendered outside of the main
> browser window context AFAICT, which may make it more difficult to implement
> this in the Browser Toolbox as well...

Yeah, now that I look at that, the shift+right click does work on context menus but doesn't work on system menus.

Comment 9

[Jan Honza Odvarko [:Honza] (always need-info? me)]

I believe that this has been fixed long time ago.

But, feel free to reopen if you can still see the issue.

Thanks,
Honza