WordPress.org

Make WordPress Core

Opened 2 years ago

Last modified 20 months ago

#43241 new defect (bug)

Twenty Seventeen: Menu behaviour is not proper

Reported by: nilamacharya Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version: 4.7
Component: Bundled Theme Keywords: has-screenshots
Focuses: ui Cc:
PR Number:

Description

Menu Items are sticky once user will click on it

Steps:

  1. Installed WordPress 4.9.4
  2. Imported file"themeunittestdata.wordpress.xml"
  3. Activate Menu

Issue: Menu is shown sticky after clicking on it (where there is # link and third party links)

Expected Bahaviour: It should be disappear once user will click on it

Attachments (2)

menu.mp4 (3.2 MB) - added by nilamacharya 2 years ago.
menu.png (362.7 KB) - added by nilamacharya 2 years ago.

Change History (7)

@nilamacharya
2 years ago

@nilamacharya
2 years ago

#1 @swissspidy
2 years ago

  • Component changed from Menus to Bundled Theme
  • Summary changed from Menu behaviour is not proper to Twenty Seventeen: Menu behaviour is not proper

#2 @chetan200891
2 years ago

It looks like navigation.js adds .focus class for touch enabled devices for accessibility. And this affects on desktop as well. "li.focus" related CSS applies.

This ticket was mentioned in Slack in #accessibility by chetan200891. View the logs.


2 years ago

#4 @afercia
2 years ago

  • Keywords has-screenshots added
  • Version changed from 4.9.4 to 4.7

Yes, the focus CSS class is added also for keyboard navigation, without that, the menu doesn't work when using only the keyboard. Worth noting the menu stays "sticky" only with links with an href attribute # or links with target="_blank" regardless if they're external or internal links. The reason is: focus stays on the clicked menu item link.

I'm not even sure this should be fixed, as there's no reason to use links to # and maybe it's acceptable to see the menu still open when closing a browser tab previously opened by a link with target="_blank". In any case, I'd recomment to not use blur() as it would cause a focus loss.

#5 @nilamacharya
20 months ago

Is there any updates on this ticket ?

Note: See TracTickets for help on using tickets.