Porting FullCalendar View to Drupal 11 with Bootstrap 5 Integration

Created on 14 May 2025, 1 day ago

Problem/Motivation

After upgrading to Drupal 11 and Bootstrap 5, the FullCalendar View module (v5.2.4) suffers from a caching regression: the calendar renders correctly immediately after clearing the cache (e.g. via drush cr), but disappears entirely on subsequent page reloads. This is caused by improper caching of the JavaScript settings (drupalSettings.fullCalendarView) and attached libraries, which prevents the calendar initialization data from being re-injected on reload.

Steps to reproduce

  1. Install the FullCalendar View module v5.2.4 on a Drupal 11 site.
  2. Create a View with the “Full Calendar Display” style.
  3. Clear all caches (e.g. drush cr), then navigate to the calendar page – the calendar appears as expected.
  4. Reload the same page – the calendar markup remains present, but the interactive calendar fails to render (it’s blank).

Proposed resolution

I’ve prepared a patch that:

  • Ensures proper attachment of JS settings and libraries on every page load by moving the initialization into a render preRender callback.
  • Adds cache metadata (#cache properties) to the render array to prevent dynamic data from being stale or cached improperly.
  • Updates compatibility to work seamlessly with Drupal 11, Bootstrap 5 (leveraging its classes for toolbar and responsive behavior), and PHP ≥ 8.3 by modernizing type hints and namespace imports.

Remaining tasks

  • Review and merge automated tests covering the JS-settings attachment and cache metadata.
  • Update the module’s README and release notes to document Drupal 11/Bootstrap 5 support.
  • Adjust composer.json to require PHP ≥ 8.3 and declare Drupal 11 compatibility.
  • Test the patch in a variety of environments (Drupal 10 → 11 upgrades, various theme integrations, with and without CDN).
  • Gather community feedback and iterate on edge cases (e.g., multilingual sites, heavy caching proxies).

User interface changes

There are no visible changes to the calendar’s UI. All existing markup and FullCalendar options remain untouched. Bootstrap 5 styling continues to apply as before.

API changes

No external module APIs have been altered. Internally, the patch adjusts the preRender() signature in FullcalendarDisplay.php and attaches drupalSettings.fullCalendarView via #attached on each render. Cache contexts/tags are now declared to ensure proper cache invalidation.

Data model changes

This patch does not introduce any schema or data model changes. All existing configuration entities, field storage, and data tables remain the same.

📌 Task
Status

Needs work

Version

6.0

Component

Code

Created by

🇧🇪Belgium jmaerckaert Geer, province of Liège

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Production build 0.71.5 2024