Fix frontend unit tests

web/html/src/core/intl/index.test.tsx

@@ -1,3 +1,5 @@
+import React from "react";
+
 import ReactDOMServer from "react-dom/server";
 
 import { t } from "./index";
@@ -24,7 +26,9 @@ describe("new t()", () => {
     };
     const expected = 'foo <a href="/">bar</a>';
 
-    expect(ReactDOMServer.renderToStaticMarkup(<>{t(input, inputArgs)}</>)).toEqual(expected);
+    expect(
+      ReactDOMServer.renderToStaticMarkup(<React.Fragment key="key">{t(input, inputArgs)}</React.Fragment>)
+    ).toEqual(expected);
   });
 
   test("tags with named placeholders", () => {
@@ -35,7 +39,9 @@ describe("new t()", () => {
     };
     const expected = 'foo <a href="/">something</a> bar';
 
-    expect(ReactDOMServer.renderToStaticMarkup(<>{t(input, inputArgs)}</>)).toEqual(expected);
+    expect(
+      ReactDOMServer.renderToStaticMarkup(<React.Fragment key="key">{t(input, inputArgs)}</React.Fragment>)
+    ).toEqual(expected);
   });
 
   // This behavior allows existing `handleResponseError` implementations to pass `{ arg: undefined }` even when there is no arg

web/html/src/core/log/loggerhead.ts

@@ -21,7 +21,7 @@ export default class Loggerhead {
 
     // We hijack the global console to ensure errors thrown in third-party code get logged too
     // If we're running unit tests in a Node env, skip this
-    if (typeof window !== "undefined") {
+    if (window.location.hostname !== "localhost" && typeof window !== "undefined" && process.env.NODE_ENV !== "test") {
       console.log = this.log;
       console.info = this.info;
       console.debug = this.debug;

web/html/src/utils/datetime/localizedMoment.test.ts

@@ -59,11 +59,12 @@ describe("localizedMoment", () => {
   });
 
   test("full server string keeps offset", () => {
+    // Japan doesn't observe daylight saving time
     expect(localizedMoment().toServerString()).toContain("JST");
   });
 
   test("full user string keeps offset", () => {
-    expect(localizedMoment().toUserString()).toContain("PDT");
+    expect(localizedMoment().toUserString()).toMatch(/PST|PDT/);
   });
 
   test("calendar output uses config formats", () => {

web/html/src/utils/test-utils/server.ts

@@ -4,7 +4,7 @@ import { setupServer } from "msw/node";
 const baseServer = setupServer();
 const serverAddons = {
   /** Mock a GET request to `url` with a successful JSON response containing `response` */
-  mockGetJson(url, response) {
+  mockGetJson<T>(url: string, response: T) {
     return server.use(
       rest.get(url, (req, res, ctx) => {
         return res(ctx.json(response));

web/html/src/utils/test-utils/setup/index.ts

@@ -17,9 +17,9 @@ global.t = t;
 
 const loggerHead = new Loggerhead("", (headers) => headers);
 
-loggerHead.info = (message: string) => console.info(`[Loggerhead] INFO : ${message}`);
-loggerHead.debug = (message: string) => console.debug(`[Loggerhead] DEBUG : ${message}`);
-loggerHead.warn = (message: string) => console.warn(`[Loggerhead] WARN : ${message}`);
-loggerHead.error = (message: string) => console.error(`[Loggerhead] ERROR : ${message}`);
+loggerHead.info = console.info.bind(console, "[Loggerhead] INFO:");
+loggerHead.debug = console.debug.bind(console, "[Loggerhead] DEBUG:");
+loggerHead.warn = console.warn.bind(console, "[Loggerhead] WARN:");
+loggerHead.error = console.error.bind(console, "[Loggerhead] ERROR:");
 
 global.Loggerhead = loggerHead;