Opened 7 years ago

Closed 7 years ago

#15241 closed defect (fixed)

Menu: first menu item always appears focused though mouse over other menu items (Chrome 18.0.1025.162)

Reported by: siqi Owned by: bill
Priority: undecided Milestone: 1.8
Component: Dijit Version: 1.7.2
Keywords: Cc:
Blocked By: Blocking:

Description

The issue can be reproduced in following steps:

  1. Open dijit/tests/test_Menu.html in Chrome 18.
  2. Click on the navigation menu or open any context menu.

Result: The first menu item if focused and displayed with orange outline.

Attachments (1)

123.png (12.4 KB) - added by siqi 7 years ago.
ScreenShot?

Download all attachments as: .zip

Change History (9)

Changed 7 years ago by siqi

Attachment: 123.png added

comment:1 Changed 7 years ago by bill

Milestone: tbd1.8
Owner: set to bill
Status: newassigned
Summary: The first menu item is always focused though mouse over other menu items.(Chrome 18.0.1025.162)Menu: The first menu item is always focused though mouse over other menu items.(Chrome 18.0.1025.162)

Thanks. I changed the Menu in 1.8 so that opening a menu by the mouse wouldn't automatically focus any of the menu items, but I see that still, as you said, for some reason mousing over the Menu focuses the first child regardless of where the mouse is.

comment:2 Changed 7 years ago by bill

Summary: Menu: The first menu item is always focused though mouse over other menu items.(Chrome 18.0.1025.162)Menu: first menu item always appearse focused though mouse over other menu items.(Chrome 18.0.1025.162)

OK, this is a chrome bug. Focus is actually changing, as you can see if you open the console and enter:

setInterval(function(){ console.log(dijit._curFocus.innerText); }, 1000);

So probably this is the same as #15154.

comment:3 Changed 7 years ago by bill

Summary: Menu: first menu item always appearse focused though mouse over other menu items.(Chrome 18.0.1025.162)Menu: first menu item always appears focused though mouse over other menu items (Chrome 18.0.1025.162)

comment:4 Changed 7 years ago by bill

Unfortunately still happening in Chrome 19 and Chrome 20.

Filed https://code.google.com/p/chromium/issues/detail?id=125779.

Last edited 7 years ago by bill (previous) (diff)

comment:5 Changed 7 years ago by siqi

I have thought it only happens in Chrome 18... Does it make sense to use some workaround such as adding CSS selector: .dj_webkit .dijitMenuItem{outline: none} ?

comment:6 Changed 7 years ago by bill

Yah I want to try something like that, except to try to make the focus outline show up in the right place rather than hiding it completely (this is necessary for accessibility). The other trick available is to us .dijitMenuItemFocused.

comment:7 Changed 7 years ago by bill

On second thought, accessibility is already handled by the shading of the selected menu item, and in high-contrast mode there's a solid border around the menu item's label.

comment:8 Changed 7 years ago by bill

Resolution: fixed
Status: assignedclosed

In [28533]:

Hide the MenuItem focus outline since focus is already clear from the shading of the selected MenuItems, or in high contrast mode, from a solid border drawn around selected MenuItem labels.

This also works around the webkit bug displaying focus on table rows.

Fixes #15241.

Note: See TracTickets for help on using tickets.