Typescript: Missing/wrong types for Context

[trygveaa]

Describe the bug
I have a middleware which is using $axios and req.originalUrl from Context. Both of these work fine in runtime, but are missing in the types.

To Reproduce

1. Create a middleware with this contents:

import { Context } from '@nuxt/types'

export default async function({ $axios, req }: Context) {
  console.log($axios)
  console.log(req.originalUrl)
}

1. Observe that the following typescript errors occur:

   Property '$axios' does not exist on type 'Context'.
   Property 'originalUrl' does not exist on type 'IncomingMessage'.

2. Make a request to the server and observe that it logs an axios instance and a path string.

Expected behavior
The types should be present and correct. I'm not completely sure about the types, but I think $axios should be of type AxiosInstance from axios and req should be of type Request from express.

As an aside, the documentation at https://nuxtjs.org/api/context which doesn't mention $axios and says that req is http.Request/http.IncomingMessage should preferably also be changed.

Additional context
Versions:
nuxt: 2.10.2
@nuxt/typescript-build: 0.3.3
@nuxt/typescript-runtime: 0.2.3

[trygveaa]

Sorry, I see now that @nuxtjs/axios declares $axios for the Context type so by adding import '@nuxtjs/axios' to the middleware it type checked correctly.

So you can ignore the part about axios in the original post, but the part about req is still an error as far as I can see.

[trygveaa]

I think [...] req should be of type Request from express.

This seems to be wrong as it doesn't have the hostname property or the get function. So I'm not sure which type it is.

[kevinmarrec]

1) https://github.com/nuxt/typescript/issues/180#issuecomment-549456811 -> @nuxtjs/axios needs to be added to types array of tsconfig.json to not have to import it in your middleware.

2) https://github.com/nuxt/typescript/issues/180#issuecomment-549481441 -> Well I'm not sure what is the type, maybe diving into Nuxt core may result on finding where it's defined and then determine the type. I'm lacking time to do so for now (busy with main job work), any help is appreciated then :)

[trygveaa]

1. Ah, thanks.

2. Yeah, I tried looking a bit at it, but it wasn't that easy to find.

[kevinmarrec]

@trygveaa I think ctx.req in Middlewares VS req param of Server Middlewares are different.
hostname & get function are properly available in ServerMiddlewares.

Please open a new issue if needed cause this one contains too much stuff about axios which is not related to the remaining issue if there's really one.

[trygveaa]

@kevinmarrec: I was made aware in #183 that nuxt uses connect, not express. I see that the types for connect is also missing originalUrl, so I made a PR for it: https://github.com/DefinitelyTyped/DefinitelyTyped/pull/40776

I can make a new issue/PR when/if that is merged.

[kevinmarrec]

@trygveaa Great ! Well it should be updated automatically by Renovate bot if they release new version of the types.

[trygveaa]

@kevinmarrec: You need to change the class used, so the bot won't do it. I've created PR #251 for it.