Merge pull request #4281 from nwright-nz/incorrect-homepage-clock-timezone-fix

Fix: added a check for invalid timezone

packages/core/src/layout/HomepageTimer/HomepageTimer.test.tsx

@@ -0,0 +1,53 @@
+/*
+ * Copyright 2021 Spotify AB
+ *
+ * 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 { renderWithEffects } from '@backstage/test-utils';
+import { HomepageTimer } from './HomepageTimer';
+import React from 'react';
+import { lightTheme } from '@backstage/theme';
+import { ThemeProvider } from '@material-ui/core';
+
+import {
+  ApiProvider,
+  ApiRegistry,
+  ConfigReader,
+  ConfigApi,
+  configApiRef,
+} from '@backstage/core-api';
+
+it('changes default timezone to GMT', async () => {
+  const configApi: ConfigApi = new ConfigReader({
+    homepage: {
+      clocks: [
+        {
+          label: 'New York',
+          timezone: 'America/New_Pork',
+        },
+      ],
+    },
+    context: 'test',
+  });
+
+  const rendered = await renderWithEffects(
+    <ThemeProvider theme={lightTheme}>
+      <ApiProvider apis={ApiRegistry.from([[configApiRef, configApi]])}>
+        <HomepageTimer />
+      </ApiProvider>
+    </ThemeProvider>,
+  );
+
+  expect(rendered.getByText('GMT')).toBeInTheDocument();
+});

packages/core/src/layout/HomepageTimer/HomepageTimer.tsx

@@ -39,18 +39,28 @@ function getTimes(configApi: ConfigApi) {
 
   for (const clock of clockConfigs) {
     if (clock.has('label') && clock.has('timezone')) {
+      let label = clock.getString('label');
+
       const options = {
         timeZone: clock.getString('timezone'),
         ...timeFormat,
       };
 
-      const time = d.toLocaleTimeString(lang, options);
-      const label = clock.getString('label');
+      try {
+        new Date().toLocaleString(lang, options);
+      } catch (e) {
+        // eslint-disable-next-line no-console
+        console.warn(
+          `The timezone ${options.timeZone} is invalid. Defaulting to GMT`,
+        );
+        options.timeZone = 'GMT';
+        label = 'GMT';
+      }
 
+      const time = d.toLocaleTimeString(lang, options);
       clocks.push({ time, label });
     }
   }
-
   return clocks;
 }