Fix jest imports of temporal-polyfill

Author: tristanlabelle

app/web/jest.config.ts

@@ -30,6 +30,7 @@ const customJestConfig: Config = {
   // @TODO(NA) ^^ Fixed in react-query v4, but we are still on v3. Remove this when we upgrade.
   moduleDirectories: ["node_modules", "<rootDir>"],
   reporters: ["default", "jest-junit"],
+  resolver: "<rootDir>/jest.resolver.js",
   setupFilesAfterEnv: ["./test/setupTests.ts"],
   testPathIgnorePatterns: ["<rootDir>/node_modules/", "<rootDir>/.next/"],
   testEnvironment: "jsdom",
@@ -38,7 +39,6 @@ const customJestConfig: Config = {
     // https://jestjs.io/docs/configuration#transform-objectstring-pathtotransformer--pathtotransformer-object
     "^.+\\.(js|jsx|ts|tsx)$": ["babel-jest", { presets: ["next/babel"] }],
   },
-  transformIgnorePatterns: ["/node_modules/"],
   resetMocks: true,
 };
 

app/web/jest.resolver.js

@@ -0,0 +1,19 @@
+// temporal-polyfill and temporal-utils only publish an "import" export condition, which
+// Jest's default CJS module resolution doesn't request, so plain `require()` resolution
+// fails with "Cannot find module". Request the "import" condition just for these packages
+// instead of globally (globally breaks other node_modules that pick their unbuilt ESM entry
+// over a CJS one, e.g. dedent).
+const ESM_ONLY_PACKAGES = ["temporal-polyfill", "temporal-utils"];
+
+module.exports = (path, options) => {
+  const isEsmOnly = ESM_ONLY_PACKAGES.some(
+    (name) => path === name || path.startsWith(`${name}/`),
+  );
+  if (isEsmOnly) {
+    return options.defaultResolver(path, {
+      ...options,
+      conditions: [...(options.conditions ?? []), "import"],
+    });
+  }
+  return options.defaultResolver(path, options);
+};

app/web/next.config.js

@@ -23,6 +23,9 @@ const nextConfig = {
   },
   i18n,
   productionBrowserSourceMaps: true,
+  // ESM-only packages with no CommonJS entry point - Next.js (and next/jest) need to
+  // transpile these themselves rather than treating them as pre-built node_modules.
+  transpilePackages: ["temporal-polyfill", "temporal-utils"],
   webpack: (config, { isServer }) => {
     if (isServer) {
       generateBlogIndex();