typscript 4.2.4 multiple errors "error TS2304: Cannot find name 'Request'"

[JustFly1984]

I'm working on updating some parts of an API, and tests as part of an API with typescript version 4.

I'm running tsc --noEmit without --skipLibCheck flag, and I see multiple typescript errors in logs.

node_modules/jest-fetch-mock/types/index.d.ts:20:39 - error TS2304: Cannot find name 'Response'.

20     extends jest.MockInstance<Promise<Response>, [string | Request | undefined, RequestInit | undefined]> {
                                         ~~~~~~~~

node_modules/jest-fetch-mock/types/index.d.ts:20:60 - error TS2304: Cannot find name 'Request'.

20     extends jest.MockInstance<Promise<Response>, [string | Request | undefined, RequestInit | undefined]> {
                                                              ~~~~~~~

node_modules/jest-fetch-mock/types/index.d.ts:20:81 - error TS2304: Cannot find name 'RequestInit'.

20     extends jest.MockInstance<Promise<Response>, [string | Request | undefined, RequestInit | undefined]> {
                                                                                   ~~~~~~~~~~~

node_modules/jest-fetch-mock/types/index.d.ts:21:23 - error TS2304: Cannot find name 'Request'.

21     (input?: string | Request, init?: RequestInit): Promise<Response>;
                         ~~~~~~~

node_modules/jest-fetch-mock/types/index.d.ts:21:39 - error TS2304: Cannot find name 'RequestInit'.

21     (input?: string | Request, init?: RequestInit): Promise<Response>;
                                         ~~~~~~~~~~~

node_modules/jest-fetch-mock/types/index.d.ts:21:61 - error TS2304: Cannot find name 'Response'.

21     (input?: string | Request, init?: RequestInit): Promise<Response>;
                                                               ~~~~~~~~

node_modules/jest-fetch-mock/types/index.d.ts:44:31 - error TS2304: Cannot find name 'Request'.

44     isMocking(input: string | Request): boolean;
                                 ~~~~~~~

node_modules/jest-fetch-mock/types/index.d.ts:97:57 - error TS2304: Cannot find name 'Request'.

97 export type UrlOrPredicate = string | RegExp | ((input: Request) => boolean);
                                                           ~~~~~~~

node_modules/jest-fetch-mock/types/index.d.ts:99:50 - error TS2304: Cannot find name 'Request'.

99 export type MockResponseInitFunction = (request: Request) => Promise<MockResponseInit | string>;
                                                    ~~~~~~~

I have found that this error is possibly related to Request type coming from typescript browser dom library, which is missing in node.js projects, hence causing the missing type.

I found similar issues in github: https://github.com/meilisearch/meilisearch-js/issues/661

[cwoolum]

Setting the following in my tsconfig.json fixed it for me.

{
    "target": "es2018", 
    "lib": ["DOM"]  
  },

[JustFly1984]

@cwoolum This is a server-side code, executes on Node.js. It should not have "DOM" lib instantiated, or there will be other bugs. "DOM" lib is only for browser clients target only.

[JustFly1984]

@yinzara

[yinzara]

While the library is a server side library, the fetch API is one that's defined in the dom types.

Technically I could add a:

import { Request } from "cross-fetch";

to our index.d.ts but that technically just imports the "dom" library types. So as stated, adding "DOM" to the lib in tsconfig does the same thing.

You should probably have two separate tsconfig files, one for testing and one for building. The testing one should have the lib reference and the building one should not.

[JustFly1984]

@yinzara Thank you for response! I could say yes to separate tsconfig files, but in case of this project, spec files resides along with ts files they test, and I'm not testing test files, I'm testing whole project with all dependencies, and all of it is backend code for typescript issues with latest ts version. I could --slipLibTest, but in this case I loose ability to see other dependency issues in the project.

import { Request } from "cross-fetch"; doesn't solve it, cos as you've confirmed, it does uses "dom" lib under the hood.

One more thing - we are not using cross-fetch, we are using node-fetch, so adding one more addiction to node-modules is not optimal, especially counting that cross-fetch is isomorphic by design, and this is not the case for our application.