List menu popup used with the “Add to calendar” button are not keyboard accessible.

Fails WCAG SC 2.1.1 Keyboard

Priority: Serious

When activating the “Add to calendar” button, the pop-up list menu is not accessible via keyboard.

Comments:

• (waterman45 - May 28, 2024)
• Upon digging deeper into this issue Micahel and I discovered that the module that creates this button is, for lack of a better term, being abandoned.

The module also already has a ticket in for not being complaint: https://www.drupal.org/project/addtocalendar/issues/3180949

We also discovered that the module originally utilized an open-source javascript file to create its features. That js has been abandoned and the newest version of said while being accessible is not open-source. This probably accounts for the module we're using's abandonment.

It looks like, going forward, our best course is to rebuild this button as a React app. (Brian Canini - Jun 5, 2024)

• The current stop gag solution is to put an aria-hidden on the button as the button itself is not roadblocking people from attending the event it's just adding an extra bell/whistle to the events page.

Ultimately, we'll work toward getting a complete accessible button in place, it just won't be possible by the template review deadline (Brian Canini - Jun 5, 2024)

• The current module we use relies on addtocalendar.com script. This script was merged into addevent.com sometime in 2019 and the old version of the script has been abandoned since. The module maintainers planned to update the module to use the new Add to Calendar script provided by addevent.com BUT for undisclosed reasons it seems like they have abandoned this process. Currently, the module is on life support.

We will need to figure out a custom solution.

• addtocalendar.com has a bunch of problems and would require a rewrite of the code
• addevent.com is accessible, but limits the number of clicks to 100 on the free plan (yeah, seriously)
• add-to-calendar-button.com is an open-source alternative to addevent.com that strives to offer a free solution. It has Pro features but we don't need them!

When we come back to this, I think we should explore the add-to-calendar-button solution. We can implement this using a small React app or something.

(Michael Lee - Jun 5, 2024)

• stopgap pushed out now (Brian Canini - Jun 6, 2024)

added Accessibility Full Manual Test labels

assigned to @canini.16

mentioned in issue #324 (closed)

Issue still persists, example page: Example of add to calendar Keyboard can select the "add to calendar" button, but cannot access the menu pop up items