Project

General

Profile

Actions

Support #20643

open

Mobile menus not working

Added by Marilyn Weber 2 days ago. Updated 1 day ago.

Status:
Staged for Production Release
Priority name:
Normal
Assignee:
-
Category name:
-
Target version:
Start date:
2024-07-24
Due date:
% Done:

0%

Estimated time:
Deployment actions:

Description

Via Keeping:

"I'm writing because I found an error today with the WordPress install on the Commons. Mobile/hamburger menus won't expand on any of my sites. I found this while experimenting with a sandbox site of mine, but you can see it on my publicly-viewable page here. (Assuming you're a superadmin, you can also see it on my private sandbox site here, which is where I first noticed the issue.) I've tried in Firefox, Chrome, and Safari on my laptop as well as on mobile.

Console says the following:
Uncaught TypeError: The “@wordpress/interactivity” specifier was a basic specifier, but was not remapped to anything. Relative module specifiers must begin with “./”, “../” or “/”.
Others have reported the same problem, but in their cases it involved a plugin that I'm not using. I checked on another of my sandbox sites (this one, also private) which has no active plugins at all, and the problem persists there, too.

All three of those sites (the two sandboxes and my homepage) use the Twenty Twenty-Three theme, so I just made another little sandbox site using Twenty Twenty-Two and the problem is there as well.

Just clicking very briefly around the Commons, it's also affecting this site.

Please let me know if/when this can be resolved.

Thank you,
Joe Pentangelo"

Actions #1

Updated by Raymond Hoh 2 days ago

Hi Marilyn,

Can you pass us some links so we can take a look?

Actions #2

Updated by Marilyn Weber 2 days ago

I've asked Joe to provide that. Will update ASAP.

Actions #3

Updated by Boone Gorges 2 days ago

Thanks, Marilyn.

I'm seeing the behavior described on this sandbox site owned by Joe https://joessandbox2.commons.gc.cuny.edu/ and also on other sites. I believe he's right that the '@wordpress/interactivity' module issue is related. I bisected the issue down to a7a7a833cff7c2e1f95fb307ddd38f123c612893, which is where we updated to WP 6.4.x to 6.5.2 (this is where the interactivity API was introduced). I've begun to look for underlying causes but haven't figured it out yet. Adding Jeremy as a watcher.

Actions #4

Updated by Boone Gorges 2 days ago

I think I've solved the problem, though I'm not sure I can fully explain the underlying causes. Here's the fix: https://github.com/cuny-academic-commons/cac/commit/2cc7263785418385b70b20abcd50d8dbc32e3381

Briefly, the incorrect use of wp_enqueue_script() caused the "cac-shoelace-copy" script to be loaded in the header rather than the footer. At the same time, we are filtering the script tag for cac-shoelace-copy to force it to load as type="module". When this script was loading in the head, it was causing the browser to initialize all required modules. But this happened before WP had a chance to load its own importmap, which includes @wordpress/interactivity. As a result, when the browser reached WP's importmap, it threw an error, saying that modules had already been loaded for the page.

Moving the 'cac-shoelace-copy' script to the footer appears to fix the navigation problem. And in my tests, it seems that the Help dialog is still working as expected, though I would like Ray to have a look at this.

It seems like there should be a centralized way to register modules, in the same way that we enqueue scripts and WP sorts out the dependency tree. But I couldn't see this at a glance, and my understanding of how browsers recognize and load modules is quite limited. Any insight from the team would be welcome.

Actions #5

Updated by Raymond Hoh 2 days ago

Thanks for catching my mistake, Boone!

It looks like WordPress 6.5.0 introduced script modules -- https://make.wordpress.org/core/2024/03/04/script-modules-in-6-5/ -- so it looks like we can switch to using wp_enqueue_script_module() for cac-shoelace-copy. I've done some testing locally and this works well so I've committed this here: https://github.com/cuny-academic-commons/cac/commit/2a41ecb2014809f6f0aa35c53d381a1277334985 .

Actions #6

Updated by Boone Gorges 1 day ago

  • Status changed from New to Staged for Production Release
  • Target version set to 2.4.4

It looks like WordPress 6.5.0 introduced script modules

Aha, that answers my concern above! Thanks, Ray.

Marilyn, please ask Joe whether his site is now working as expected. For now, my interim fix is in place. After the 2.4.4 release, Ray's more permanent solution will be in place.

Actions #7

Updated by Marilyn Weber 1 day ago

Working now - Joe writes:
Thank you, but I just went through and it's working now, and console doesn't return this error anymore. I don't know what got changed or updated, but it seems resolved. Thanks!

Actions #8

Updated by Boone Gorges 1 day ago

Thanks!

Actions

Also available in: Atom PDF