diff --git a/packages/manager/src/components/DatePicker/DateTimeRangePicker.test.tsx b/packages/manager/src/components/DatePicker/DateTimeRangePicker.test.tsx index 02bdd4f808b..3dc542f4c36 100644 --- a/packages/manager/src/components/DatePicker/DateTimeRangePicker.test.tsx +++ b/packages/manager/src/components/DatePicker/DateTimeRangePicker.test.tsx @@ -27,14 +27,12 @@ const Props: DateTimeRangePickerProps = { }; describe('DateTimeRangePicker Component', () => { - let fixedNow: DateTime; - beforeEach(() => { // Mock DateTime.now to return a fixed datetime - fixedNow = DateTime.fromISO( + const fixedNow = DateTime.fromISO( '2024-12-18T00:28:27.071-06:00' - ) as DateTime; - vi.spyOn(DateTime, 'now').mockImplementation(() => fixedNow); + ).toUTC() as DateTime; + vi.setSystemTime(fixedNow.toJSDate()); }); afterEach(() => { @@ -51,8 +49,7 @@ describe('DateTimeRangePicker Component', () => { }); it('should call onChange when start date is changed', async () => { - const currentYear = new Date().getFullYear(); // Dynamically get the current year - const currentMonth = String(new Date().getMonth() + 1).padStart(2, '0'); // Get current month (1-based) + vi.setSystemTime(vi.getRealSystemTime()); renderWithTheme(); @@ -62,11 +59,17 @@ describe('DateTimeRangePicker Component', () => { await userEvent.click(screen.getByRole('gridcell', { name: '10' })); await userEvent.click(screen.getByRole('button', { name: 'Apply' })); + const expectedStartTime = DateTime.fromObject({ + day: 10, + month: DateTime.now().month, + year: DateTime.now().year, + }).toISO(); + // Check if the onChange function is called with the expected value expect(onChangeMock).toHaveBeenCalledWith({ end: null, preset: 'custom_range', - start: `${currentYear}-${currentMonth}-10T00:00:00.000-06:00`, + start: expectedStartTime, timeZone: null, }); }); @@ -164,8 +167,8 @@ describe('DateTimeRangePicker Component', () => { await userEvent.click(last24HoursOption); // Expected start and end dates in ISO format - const expectedStartDateISO = fixedNow.minus({ hours: 24 }).toISO(); // 2024-12-17T00:28:27.071-06:00 - const expectedEndDateISO = fixedNow.toISO(); // 2024-12-18T00:28:27.071-06:00 + const expectedStartDateISO = DateTime.now().minus({ hours: 24 }).toISO(); // 2024-12-17T00:28:27.071-06:00 + const expectedEndDateISO = DateTime.now().toISO(); // 2024-12-18T00:28:27.071-06:00 // Verify onChangeMock was called with correct ISO strings expect(onChangeMock).toHaveBeenCalledWith({ @@ -191,8 +194,8 @@ describe('DateTimeRangePicker Component', () => { await userEvent.click(last7DaysOption); // Expected start and end dates in ISO format - const expectedStartDateISO = fixedNow.minus({ days: 7 }).toISO(); - const expectedEndDateISO = fixedNow.toISO(); + const expectedStartDateISO = DateTime.now().minus({ days: 7 }).toISO(); + const expectedEndDateISO = DateTime.now().toISO(); // Verify that onChange is called with the correct date range expect(onChangeMock).toHaveBeenCalledWith({ @@ -218,8 +221,8 @@ describe('DateTimeRangePicker Component', () => { await userEvent.click(last30DaysOption); // Expected start and end dates in ISO format - const expectedStartDateISO = fixedNow.minus({ days: 30 }).toISO(); - const expectedEndDateISO = fixedNow.toISO(); + const expectedStartDateISO = DateTime.now().minus({ days: 30 }).toISO(); + const expectedEndDateISO = DateTime.now().toISO(); // Verify that onChange is called with the correct date range expect(onChangeMock).toHaveBeenCalledWith({ @@ -245,8 +248,8 @@ describe('DateTimeRangePicker Component', () => { await userEvent.click(thisMonthOption); // Expected start and end dates in ISO format - const expectedStartDateISO = fixedNow.startOf('month').toISO(); - const expectedEndDateISO = fixedNow.endOf('month').toISO(); + const expectedStartDateISO = DateTime.now().startOf('month').toISO(); + const expectedEndDateISO = DateTime.now().endOf('month').toISO(); // Verify that onChange is called with the correct date range expect(onChangeMock).toHaveBeenCalledWith({ @@ -271,7 +274,7 @@ describe('DateTimeRangePicker Component', () => { const lastMonthOption = screen.getByText('Last Month'); await userEvent.click(lastMonthOption); - const lastMonth = fixedNow.minus({ months: 1 }); + const lastMonth = DateTime.now().minus({ months: 1 }); // Expected start and end dates in ISO format const expectedStartDateISO = lastMonth.startOf('month').toISO();