FullCalendar v7: calendar now resizes correctly after container width change (fixed from v6)
Comments · 0
Be the first to comment.
Explanationby SceneRecap AI
The recording demonstrates how FullCalendar version 7 fixes a container resizing issue present in version 6. It opens on a demonstration page running FullCalendar 7.1.3, where the calendar is loaded inside a container constrained to 700 pixels. At 5.6 seconds, the user clicks the Expand container button. The container expands to 1220 pixels, and the calendar grid immediately stretches to fill the new container dimensions using ResizeObserver.
At 11.0 seconds, the browser navigates to a test page running FullCalendar 6.1.15. The calendar initially renders inside a 700 pixel container. At 18.2 seconds, the user clicks the Expand container button again. While the outer container expands to 1220 pixels, the calendar grid remains locked at 700 pixels width. An on-screen annotation confirms that without ResizeObserver, updateSize is not automatically called and column widths remain stuck at their initial dimensions.
Key moments
What to know
- •FullCalendar v7 uses ResizeObserver to automatically detect container width changes and adjust column widths without manual update calls.
- •FullCalendar v6 fails to detect container resizing automatically, leaving the grid stuck at its original 700 pixel layout.
Glossary
- ResizeObserver
- A web API that reports changes to the dimensions of an Element's content or border box.
- updateSize()
- A FullCalendar method that recalculates calendar sizing when layout dimensions change.
Your recordings could explain themselves too.
Free plan · silent recordings welcome · bug reports included.
Try SceneRecap free →