Project

General

Profile

Actions

Feature #25820

open

Bug #25126: VPAT Initial Report

Update Event Organiser's fullCalendar JS from v2.2.7 to v7.1.1

Added by Raymond Hoh 2 days ago. Updated 2 days ago.

Status:
New
Priority name:
Normal
Assignee:
-
Category name:
-
Target version:
-
Start date:
2026-10-06
Due date:
% Done:

0%

Estimated time:
Deployment actions:

Description

The impetus for upgrading Event Organiser's fullCalendar JS library from v2.2.7 to v7.1.1 is to ensure that the event calendar no longer uses nested table markup. See VPAT instance ID 510228-02 for the accessibility audit's findings.

Just going to quote what I wrote in https://redmine.gc.cuny.edu/issues/25126#note-4:

The new version of fullCalendar doesn't actually use table markup. It uses a series of nested <div> containers with aria roles emulating a table set up -- grid / rowgroup / row / etc. See https://github.com/fullcalendar/fullcalendar/issues/6641#issuecomment-2579096269. I did try doing an initial pass at upgrading fullCalendar and modifying portions of Event Organiser's frontend.js file locally, but while I got bits and pieces working, we would need to ensure all functionality from bp-event-organiser and our custom mods are working correctly.

I'm going to walk back the latter sentence from that quote :)

For the Commons usage of Event Organiser, the main issue I encountered is the Campus filter not working correctly on the sitewide events calendar view. On production, this is located at https://commons.gc.cuny.edu/events/?view=calendar. It doesn't look like the Campus filter is working in calendar view based on this part of the JS code: https://github.com/cuny-academic-commons/cac/blame/f892c9950d621354f4c940357a4e4488b070233c/wp-content/themes/bp-nelo/assets/js/events-directory.js#L69-L71.

The other major change is the look and feel. On production, here is an example of a group events calendar: https://commons.gc.cuny.edu/groups/gis-working-group/events/calendar/. v7.1.1 uses a different styling system. I will attach a screenshot of fullCalendar 7.1.1 with the Monarch theme in a BuddyPress group. I haven't matched up the styling to resemble production's look and feel yet. I also had to refactor the "Go to" button. The new version uses the browser's native datepicker instead of jQuery UI's datepicker.

On the JS side, fullCalendar's API has drastically changed. I've only addressed the elements of fullCalendar that we use on the Commons. If we wanted to send a PR upstream to event-organiser eventually, then we would need to fix a bunch of things relating to fullCalendar's custom buttons (category, tag, venue, organiser), and perhaps to bp-event-organiser's custom filters (group, author). We currently do not use any of these buttons or filters on the Commons, so I haven't worked on adding back support for these items.

I think once we get the new version of fullCalendar to resemble the look and feel of our current production version and also fixing the Campus filter on the sitewide event calendar, that we should be good to go, but Boone, let me know if I am missing anything.


Files

new-fullcalendar-screenshot.png (157 KB) new-fullcalendar-screenshot.png Raymond Hoh, 2026-10-06 05:03 AM
Actions

Also available in: Atom PDF