remix: `@remix-run/web-fetch` causes tests to error after upgrade to jest 28

What version of Remix are you using?

1.5.1

Steps to Reproduce

update jest-related dependencies to v28 as per #3400
add transformIgnorePatterns as per https://github.com/remix-run/remix/pull/3400#issuecomment-1147594562
run yarn test:primary

Expected Behavior

Tests should pass

Actual Behavior

    TypeError: Class extends value undefined is not a constructor or null

      34 | class NodeRequest extends WebRequest {
      35 |   constructor(info: NodeRequestInfo, init?: NodeRequestInit) {
    > 36 |     super(info, init as RequestInit);
         |                                     ^
      37 |   }
      38 |

This seems to relate to the types output by @remix-run/web-fetch:

export { default, fetch, Headers, Request, Response } from "./fetch.js";
export { ReadableStream, Blob, FormData } from "./package.js";
//# sourceMappingURL=lib.node.d.ts.map

node_modules/@remix-run/web-fetch/dist/src/lib.node.d.ts

fetch.js and package.js do not exist in the distributed @remix-run/web-fetch and should either be included or lib.node.d.ts should be pointing to fetch.d.ts and package.d.ts

About this issue

Original URL
State: closed
Created 2 years ago
Comments: 22 (18 by maintainers)

Commits related to this issue

Prefer require, import and types exports over browser Exports are resolved in order, i.e. the first match is used. I'm not sure why the browser export is using the raw src, however this causes issue... — committed to penx/web-std-io by penx 2 years ago
Prefer require, import and types exports over browser Exports are resolved in order, i.e. the first match is used. I'm not sure why the browser export is using the raw src, however this causes issue... — committed to penx/web-std-io by penx 2 years ago
Prefer require, import and types exports over browser Exports are resolved in order, i.e. the first match is used. I'm not sure why the browser export is using the raw src, however this causes issue... — committed to penx/web-std-io by penx 2 years ago

Most upvoted comments

For what it’s worth, we’re running into this exact same issue and had to downgrade to Jest 27. I guess we’re blocked until Remix upgrades to Jest 28?

    /Users/vpfaulkner/Documents/Code/yellowhat/appy/node_modules/@remix-run/web-fetch/src/lib.js:4
    export { ReadableStream, Blob, FormData  } from './package.js';
    ^^^^^^

    SyntaxError: Unexpected token 'export'

      1 | import type { ActionArgs } from "@remix-run/node"
    > 2 | import { json } from "@remix-run/node"

Our Jest config:

module.exports = {
  preset: "ts-jest",
  testEnvironment: "jsdom",
  transform: {
    "^.+\\.(ts|tsx)?$": "ts-jest",
  },
  moduleNameMapper: {
    "^~/(.*)$": "<rootDir>/app/$1",
  },
}

vpfaulkner on Mar 9, 2023

Changing the order to

      "types": "./dist/src/lib.node.d.ts",
      "browser": "./src/lib.js",
      "require": "./dist/lib.node.cjs",
      "import": "./src/lib.node.js"

Still results in the same issue, though

      "types": "./dist/src/lib.node.d.ts",
      "require": "./dist/lib.node.cjs",
      "import": "./src/lib.node.js",
      "browser": "./src/lib.js"

It is fixed as before. I’d read about the types export recently too - I’ll update my PR to do that.

penx on Jun 6, 2022

I haven’t completely traced the source of the issue but it seems changing

    ".": {
      "browser": "./src/lib.js",
      "require": "./dist/lib.node.cjs",
      "import": "./src/lib.node.js",
      "types": "./dist/src/lib.node.d.ts"
    },

    ".": {
      "require": "./dist/lib.node.cjs",
      "import": "./src/lib.node.js",
      "types": "./dist/src/lib.node.d.ts",
      "browser": "./src/lib.js"
    },

…in the @remix-run/web-fetch package.json seems to resolve this issue.

There are continued Jest issues after this though so I’ll try to keep digging.

penx on Jun 6, 2022

This was preventing the upgrade from Jest 27 to 28+

Remix is still using Jest 27 and the upstream PR I raised to resolve this has not been merged, so I am pretty sure it is still an issue.

https://github.com/remix-run/web-std-io/pull/11

penx on Jan 22, 2023

@penx is this still a problem for you?

machour on Jan 22, 2023

Do we still need the update jest to v28 after that change?

yes I am pretty sure the jest update is still needed so that it can resolve

import { getTestServer } from "@google-cloud/functions-framework/testing";

From what I remember, before Jest 28, Jest won’t look for exports defined in package.json

penx on Jun 6, 2022

@penx I meant the thing you referenced that was referencing Community Conditions Definitions.

MichaelDeBoey on Jun 6, 2022

Read something about Community Conditions Definitions today (can’t remember where though 😅), which says types should always be first. So that might already be a good thing to change.

https://nodejs.org/api/packages.html#community-conditions-definitions

MichaelDeBoey on Jun 6, 2022

@penx You can always create a PR to https://github.com/remix-run/web-std-io if you want.

MichaelDeBoey on Jun 6, 2022