I am trying use the FullCalendar v5 plugin to add a calendar on my website. I want to fetch the events using AJAX request.

Here is what I have done

let calendarElement = document.getElementById('calendarElement');

let calendar = new FullCalendar.Calendar(calendarElement, {
            initialView: 'dayGridMonth',
            aspectRatio: 2.0,
            headerToolbar: {
                left: 'prev,next',
                center: 'title',
                end: 'dayGridMonth,timeGridWeek,listWeek, today prev,next'
            },
            weekNumbers: false,
            lazyFetching: false,
            events: {
                url: '/events',
                method: 'GET',
                startParam: 'start', // I expect this to always be the begin of the month
                endParam: 'end', // I expect this to always be the end of the month
                failure: function (e) {
                    console.log(e);
                }
            }
        });

calendar.render();

However, then the values sent to the server seems to have the wrong start/end values. /events?start=StartValue&end=EndValue

If I am looking at events for the month of February, I expect the plugin to sent a GET request to the server with 2/1/2022 00:00:00 value for the start and `2/28/2022 23:59:59' for the end date.

However, the plugin seems to be sending odd range to the server. The plugin send the value 1/30/2022 5:00:00 AM as start value and 3/13/2022 5:00:00 AM as end value. My PC time zone is -5 from UTC which explains the 5 hours. But I would expect the end value to be 2/28/2022 not 3/13/2022

How can I fix this issue so that the plugin send the exact range based on the user's view?

Here is a picture of the calendar