Parameters mismatch Typescript definitions

DaveStein commented 3 years ago

Just found your repo over here: https://stackoverflow.com/questions/62230808/test-nextjs-api-middleware-with-jest

I did httpMocks.createRequest<NextApiRequest>(); and httpMocks.createResponse<NextApiRequest>(); but TS complains. Does this repo need an update or am I doing something wrong? I'm currently on Next 11.0.1

Type 'NextApiRequest' does not satisfy the constraint 'Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>'.
  Type 'NextApiRequest' is missing the following properties from type 'Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>': get, header, accepts, acceptsCharsets, and 30 more.

Type 'NextApiResponse<any>' does not satisfy the constraint 'Response<any, Record<string, any>>'.
  Type 'ServerResponse & { send: Send<any>; json: Send<any>; status: (statusCode: number) => NextApiResponse<any>; redirect(url: string): NextApiResponse<...>; redirect(status: number, url: string): NextApiResponse<...>; setPreviewData: (data: string | object, options?: { ...; } | undefined) => NextApiResponse<...>; clearPr...' is missing the following properties from type 'Response<any, Record<string, any>>': sendStatus, links, jsonp, sendFile, and 18 more.

DaveStein commented 3 years ago

PS: I just realized Next11 is only a couple weeks old

doshii-mo commented 3 years ago

PS: I just realized Next11 is only a couple weeks old

I get the same on 10.2.3

doshii-mo commented 3 years ago

@DaveStein Not sure if you've got auth0 package installed? I notice I only get this if I install that package. If I remove it, it goes away.

Example Sandbox https://codesandbox.io/s/zo9bl?file=/pages/index.tsx

DaveStein commented 3 years ago

I don't have auth0 anywhere in my package-lock.json so maybe it's some dependency of that we both have?

pmazumder3927 commented 3 years ago

I'm having this issue as well. Removing @auth0/nextjs-auth0 didn't fix it for me.

fillon commented 3 years ago

same here

MGough commented 3 years ago

I'm also seeing this issue with next 10.2.3 and node-mocks-http 1.10.0 (as 1.11.0 is not on the Yarn registry yet).

Has anyone found a way to resolve this issue?

The error I'm seeing is very slightly different in terms of number of missing properties:

Type 'NextApiRequest' does not satisfy the constraint 'Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>'.
  Type 'NextApiRequest' is missing the following properties from type 'Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>': get, header, accepts, acceptsCharsets, and 23 more.

Type 'ServerResponse & { send: Send<any>; json: Send<any>; status: (statusCode: number) => NextApiResponse<any>; redirect(url: string): NextApiResponse<...>; redirect(status: number, url: string): NextApiResponse<...>; setPreviewData: (data: string | object, options?: { ...; }) => NextApiResponse<...>; clearPreviewData: (...' is missing the following properties from type 'Response<any, Record<string, any>>': sendStatus, links, jsonp, sendFile, and 18 more.

ruohola commented 3 years ago

This happened to me when I installed a package that had specified @types/express as its dependency.

The issue is that createMocks requires an express.Request as the first generic argument, so when the types for that suddenly exist, NextApiRequest is then not a valid argument for it. Since while express.Request and NextApiRequest both extend Node's http.IncomingMessage, they are not compatible with each other.

I fixed this locally like this:

import { createMocks as _createMocks } from 'node-mocks-http';
import type { RequestOptions, ResponseOptions } from 'node-mocks-http';

const createMocks = _createMocks as (
  reqOptions?: RequestOptions,
  resOptions?: ResponseOptions,
  // @ts-ignore: Fixing this: https://github.com/howardabrams/node-mocks-http/issues/245
) => Mocks<NextApiRequest, NextApiResponse>;

...

const { req, res } = createMocks({
  method: 'GET',
});

// Check types by hovering:
// const req: MockRequest<NextApiRequest>
// const res: MockResponse<NextApiResponse<any>>