diff --git a/gui/globalSetup.js b/gui/globalSetup.js
new file mode 100644
index 0000000000000000000000000000000000000000..82883162e04eb6067ff73e7fd55f96efe302b32c
--- /dev/null
+++ b/gui/globalSetup.js
@@ -0,0 +1,3 @@
+export default () => {
+  process.env.TZ = 'Europe/Berlin'
+}
diff --git a/gui/package.json b/gui/package.json
index 6504496fa555ef380e75f091cb86d1b0d4b4d521..897f36112cf0a908a33cbf8fb25f2992556d9740 100644
--- a/gui/package.json
+++ b/gui/package.json
@@ -143,6 +143,7 @@
       "text-summary",
       "cobertura"
     ],
+    "globalSetup": "<rootDir>/globalSetup.js",
     "transformIgnorePatterns": [],
     "moduleNameMapper": {
       "^.+\\.(css|less)$": "<rootDir>/src/CSSStub.js",
diff --git a/gui/src/components/editQuantity/DateTimeEditQuantity.js b/gui/src/components/editQuantity/DateTimeEditQuantity.js
index 2e6a1943e9f3f03e593511e6daa176a27675cd1f..1588b5b2ba47c6bf1a94ac0e93dcb5326871ec92 100644
--- a/gui/src/components/editQuantity/DateTimeEditQuantity.js
+++ b/gui/src/components/editQuantity/DateTimeEditQuantity.js
@@ -27,7 +27,10 @@ export const DateTimeEditQuantity = React.memo((props) => {
   const [dateValue, setDateValue] = useState(value || null)
 
   useEffect(() => {
-    setDateValue(date => ((date?.toJSON && date.toJSON()) || value) === value ? date : value)
+    setDateValue(date => value
+      ? (date?.toJSON?.() || date) === value ? date : value
+      : null
+    )
   }, [value])
 
   const handleChange = useCallback((date) => {
diff --git a/gui/src/components/editQuantity/DateTimeEditQuantity.spec.js b/gui/src/components/editQuantity/DateTimeEditQuantity.spec.js
new file mode 100644
index 0000000000000000000000000000000000000000..697fbd7f999f705b5bf436967deebf7a6331831a
--- /dev/null
+++ b/gui/src/components/editQuantity/DateTimeEditQuantity.spec.js
@@ -0,0 +1,76 @@
+/*
+ * Copyright The NOMAD Authors.
+ *
+ * This file is part of NOMAD. See https://nomad-lab.eu for further info.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from 'react'
+import { renderNoAPI, screen } from '../conftest.spec'
+import { fireEvent } from '@testing-library/react'
+import { DateTimeEditQuantity } from './DateTimeEditQuantity'
+
+const changeValue = async (input, newValue) => {
+  await fireEvent.change(input, { target: { value: newValue } })
+  await fireEvent.keyDown(input, {key: 'Enter', code: 'Enter'})
+}
+
+const handleChange = jest.fn(value => {})
+const quantityDef = {
+  name: 'name',
+  description: `This is **MARKDOWN** help text.`
+}
+
+test('initial value is displayed correctly', async () => {
+  renderNoAPI(<DateTimeEditQuantity
+    quantityDef={quantityDef}
+    onChange={handleChange}
+    value='1970-01-01T15:00:00.000Z'
+  />)
+  screen.getByDisplayValue('01/01/1970 16:00')
+})
+
+test('nil value should not display anything', async () => {
+  renderNoAPI(<DateTimeEditQuantity
+    quantityDef={quantityDef}
+    onChange={handleChange}
+  />)
+  const input = screen.getByRole('textbox')
+  expect(input.value).toBe('')
+})
+
+test('internal change updates time correctly and triggers callback', async () => {
+  renderNoAPI(<DateTimeEditQuantity
+    quantityDef={quantityDef}
+    onChange={handleChange}
+  />)
+  const input = screen.getByRole('textbox')
+  await changeValue(input, '01/01/1970 17:00')
+  screen.getByDisplayValue('01/01/1970 17:00')
+  expect(handleChange.mock.calls).toHaveLength(1)
+  expect(handleChange.mock.calls[0][0]).toBe('1970-01-01T16:00:00.000Z')
+})
+
+test('external change (without internal change) updates time correctly', async () => {
+  const {rerender} = renderNoAPI(<DateTimeEditQuantity
+    quantityDef={quantityDef}
+    onChange={handleChange}
+  />)
+  rerender(<DateTimeEditQuantity
+    quantityDef={quantityDef}
+    onChange={handleChange}
+    value='1970-01-01T16:00:00.000Z'
+  />)
+  screen.getByDisplayValue('01/01/1970 17:00')
+})