Make WordPress Core

Opened 21 months ago

Last modified 2 months ago

#45903 assigned defect (bug)

Twenty Nineteen: Some menu clicks trigger console errors

Reported by: kjellr Owned by: audrasjb
Milestone: 5.6 Priority: normal
Severity: normal Version: 5.0
Component: Bundled Theme Keywords: has-screenshots has-patch needs-refresh
Focuses: javascript Cc:


There are two scenarios where the Twenty Nineteen menu javascript triggers console errors:

First, on desktop screens, clicking the main navigation arrows produce the following error:

TypeError: event.target.matches is not a function[Learn More] 4 touch-keyboard-navigation.js:285:9
	toggleSubmenuDisplay/< ../wp-content/themes/twentynineteen/js/touch-keyboard-navigation.js:285:9


Originally reported by @joyously in: https://github.com/WordPress/twentynineteen/issues/596

Second, on touch-enabled screens, tapping menu items that have empty (#) href attributes result in the following console errors:

TypeError: event.target.nextSibling is null[Learn More] touch-keyboard-navigation.js:223:5 
	toggleSubmenuDisplay/<	../wp-content/themes/twentynineteen/js/touch-keyboard-navigation.js:223:5
	sendTouchEvent	resource://devtools/server/actors/emulation/touch-simulator.js:301:5
	handleEvent	resource://devtools/server/actors/emulation/touch-simulator.js:212:7
TypeError: event.target.matches is not a function[Learn More] touch-keyboard-navigation.js:277:9
	toggleSubmenuDisplay/<	http://core.test/wp-content/themes/twentynineteen/js/touch-keyboard-navigation.js:277:9

Originally reported in: https://github.com/WordPress/twentynineteen/issues/726

It looks like a possible fix for one of these was explored by @jmau in the following PR, but it has not yet been tested:


Attachments (3)

45903.patch (2.0 KB) - added by laurelfulford 20 months ago.
45903.1.diff (1.9 KB) - added by audrasjb 3 months ago.
Patch refresh
45903.2.diff (1.9 KB) - added by audrasjb 3 months ago.
Coding standards fixes

Download all attachments as: .zip

Change History (15)

#1 @laurelfulford
20 months ago

  • Keywords has-screenshots added
  • Milestone changed from Awaiting Review to Future Release

Thanks for moving this over, @kjellr! I can recreate both of these issues.

#2 @laurelfulford
20 months ago

  • Keywords has-patch needs-testing added; needs-patch removed

45903.patch copies over the changes from @jmlapam's GitHub PR.

#3 @ianbelanger
7 months ago

  • Milestone changed from Future Release to 5.5
  • Version changed from 5.0.2 to 5.0

3 months ago

Patch refresh

#4 @audrasjb
3 months ago

  • Keywords needs-testing removed

In 45903.1.diff, I refreshed the existing patch and I moved the pre-return checks after vars declarations.

Tested on my side: no error is showing.

#5 @audrasjb
3 months ago

  • Owner set to ianbelanger
  • Status changed from new to assigned

3 months ago

Coding standards fixes

#6 @dimijazz
3 months ago

@audrasjb I tried your code but still get the issue please have a look at screenshot.
I get the error if I leave the window on firefox and IE


#7 @ianbelanger
3 months ago

  • Keywords needs-refresh added
  • Owner changed from ianbelanger to audrasjb

I can confirm that the most recent patch does not fix the issue. I don't get any errors in Chrome, but do in Firefox and IE.

This ticket was mentioned in Slack in #core by david.baumwald. View the logs.

2 months ago

This ticket was mentioned in Slack in #core by whyisjake. View the logs.

2 months ago

#10 @pbiron
2 months ago

With 45903.2.diff applied, I can confirm that I'm still getting the console errors in FF 78.0.2 (Windows) and IE 11.

This ticket was mentioned in Slack in #core by david.baumwald. View the logs.

2 months ago

#12 @davidbaumwald
2 months ago

  • Milestone changed from 5.5 to 5.6

With 5.5 RC1 releasing tomorrow, this is being moved to 5.6. If any maintainer or committer feel this can be resolved in time or wishes to assume ownership during a specific cycle, feel free to update the milestone.

Note: See TracTickets for help on using tickets.