fix(form): support non-UTC timezone date time in VaadinDateTimePicker (…

…#2882) (CP: main) (#2886) fix(form): support non-UTC timezone date time in VaadinDateTimePicker (#2882) Existing for VaadinDateTimePickerStrategy failed when running in non-UTC timezone environment. This change addresses the bug and makes the form library tests always use a non-UTC timezone. Co-authored-by: Anton Platonov <[email protected]> Co-authored-by: Luciano Vernaschi <[email protected]>
vaadin · Nov 18, 2024 · 0a9bd31 · 0a9bd31
1 parent 36dfcff
commit 0a9bd31
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/packages/ts/lit-form/package.json b/packages/ts/lit-form/package.json
@@ -21,7 +21,7 @@
     "build:dts": "tsc --isolatedModules -p tsconfig.build.json",
     "lint": "eslint src test",
     "lint:fix": "npm run lint -- --fix",
-    "test": "karma start ../../../karma.config.cjs --port 9876",
+    "test": "echo 'Using arbitrary non-UTC timezone for VaadinDateTimePickerStrategy tests'; TZ=\"Etc/GMT-12\" karma start ../../../karma.config.cjs --port 9876",
     "test:coverage": "npm run test -- --coverage",
     "test:watch": "npm run test -- --watch",
     "typecheck": "tsc --noEmit"

diff --git a/packages/ts/lit-form/src/Field.ts b/packages/ts/lit-form/src/Field.ts
@@ -312,11 +312,17 @@ export class VaadinDateTimeFieldStrategy<
   }
 
   override set value(val: T | undefined) {
-    if (!val || isEmptyObject(val)) {
+    const timestamp = Date.parse(val as string);
+
+    if (!val || isEmptyObject(val) || Number.isNaN(timestamp)) {
       super.value = '' as T;
+      return;
     }
-    const date = Date.parse(val as string);
-    super.value = (Number.isNaN(date) ? '' : new Date(date).toISOString().slice(0, 19)) as T;
+
+    const date = new Date(timestamp);
+    // Convert to ISO 8601 local combined date and time representation
+    const tzOffsetMs = 60 * 1000 * date.getTimezoneOffset();
+    super.value = new Date(timestamp - tzOffsetMs).toISOString().slice(0, 19) as T;
   }
 }