Cassiopeia mobile menu collapse bug

Question

I have discovered a bug in the Cassiopeia theme, and I can't find a solution to it, and I don't even know what's causing it. Searching, I found such a page, and it appears here, on several browsers: https://cassiopeia.joomla.com/help/menu-module When in mobile view, and I open the hamburger menu ("Page Modules" - menu module settings in the "Advanced" tab under "Layout" - "Collapsible Dropdown" ), then open the submenus, any of them, then close the entire hamburger menu as is, then open it again... If you play this for a while, randomly, something will get stuck, and suddenly their collapsible submenus won't open. I'm watching the inspector, can't find the cause of the error. Has anyone experienced anything similar? Does anyone know what could cause this bug?

I've tried it on several sites, J4, J5, fresh, new installation, where nothing is configured but the menu module "Collapsible Dropdown" and the error persists anyway.

Answer 1

If you believe it is a bug in the Joomla core template then it may be better to create an issue in the Joomla Issue Tracker, https://issues.joomla.org/, with your findings.

It may be known issue that someone is working on.

Answer 2

Yes, there's definitely a problem there. Did you raise a Joomla issue?

I can reproduce the problem fairly easily on Chrome, but the functionality seems to work ok on Firefox, except if you're using the Firefox js debugger, and then it fails there as well.

The associated JavaScript files as far as I can see are:

the hamburger menu collapse/expand is handled by media/vendor/bootstrap/js/collapse.js

the submenu dropdown is handled by media/vendor/metismenujs/js/metismenujs.js

(from https://github.com/onokumus/metismenu)

and media/templates/site/cassiopeia/js/mod_menu/menu-metismenu.js is also involved.

If the submenus are in the open state, then after you collapse and expand the menu using the hamburger icon, opening the submenus (sometimes) doesn't work. If you place debugger breaks inside the metismenu show() and hide() then you can see that these event handlers aren't then being run.

I don't know why though, I'm afraid!