Merge pull request #3 from dfdez/fix/default-date-format

Fix default datetime widget format
decaporg · Jan 30, 2025 · 10feebb · 10feebb
2 parents 269a14a + 544a3ac
commit 10feebb
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 1 deletion.
diff --git 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');

diff --git 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);
+  });
 });