From 559ef8866f1082dd30899dc1d7e36ecc80e0d7c1 Mon Sep 17 00:00:00 2001 From: daniele-mng Date: Fri, 28 Jun 2024 15:20:37 +0200 Subject: [PATCH] add test --- .../__tests__/startendtimeselection.jsx | 20 +++++-- .../performance/startendtimeselection.jsx | 6 +- src/web/pages/schedules/__tests__/dialog.jsx | 28 +++++++--- src/web/pages/schedules/dialog.jsx | 7 +-- src/web/utils/__tests__/timePickerHelpers.js | 56 +++++++++++++++++++ ...ormatSplitTime.js => timePickerHelpers.js} | 3 + .../wizard/__tests__/advancedtaskwizard.jsx | 8 ++- src/web/wizard/__tests__/modifytaskwizard.jsx | 8 ++- 8 files changed, 113 insertions(+), 23 deletions(-) create mode 100644 src/web/utils/__tests__/timePickerHelpers.js rename src/web/utils/{formatSplitTime.js => timePickerHelpers.js} (65%) diff --git a/src/web/pages/performance/__tests__/startendtimeselection.jsx b/src/web/pages/performance/__tests__/startendtimeselection.jsx index a89f4949cd..1a22a45534 100644 --- a/src/web/pages/performance/__tests__/startendtimeselection.jsx +++ b/src/web/pages/performance/__tests__/startendtimeselection.jsx @@ -24,7 +24,7 @@ import StartTimeSelection from '../startendtimeselection'; const timezone = 'CET'; const startDate = MomentDate('2019-01-01T12:00Z').tz(timezone); -const endDate = MomentDate('2019-01-01T13:00Z').tz(timezone); +const endDate = MomentDate('2019-02-01T13:00Z').tz(timezone); const handleChange = testing.fn(); @@ -45,6 +45,8 @@ describe('StartTimeSelection tests', () => { labelText, buttonName, buttonContent, + timePickerLabel, + timePickerValue, ) => { const label = screen.getByLabelText(labelText); expect(label).toBeVisible(); @@ -52,17 +54,25 @@ describe('StartTimeSelection tests', () => { const button = screen.getByRole('button', {name: buttonName}); expect(button).toBeVisible(); expect(button).toHaveTextContent(buttonContent); + + const timePicker = screen.getByLabelText(timePickerLabel); + expect(timePicker).toBeVisible(); + expect(timePicker).toHaveValue(timePickerValue); }; checkElementVisibilityAndContent( + 'Start Date', + '01/01/2019', + '01/01/2019', 'Start Time', - 'Jan 01, 2019, 01:00:00 PM', - 'Jan 01, 2019, 01:00:00 PM', + '13:00', ); checkElementVisibilityAndContent( + 'End Date', + '01/02/2019', + '01/02/2019', 'End Time', - 'Jan 01, 2019, 02:00:00 PM', - 'Jan 01, 2019, 02:00:00 PM', + '14:00', ); }); diff --git a/src/web/pages/performance/startendtimeselection.jsx b/src/web/pages/performance/startendtimeselection.jsx index 618cf91490..4862e16302 100644 --- a/src/web/pages/performance/startendtimeselection.jsx +++ b/src/web/pages/performance/startendtimeselection.jsx @@ -28,6 +28,7 @@ import {TimePicker} from '@greenbone/opensight-ui-components'; import Column from 'web/components/layout/column'; import Row from 'web/components/layout/row'; +import {formatTimeForTimePicker} from 'web/utils/timePickerHelpers'; const StartTimeSelection = props => { const { @@ -39,11 +40,10 @@ const StartTimeSelection = props => { const [startDate, setStartDate] = useState(initialStartDate); const [endDate, setEndDate] = useState(initialEndDate); const [startTime, setStartTime] = useState( - `${startDate.hours().toString().padStart(2, '0')}:${startDate.minutes().toString().padStart(2, '0')}`, + formatTimeForTimePicker(initialStartDate), ); - const [endTime, setEndTime] = useState( - `${endDate.hours().toString().padStart(2, '0')}:${endDate.minutes().toString().padStart(2, '0')}`, + formatTimeForTimePicker(initialEndDate), ); useEffect(() => { diff --git a/src/web/pages/schedules/__tests__/dialog.jsx b/src/web/pages/schedules/__tests__/dialog.jsx index fcd02f2a94..3c6619ef06 100644 --- a/src/web/pages/schedules/__tests__/dialog.jsx +++ b/src/web/pages/schedules/__tests__/dialog.jsx @@ -25,13 +25,19 @@ const checkElementVisibilityAndContent = ( labelText, buttonName, buttonContent, + timePickerLabel, + timePickerValue, ) => { const label = screen.getByLabelText(labelText); expect(label).toBeVisible(); - const button = screen.getByRole('button', {name: buttonName}); - expect(button).toBeVisible(); - expect(button).toHaveTextContent(buttonContent); + const button = screen.getAllByRole('button', {name: buttonName}); + expect(button[0]).toBeVisible(); + expect(button[0]).toHaveTextContent(buttonContent); + + const timePicker = screen.getByLabelText(timePickerLabel); + expect(timePicker).toBeVisible(); + expect(timePicker).toHaveValue(timePickerValue); }; import { @@ -120,14 +126,18 @@ describe('ScheduleDialog component tests', () => { expect(defaultTimezone).toHaveValue('Coordinated Universal Time/UTC'); checkElementVisibilityAndContent( - 'First Run', - 'Feb 08, 2021, 04:00:00 PM', - 'Feb 08, 2021, 04:00:00 PM', + 'Start Date', + '08/02/2021', + '08/02/2021', + 'Start Time', + '15:00', ); checkElementVisibilityAndContent( - 'End Run', - 'Feb 08, 2021, 08:45:00 PM', - 'Feb 08, 2021, 08:45:00 PM', + 'End Date', + '08/02/2021', + '08/02/2021', + 'End Time', + '19:45', ); expect(baseElement).toHaveTextContent('5 hours'); diff --git a/src/web/pages/schedules/dialog.jsx b/src/web/pages/schedules/dialog.jsx index 8262cc35a2..6e858a2480 100644 --- a/src/web/pages/schedules/dialog.jsx +++ b/src/web/pages/schedules/dialog.jsx @@ -47,6 +47,7 @@ import TimeUnitSelect from './timeunitselect'; import WeekDaySelect, {WeekDaysPropType} from './weekdayselect'; import DaySelect from './dayselect'; import MonthDaysSelect from './monthdaysselect'; +import {formatTimeForTimePicker} from 'web/utils/timePickerHelpers'; const RECURRENCE_ONCE = 'once'; const RECURRENCE_HOURLY = ReccurenceFrequency.HOURLY; @@ -87,7 +88,7 @@ const ScheduleDialog = ({ const [startDate, setStartDate] = useState(initialStartDate); const [startTime, setStartTime] = useState( - `${startDate.hours().toString().padStart(2, '0')}:${startDate.minutes().toString().padStart(2, '0')}`, + formatTimeForTimePicker(startDate), ); const [endOpen, setEndOpen] = useState(!isDefined(duration)); @@ -97,9 +98,7 @@ const ScheduleDialog = ({ : initialStartDate.clone().add(1, 'hour'), ); - const [endTime, setEndTime] = useState( - `${endDate.hours().toString().padStart(2, '0')}:${endDate.minutes().toString().padStart(2, '0')}`, - ); + const [endTime, setEndTime] = useState(formatTimeForTimePicker(endDate)); const [timezone, setTimezone] = useState(initialTimezone); diff --git a/src/web/utils/__tests__/timePickerHelpers.js b/src/web/utils/__tests__/timePickerHelpers.js new file mode 100644 index 0000000000..155bc0fe27 --- /dev/null +++ b/src/web/utils/__tests__/timePickerHelpers.js @@ -0,0 +1,56 @@ +import {formatSplitTime, formatTimeForTimePicker} from '../timePickerHelpers'; +import {describe, test, expect} from '@gsa/testing'; + +describe('timePickerHelpers', () => { + describe('formatSplitTime', () => { + test('formats single-digit hours and minutes correctly', () => { + expect(formatSplitTime(1, 5)).toBe('01:05'); + }); + + test('formats double-digit hours and minutes correctly', () => { + expect(formatSplitTime(12, 30)).toBe('12:30'); + }); + + test('handles hours and minutes at the edge of valid ranges', () => { + expect(formatSplitTime(23, 59)).toBe('23:59'); + }); + + test('returns a string in HH:MM format', () => { + const result = formatSplitTime(9, 15); + expect(result).toMatch(/^\d{2}:\d{2}$/); + }); + }); + + describe('formatTimeForTimePicker', () => { + test('formats time correctly for a given date object', () => { + // Mock date object with hours and minutes methods + const mockDate = { + hours: () => 9, + minutes: () => 30, + }; + const expected = '09:30'; + const result = formatTimeForTimePicker(mockDate); + expect(result).toBe(expected); + }); + + test('pads single-digit hours and minutes with leading zeros', () => { + const mockDate = { + hours: () => 5, + minutes: () => 4, + }; + const expected = '05:04'; + const result = formatTimeForTimePicker(mockDate); + expect(result).toBe(expected); + }); + + test('handles times at the edge of valid ranges', () => { + const mockDate = { + hours: () => 23, + minutes: () => 59, + }; + const expected = '23:59'; + const result = formatTimeForTimePicker(mockDate); + expect(result).toBe(expected); + }); + }); +}); diff --git a/src/web/utils/formatSplitTime.js b/src/web/utils/timePickerHelpers.js similarity index 65% rename from src/web/utils/formatSplitTime.js rename to src/web/utils/timePickerHelpers.js index 60c4a9b3a1..83e1ac0d07 100644 --- a/src/web/utils/formatSplitTime.js +++ b/src/web/utils/timePickerHelpers.js @@ -3,3 +3,6 @@ export const formatSplitTime = (start_hour, start_minute) => { const formattedStartMinute = start_minute.toString().padStart(2, '0'); return `${formattedStartHour}:${formattedStartMinute}`; }; + +export const formatTimeForTimePicker = date => + `${date.hours().toString().padStart(2, '0')}:${date.minutes().toString().padStart(2, '0')}`; diff --git a/src/web/wizard/__tests__/advancedtaskwizard.jsx b/src/web/wizard/__tests__/advancedtaskwizard.jsx index d656298f02..ee914c2e08 100644 --- a/src/web/wizard/__tests__/advancedtaskwizard.jsx +++ b/src/web/wizard/__tests__/advancedtaskwizard.jsx @@ -116,14 +116,20 @@ describe('AdvancedTaskWizard component tests', () => { const radioInputs = getRadioInputs(); const radioTitles = getRadioTitles(); - const selectedDate = 'Jan 01, 2020, 01:10:00 PM'; + const selectedDate = '01/01/2020'; const datePickerLabel = screen.getByLabelText('Start Date'); const startDateButton = screen.getByRole('button', {name: selectedDate}); + const selectedTime = '12:10'; + const timePickerLabel = screen.getByLabelText('Start Time'); + expect(startDateButton).toBeVisible(); expect(datePickerLabel).toBeVisible(); expect(startDateButton).toHaveTextContent(selectedDate); + expect(timePickerLabel).toBeVisible(); + expect(timePickerLabel).toHaveValue(selectedTime); + expect(formGroups[0]).toHaveTextContent('Task Name'); expect(formGroups[1]).toHaveTextContent('Scan Config'); diff --git a/src/web/wizard/__tests__/modifytaskwizard.jsx b/src/web/wizard/__tests__/modifytaskwizard.jsx index d2c7e403dc..704b37a0c3 100644 --- a/src/web/wizard/__tests__/modifytaskwizard.jsx +++ b/src/web/wizard/__tests__/modifytaskwizard.jsx @@ -86,14 +86,20 @@ describe('ModifyTaskWizard component tests', () => { const radioInputs = getRadioInputs(); const radioTitles = getRadioTitles(); - const selectedDate = 'Jan 01, 2020, 01:10:00 PM'; + const selectedDate = '01/01/2020'; const datePickerLabel = screen.getByLabelText('Start Date'); const startDateButton = screen.getByRole('button', {name: selectedDate}); + const selectedTime = '12:10'; + const timePickerLabel = screen.getByLabelText('Start Time'); + expect(startDateButton).toBeVisible(); expect(datePickerLabel).toBeVisible(); expect(startDateButton).toHaveTextContent(selectedDate); + expect(timePickerLabel).toBeVisible(); + expect(timePickerLabel).toHaveValue(selectedTime); + expect(baseElement).toHaveTextContent('Setting a start time'); expect(baseElement).toHaveTextContent('Setting an email Address');