Definitelytyped: Cannot use UserAgentParser as class type from "ua-parser-js"

[JoshuaKGoldberg]

If you know how to fix the issue, make a pull request instead.

• [x] I tried using the @types/ua-parser-js package and had problems.
• [x] I tried using the latest stable version of tsc. https://www.npmjs.com/package/typescript
• [x] I have a question that is inappropriate for StackOverflow. (Please ask any appropriate questions there).
• [x] [Mention](https://github.com/blog/821-mention-somebody-they-re-notified) the authors (see Definitions by: in index.d.ts) so they can respond.
  
  
  
  • Authors: @superduper @legendecas @MeLlamoPablo>
  
  

import UserAgentParser = require("ua-parser-js");

const parser: UserAgentParser = new UserAgentParser();
//            ~~~~~~~~~~~~~~~

Cannot find name 'UserAgentParser'.

[MeLlamoPablo]

This could be fixed by changing:

declare module "ua-parser-js" {
+    export class UAParser {
-    class UAParser {
        static VERSION: string;
        static BROWSER: IUAParser.BROWSER;
        static CPU: IUAParser.CPU;
        static DEVICE: IUAParser.DEVICE;
        static ENGINE: IUAParser.ENGINE;
        static OS: IUAParser.OS;

        /* ... */
    }
-   const exported: typeof UAParser & { UAParser: typeof UAParser };
-   export = exported
}

However it would invalidate the following import syntaxes:

import * as UAParser from "ua-parser-js"
import UAParser = require("ua-parser-js")

making this one be the only one valid:

import {UAParser} from "ua-parser-js"

I don't think this is a big deal at all because that's the standard ES6/TypeScript import syntax. @superduper @legendecas any thoughts?

[JoshuaKGoldberg]

Interestingly enough, it looks like the library supports both syntaxes, but only mentions the old-style import UAParser = require("ua-parser-js") in the README.

https://github.com/faisalman/ua-parser-js/blob/dfb8e758d107655897761115c4b1780d0d989e3c/src/ua-parser.js#L1009

https://github.com/faisalman/ua-parser-js/blob/dfb8e758d107655897761115c4b1780d0d989e3c/src/ua-parser.js#L1040

Since we shouldn't be importing * as classes, that change sounds reasonable (if slightly inaccurate) to me.

_(Edit: in case it wasn't clear, added the SO link as reference for MeLlamoPablo's point, not to restate what was already said 😊)_

[rimiti]

You can import it without the require keyword, like that:

import {NextFunction, Request, Response} from "express";
import {UAParser} from "ua-parser-js";

export default (req: Request, res: Response, next: NextFunction) => {
  req.ua = new UAParser((typeof req.headers["user-agent"] === "undefined") ? "" : req.headers["user-agent"] as (string));
  next();
};

[devth]

What's the solution here? I get Cannot find name 'UAParser' when using:

import * as UAParser from "ua-parser-js";

or

import {UAParser} from 'ua-parser-js';

and trying to use UAParser as a type, e.g.:

```typescript
type Context = {
browserInfo: UAParser;
};

[MeLlamoPablo]

@devth the solution is to make a PR with the diff that I described earlier in this issue. I was hesitant to make it before knowing the opinion on @superduper @legendecas but since they haven't answered I guess that it's ok to proceed.

This PR means making breaking changes but as @JoshuaKGoldberg mentioned the import * as foo from "bar" syntax is wrong to begin with, and the import foo = require("bar") is old, so I don't think that this is a big deal.

Go ahead and send a PR and I'll approve it, or I'll send it myself whenever I can.