From cb77605be83ebf2e64e26c029d934a2814cb7ce9 Mon Sep 17 00:00:00 2001 From: Dfdez Date: Thu, 30 Jan 2025 22:23:42 +0100 Subject: [PATCH 1/2] fix: fixed default format to handle utc properly --- packages/decap-cms-widget-datetime/src/DateTimeControl.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/decap-cms-widget-datetime/src/DateTimeControl.js b/packages/decap-cms-widget-datetime/src/DateTimeControl.js index ae0a636c822a..ffd280da6282 100644 --- a/packages/decap-cms-widget-datetime/src/DateTimeControl.js +++ b/packages/decap-cms-widget-datetime/src/DateTimeControl.js @@ -82,7 +82,7 @@ class DateTimeControl extends React.Component { const { field } = this.props; let inputType = 'datetime-local'; let inputFormat = 'YYYY-MM-DDTHH:mm'; - let format = 'YYYY-MM-DDTHH:mm:ss.SSS[Z]'; + let format = `YYYY-MM-DDTHH:mm:ss.SSS${this.isUtc ? '[Z]' : 'Z'}`; let userFormat = field?.get('format'); let dateFormat = field?.get('date_format'); let timeFormat = field?.get('time_format'); From 544a3acb6bb170af63581020680cdb2f4eae62dd Mon Sep 17 00:00:00 2001 From: Dfdez Date: Thu, 30 Jan 2025 22:29:21 +0100 Subject: [PATCH 2/2] feat: added test for default format on datetime widget --- .../src/__tests__/DateTimeControl.spec.js | 30 +++++++++++++++++++ 1 file changed, 30 insertions(+) diff --git a/packages/decap-cms-widget-datetime/src/__tests__/DateTimeControl.spec.js b/packages/decap-cms-widget-datetime/src/__tests__/DateTimeControl.spec.js index 3fee89e2ab0a..14eed45dccdc 100644 --- a/packages/decap-cms-widget-datetime/src/__tests__/DateTimeControl.spec.js +++ b/packages/decap-cms-widget-datetime/src/__tests__/DateTimeControl.spec.js @@ -35,8 +35,16 @@ function setup(propsOverrides = {}) { } describe('DateTimeControl', () => { + const mockDate = '2025-01-01T12:00:00.000Z'; + beforeEach(() => { jest.clearAllMocks(); + jest.useFakeTimers(); + jest.setSystemTime(new Date(mockDate)); + }); + + afterEach(() => { + jest.useRealTimers(); }); test('renders the component with input, now button, and clear button', () => { @@ -57,4 +65,26 @@ describe('DateTimeControl', () => { fireEvent.click(clearButton); expect(props.onChange).toHaveBeenCalledWith(''); }); + + test('sets value in custom format (local timezone) when input value changes', () => { + const { input, props } = setup({ field: new Map() }) + + const testDate = '2024-03-15T10:30:00'; + + fireEvent.change(input, { target: { value: testDate } }); + + const expectedValue = dayjs(testDate).format('YYYY-MM-DDTHH:mm:ss.SSSZ'); + expect(props.onChange).toHaveBeenCalledWith(expectedValue); + }); + + test('sets value in custom format (UTC) when input value changes', () => { + const { input, props } = setup({ field: new Map([['picker_utc', true]]) }); + + const testDate = '2024-03-15T10:30:00'; + + fireEvent.change(input, { target: { value: testDate } }); + + const expectedValue = dayjs(testDate).format('YYYY-MM-DDTHH:mm:ss.SSS[Z]'); + expect(props.onChange).toHaveBeenCalledWith(expectedValue); + }); });