TypeError: Cannot read properties of null (reading 'getBoundingClientRect') in jest

//Calendar.tsx
import React from 'react';
import React,{useState,useEffect, useRef} from 'react'
import FullCalendar from "@fullcalendar/react";
import dayGridPlugin from "@fullcalendar/daygrid";
import timeGridPlugin from "@fullcalendar/timegrid";
import interactionPlugin from "@fullcalendar/interaction";
import Popup from "../calendar/FreeTimeModal";
import axios from "axios";
import "@fullcalendar/core/main.css";
import config from '../../env.json';
import moment from 'moment';
import './CalenderComponent.css';
import BlockUI from '../../layouts/bockUi/BlockUI';
import "@fullcalendar/daygrid/main.css";

export default function CalendarComponent(props) {
 const events = [{ title: "today's event", date: new Date() }];
 const [modalShow, setModalShow] = React.useState(false);
 const [freetimeval,setFreeTimeVal]=useState({});
 const [freetime,setFreeTime]=useState([]);
 const [event,setEvent]=useState([]);
 const [info,setInfo]=useState([{
 freetime:[],
 event:[]
 }])
 const [nextflag,setNextFlag]=useState(false);
 const [tempNext,setTempNext]=useState([]);
 const [result,setResult]=useState([]);
 const [date, setDate]=useState("");
 const start:any=new Date();
 const end:any=new Date();
 const [block,setBlock]=useState(false);
 const [startdate, setStartDate]=useState(new Date());
 const [enddate, setEndDate]=useState(new Date());
 
 useEffect(() => {
 if(props.refresh)
 {
 getFreeTime(moment(startdate).subtract(2,'M').format(),moment(enddate).add(2, 'M').format());
 getEvents(moment(startdate).subtract(2,'M').format(),moment(enddate).add(2, 'M').format());
 }
 
 }, [props.refresh])
 useEffect(() => {
 const temp=event.concat(freetime);
 setResult([...temp]);
 console.log(JSON.stringify(result));
 }, [event,freetime])
 
 
 
 const getFreeTime=(start,end)=>{
 setBlock(true);
 debugger;
 console.log(new Date())
 console.log(start,end);
 setStartDate(start);
 setEndDate(end);
 start=moment(start).toISOString();
 end=moment(end).toISOString();
 
 console.log(start, end);
 axios
 .get(
 config.REACT_APP_CALENDAR_API_BASE+"/freetime?PageSize=&Page=0&StartDate="+start+"&EndDate="+end,
 )
 .then((res) => {
 setBlock(false);
 props.stoprefresh();
 console.log(res.data.data);
 let ftime=res.data.data; 
 
 ftime=ftime.map((x:any)=>{
 console.log(moment(x.AvailabilityStart_DtTm).format());
 x.start= moment(x.AvailabilityStart_DtTm).format(); 
 x.end =moment(x.AvailabilityEnd_DtTm).format();
 x.title=x.Subject_Val ;
 
 return x;
 })
 
 setFreeTime(ftime);
 
 handleCloseParent(true)
 })
 .catch((err)=>{
 console.log("Freetime Error:"+err);
 })
 
 
 }
 const getEvents=(start,end)=>{
 debugger;
 setBlock(true);
 setStartDate(start);
 setEndDate(end);
 start=moment(start).toISOString();
 end=moment(end).toISOString();
 axios
 .get(
 config.REACT_APP_CALENDAR_API_BASE+"/calendarevent?PageSize=&Page=&Status_Val=accept&StartDate="+start+"&EndDate="+end,
 )
 .then((res) => {
 setBlock(false);
 console.log(res.data.data);
 let ftime=res.data.data; 
 
 ftime=ftime.map((x:any)=> {
 console.log(moment(x.AvailabilityStart_DtTm).format());
 x.start= moment(x.RequestStart_DtTm).format(); 
 x.end =moment(x.RequestedEnd_DtTm).format();
 x.title=x.Subject_Val ;
 return x;
 })
 
 setEvent(ftime);
 
 
 })
 .catch((err)=>{
 console.log("Freetime Error:"+err);
 })
 
 }
 
 
 const handleMonthChange=(eventdata)=>{
 debugger;
 console.log(event);
 setNextFlag(true);
 setEvent([]);
 setFreeTime([]);
 getFreeTime(moment(eventdata.start).startOf('month').format(),moment(eventdata.start).endOf('month').format());
 getEvents(moment(eventdata.start).startOf('month').format(),moment(eventdata.start).endOf('month').format());
 
 getFreeTime(moment(eventdata.start).subtract(2,'M').format(),moment(eventdata.end).add(2, 'M').format());
 getEvents(moment(eventdata.start).subtract(2,'M').format(),moment(eventdata.end).add(2, 'M').format()); 
 console.log(event,freetime);
 const temp=event.concat(freetime);
 }
 
 
 
 const handleDateClick = (event) => {
 debugger;
 console.log(event.dateStr);
 setModalShow(true);
 setDate(event.date.toISOString());
 debugger;
 }
 return (
 <>
 
 {setModalShow(false);if(x){getFreeTime(startdate,enddate);getEvents(startdate,enddate);}}} end={end} value={true} dateval={date} />
 
 
 
 plugins={[dayGridPlugin, timeGridPlugin, interactionPlugin]}
 dayMaxEventRows= {2}
 initialView="dayGridMonth"
 headerToolbar={
 {
 left: 'dayGridMonth,timeGridWeek',
 center: 'title',
 right: 'prev,next'
 }
 }
 datesSet= {(e)=> handleMonthChange(e) }
 eventBackgroundColor={"#3788d8"}
 eventColor={'#3788d8'}
 displayEventEnd={true}
 events={result}
 nowIndicator
 eventTextColor='white'
 
 dateClick={(e) => handleDateClick(e)}
 />
 {
 block?:null
 }
 
 
 )
}

Calendar.test.tsx

import {store} from '../app/newStore';
import FreeTimeModal from "../components/calendar/FreeTimeModal";
import { CalendarDataManager } from "@fullcalendar/react";
import { mount } from "enzyme";
// const ReduxWrapper = ({ children }) => (
// 
// {children}
// 
// );
 
// This component helps get rid of the following error :: react-i18next

jest.mock('react-i18next', () => ({
 useTranslation: () => ({t: key => key})
 }));
 

test("Snapshot for Calendar Component", () => {
 const Component = renderer.create(
 
 
 
 )
 .toJSON()
 
 expect(Component).toMatchSnapshot()
})
 

describe("Snapshot testing of FreeTimeModal.tsx", () => {
 
 test("Snapshot for FreeTimeModal Component", () => {
 const renderedComponent = renderer
 .create()
 .toJSON()
 expect(renderedComponent).toMatchSnapshot()
 })
})