[Injected header] Opening and closing benefit hubs on mobile closes the megamenu

[randimays]

Description

When on a TeamSite (e.g. https://www.va.gov/health) in mobile view, the mega menu closes when opening and closing a sub-section and leaves the Menu button hanging at "Close."

To reproduce:

• Open the menu via the Menu hamburger button on the right side
• Click "VA Benefits and Health Care" or "About VA" to view all the links for that menu
• Click that text again to close the links for that menu
• Note that the mega menu closes when it shouldn't, and the button says "Close" but there is no menu to close
• If you click the Close button and then Menu again, the mega menu does open as normal

Screen.Recording.2024-09-06.at.2.43.59.PM.mov

User story

AS A Veteran, their caregiver, family member or survivor
I WANT to be able to navigate the the entire header on all VA websites (teamsites/VA.gov) on my mobile phone without it randomly closing
SO THAT I can find what I want to view without frustration

Quality / testing notes

• Verify that opening and closing any accordion on mobile works as expected and does not close the mega menu unexpectedly
• Regression check menus on desktop

Acceptance criteria

• Mobile mega menu works as expected on all injected headers (into Teamsites) and does not open/close unless the Menu/Close is clicked
• Regression check the menus on desktop