Excessive click events on the Mega Menu lead to a crash or tab freeze.

I have the exact same issue but it's with the bootstrap accordions on our pages. If you click to open the accordions on the page by the time you get to the 4th or 5th one the website/browser becomes unresponsive. I've tested in multiple browsers and different versions of Drupal 10 and removed all my modules and always the same result. Website works as expected with no issue when I downgrade to 3.0.0-alpha2. 3.0.0-alpha3 and 3.0.0-alpha4 both create the same issue for us.

I can confirm that it's something with the update to the tb_megamenu, in alpha4.

I am getting the same problem with a site that has this module installed, not using bootstrap but gesso theme, and no webforms. It even happens when someone isn't logged in, and they are just viewing a basic page full of content (no video, no images, just text). All the user needs to do is click around / highlight text for roughly 60 - 90 seconds, and the entire page becomes unresponsive, causing the browser to crash.

Please try to downgrade the module to version 8.x-1.9 then upgrade to version 3.0.0-alpha2. Then the issue will be fixed using the same approach on my site on live as well as locally and it will fix the problem.

I have the same issue with an accordion and slick slider.

On 3.0.0-alpha4, there is an event listener added to the document element every single time that the function ariaCheck is called. This occurs on line 300 of plugin.js:

ariaCheck() {
    const toggleElement = (element, value) => {
      element
        .querySelectorAll('.tbm-toggle, .tbm-submenu-toggle')
        .forEach((toggle) => {
          toggle.setAttribute('aria-expanded', value);
        });
    };

    // Anytime there's a click outside a desktop menu that has arrows, close the menu.
    document.addEventListener('click', event => {
      if (!event.target.closest('.tbm') && !this.isMobile && this.hasArrows) {
        this.closeMenu();
      }
    });
...

I believe the specific issue is that document.addEventListener is adding an anonymous function as the handler. According to the MDN, anon functions are NOT disregarded from being added to the event listener list. So every single time ariaCheck is called, it's adding a new event listener to the document, eventually crashing the page.

This was added in 3.0.0-alpha 3 and is NOT present in alpha2. Rolling back to alpha2 addresses the immediate issue.

I have this issue as well. Downgrading to alpha2 did resolve the issue. For what its worth I have a bootstrap 5 subtheme and when I switched to Claro as the default theme I don't believe I had the memory issue with Alpha4. Following.

Rolling back to alpha2 did not solve the problem for me, I had to uninstall the module to get my website usable. There might be other event listeners...

Same issue with the excessive errors on click events when using layout builder. Eventually the browser runs out of memory and crashes. This varies based on how much memory you have. I can work around the issue by shrinking my screen to a mobile breakpoint where I am not using the megamenu and do edits in layout builder.

Looking at the code I wonder - why does ariaCheck() need a click event listener? It actually looks like it calls back this.closeMenu(), which calls ariaCheck() again creating an infinite loop?

Btw, ariaCheck() needs to be documented.

I am facing the same issue with this version of the megamenus and some dc charts along with their filters that I've been using on a page/view.
After a couple of clicks on my charts or filters, the page becomes unusable to the point that Firefox hangs due to excessive memory/cpu.
Doing a profiling on my browser shows the data (see image)

I can confirm that reverting to alpha2 didn't help but removing the module completely did (obviously, that's not what we want)