diff --git a/webapp/src/components/properties/dateRange/dateRange.test.tsx b/webapp/src/components/properties/dateRange/dateRange.test.tsx index 0e14fb845..d70a45468 100644 --- a/webapp/src/components/properties/dateRange/dateRange.test.tsx +++ b/webapp/src/components/properties/dateRange/dateRange.test.tsx @@ -242,4 +242,34 @@ describe('components/properties/dateRange', () => { const retVal = '{"from":' + June15.getTime().toString() + ',"to":' + June20.getTime().toString() + '}' expect(callback).toHaveBeenCalledWith(retVal) }) + + test('handles `Today` button click event', () => { + const callback = jest.fn() + const component = wrapIntl( + , + ) + + // To see if 'Today' button correctly selects today's date, + // we can check it against `new Date()`. + // About `Date()` + // > "When called as a function, returns a string representation of the current date and time" + const date = new Date() + const today = Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()) + + const {getByText, getByTitle} = render(component) + const dayDisplay = getByTitle('Empty') + userEvent.click(dayDisplay) + + const day = getByText('Today') + const modal = getByTitle('Close').children[0] + userEvent.click(day) + userEvent.click(modal) + + const rObject = {from: today} + expect(callback).toHaveBeenCalledWith(JSON.stringify(rObject)) + }) }) diff --git a/webapp/src/components/properties/dateRange/dateRange.tsx b/webapp/src/components/properties/dateRange/dateRange.tsx index 50048a0c2..900e9ce62 100644 --- a/webapp/src/components/properties/dateRange/dateRange.tsx +++ b/webapp/src/components/properties/dateRange/dateRange.tsx @@ -233,6 +233,8 @@ function DateRange(props: Props): JSX.Element { locale={locale} localeUtils={MomentLocaleUtils} todayButton={intl.formatMessage({id: 'DateRange.today', defaultMessage: 'Today'})} + onTodayButtonClick={handleDayClick} + month={dateFrom} selectedDays={[dateFrom, dateTo ? {from: dateFrom, to: dateTo} : {from: dateFrom, to: dateFrom}]} modifiers={dateTo ? {start: dateFrom, end: dateTo} : {start: dateFrom, end: dateFrom}} />