Heritage Designs Quilt Shop — Mobile Menu Fix Report
Issue
Mobile menu was completely broken. Tapping the hamburger icon did nothing. Browser console showed a ReferenceError: handleMenuKeydown is not defined thrown from Vue.js, originating from JetMenu’s mobile menu component.
Root Cause
Bug in JetMenu (Crocoblock) version 3.0.1.1. The plugin ships two parallel runtimes — a legacy bundle and a “NextGen Edition” bundle. The site uses the legacy bundle, but the plugin’s mobile menu Vue templates reference 16 accessibility handlers, computed style properties, and config flags that only exist in the NextGen bundle. The mismatch causes Vue to abort component initialization the moment it tries to bind the first missing method, which is why the menu never opens.
This is a plugin-side bug, not a configuration mistake on the site. Crocoblock’s update server isn’t surfacing a newer version for this license.
What was tried before the working fix
| Attempt | Outcome |
|---|---|
| Disabling WP Rocket + reinstalling JetMenu | No effect — still on 3.0.1.1 |
| Flipping JetMenu’s “NextGen Edition” toggle on | Mobile menu would have worked, but it broke the desktop mega menu (rendered everything as a vertical stacked list). Reverted. |
| Vue.mixin shim in child theme | ✅ Works. Mobile menu opens, no console errors, desktop menu unaffected. |
Final fix (deployed)
A self-contained shim added to the child theme’s functions.php injects 8 no-op method stubs and 8 computed-property defaults via Vue.mixin, which run before JetMenu instantiates its Vue components. The templates bind cleanly, the legacy renderer keeps driving the menu, and the desktop mega menu is unchanged. A companion CSS rule (inlined to bypass stylesheet caching) strips the default <button> border/color from the new submenu arrow buttons since those styles would normally be applied inline by the NextGen renderer.
Files changed on Kinsta:
wp-content/themes/hello-theme-child-master/functions.php— added ~60 lines- Both files were backed up to
*.bak-20260520-*on the server before editing - Manual Kinsta backup also taken before any changes
No plugin files were modified (so the fix survives any future JetMenu update, and JetMenu can still be updated freely when Crocoblock ships a real patch).
Verification
- Console clean — no JavaScript errors related to the menu
- Mobile menu opens, closes, navigates into submenus (Shop → Fabric/Quilt Kits/etc.), and breadcrumbs work
- Desktop mega menu visually identical to before
- Tested in incognito with cache busted
Rollback (if ever needed)
Restoring the two .bak-20260520-* files in the child theme and clearing cache returns the site to its exact prior state. Documented in our internal notes.
Open follow-up (separate issue — not affecting menu)
Discovered while testing: Elementor Pro 4.0.4’s Floating Bars widget is throwing Cannot read properties of null (reading 'classList') on page load. There’s a Floating Bar instance somewhere in the page that its JS can’t initialize. Doesn’t impact the menu or the user-facing experience visibly, but worth investigating in a separate session — likely either a stale widget instance or an Elementor Pro internal bug.