Menu icon Foundation
Foundation 6.4.3 Dropdown aria-labelledby not being set correctly

Hello,

 

We are building a site with ADA Level A and AA accessibility requirements.

Our global header utilizes foundation toggle and dropdown components to create a megamenu.

 

The issue here is that Foundation is overwriting and setting the aria-labelledby of the opened dropdown pane and setting it to a random value (instead of setting it to the ID of the button used to open/toggle the dropdown).

 

Here's is a CodePen showing this working for an earlier version of foundation: codepen here

Here's is another CodePen based on the one above, except Foundation has been swapped with Foundation v.6.4.3: codepen here

FoundationtoggleARIAaccessibilitywcagadadropdownmegamenuRandomcodepenidaria-labelledbylabelledby

Hello,

 

We are building a site with ADA Level A and AA accessibility requirements.

Our global header utilizes foundation toggle and dropdown components to create a megamenu.

 

The issue here is that Foundation is overwriting and setting the aria-labelledby of the opened dropdown pane and setting it to a random value (instead of setting it to the ID of the button used to open/toggle the dropdown).

 

Here's is a CodePen showing this working for an earlier version of foundation: codepen here

Here's is another CodePen based on the one above, except Foundation has been swapped with Foundation v.6.4.3: codepen here