Majority of bundled themes have broken mobile nav menus when JS turned off

[westonruter]

I tried turning off JavaScript in my browser (via DevTools in Chrome) and then activated each core theme to see if I could access mobile nav menu items. Unfortunately, for the themes which have an expandable mobile nav menu, the majority fail to gracefully degrade when JavaScript is disabled (either on purpose or the script fails to load over the network).

Themes which gracefully degrade by just revealing all the nav menu items:

• Twenty Nineteen
• Twenty Seventeen
• Twenty Sixteen

Themes which show a mobile nav menu button which does nothing when tapped:

• Twenty Twenty (mobile search also broken)
• Twenty Fifteen
• Twenty Fourteen (mobile search also broken)
• Twenty Thirteen
• Twenty Twelve

[afercia]

I guess Twenty Eleven and Twenty Ten aren't mentioned to show some mercy? :)

[afercia]

This ticket was discussed during today's accessibility bug-scrub. As a general consideration, the accessibility team agrees the navigation menu implementation in Twenty Seventeen it the bet one so far. Twenty Seventeen got a lot of work on the menu and that is the pattern the team recommends.

A quick win could be to _not_ hide the mobile menu when JS is off. Something to consider for the Themes team :) Moving to Future Release for now.

[westonruter]

Replying to afercia:

I guess Twenty Eleven and Twenty Ten aren't mentioned to show some mercy? :)

No, it's because they don't have a mobile menu button. And Twenty Ten isn't responsive at all.

[dboy1988]

Patch provided

[poena]

Could we combine this with https://core.trac.wordpress.org/ticket/44537?
Or perhaps better, replace them with one new ticket about fixing any and all menu issues when JavaScript is disabled?
CC @karmatosed

[karmatosed]

@poena unless I am mistaken this ticket could become the one for all menu issues, so let's close #44537 to combine.

[karmatosed]

#44537 was marked as a duplicate.

[westonruter]

Related: I was on a slow connection and I loaded the WCEU site but the JavaScript was taking a long time to load. I could see the nav menu button but when I tapped it nothing would happen. Even tapping it 50 times yielded no results (😜). Ideally we wouldn't need JavaScript to open the menu in the first place, which I think is now a real possibility thanks to the Popover API which can be entirely declarative.

[westonruter]

I gave the Popover API a try, but it seems we'll have to wait for "invoker commands" to land in the web platform for this to be a viable declarative replacement for the Interactivity API: ​https://github.com/WordPress/gutenberg/pull/63917