Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: remove triple-slash directives from typings (#1285) #1287

Merged
merged 1 commit into from Jul 13, 2022

Conversation

yo1dog
Copy link
Contributor

@yo1dog yo1dog commented Sep 13, 2021

What is the purpose of this pull request?

  • Documentation update
  • Bug fix
  • New feature
  • Other, please explain:

What changes did you make? (provide an overview)
Remove the dom reference triple-slash directive from the typings file which pollutes the global ambient declarations with DOM types.

Which issue (if any) does this pull request address?

Is there anything you'd like reviewers to know?

@carnesen
Copy link

carnesen commented Nov 5, 2021

@yo1dog Does removing /// <reference lib="dom" /> break this package's types? I would guess it's there because this package references a type from the dom lib.

@yo1dog
Copy link
Contributor Author

yo1dog commented Nov 5, 2021

#1285

This line don't seem to be needed as nothing from the DOM library is referenced. Can we just delete this line? I tried doing so, and TypeScript had no complaints.

I removed the line there were no TypeScript errors in index.d.ts.

@joao-paulo-parity
Copy link

By the Blame feature (https://github.com/node-fetch/node-fetch/blame/6425e2021a7def096e13dbabcac2f10e6da83d11/%40types/index.d.ts) I found https://github.com/node-fetch/node-fetch/pull/1141/files#r671191147 which already more or less predicted that this /// <reference lib="dom" /> directive would become a problem. I think that is enough motivation to go forward with this PR.

What is missing and how can we unblock it? Would it help to perhaps put the typechecking on CI so that we'll not need someone to manually verify that the types are still correct?

Copy link

@PeterF521 PeterF521 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I agree with this change, because adding a reference of DOM library pollutes global scope with useless DOM declarations, considering that node-fetch is only used in Node.js projects.

@jimmywarting jimmywarting changed the title remove triple-slash directives from typings (#1285) types: remove triple-slash directives from typings (#1285) Jul 13, 2022
@jimmywarting jimmywarting changed the title types: remove triple-slash directives from typings (#1285) core: remove triple-slash directives from typings (#1285) Jul 13, 2022
@jimmywarting jimmywarting changed the title core: remove triple-slash directives from typings (#1285) chore: remove triple-slash directives from typings (#1285) Jul 13, 2022
@jimmywarting jimmywarting merged commit bcfb71c into node-fetch:main Jul 13, 2022
@github-actions
Copy link

🎉 This PR is included in version 3.2.9 🎉

The release is available on:

Your semantic-release bot 📦🚀

@stephank
Copy link

stephank commented Jul 20, 2022

I guess my project relied on these definitions, because it now fails with:

.yarn/cache/node-fetch-npm-3.2.9-37028f4521-ba421350b2.zip/node_modules/node-fetch/@types/index.d.ts:124:4 - error TS2749: 'FormData' refers to a value, but is being used as a type here. Did you mean 'typeof FormData'?

124  | FormData
       ~~~~~~~~

.yarn/cache/node-fetch-npm-3.2.9-37028f4521-ba421350b2.zip/node_modules/node-fetch/@types/index.d.ts:137:22 - error TS2749: 'FormData' refers to a value, but is being used as a type here. Did you mean 'typeof FormData'?

137  formData(): Promise<FormData>;
                         ~~~~~~~~

I think it's now trying to use this as a type: https://github.com/jimmywarting/FormData/blob/0fc449d79874bb4bcea45266080254f451b15a37/esm.min.d.ts#L1-L4

But errors also pop up in dependencies. formdata-polyfill itself has similar errors when DOM definitions are disabled, and fetch-blob breaks because Blob and File are no longer defined.

The simple workaround is adding "dom" to lib in tsconfig.json, but guess I don't really understand how this change was intended to work. 🤷‍♂️ (But I do agree it should be done somehow!)

@yo1dog
Copy link
Contributor Author

yo1dog commented Jul 21, 2022

I guess my project relied on these definitions, because it now fails with:

.yarn/cache/node-fetch-npm-3.2.9-37028f4521-ba421350b2.zip/node_modules/node-fetch/@types/index.d.ts:124:4 - error TS2749: 'FormData' refers to a value, but is being used as a type here. Did you mean 'typeof FormData'?

124  | FormData
       ~~~~~~~~

.yarn/cache/node-fetch-npm-3.2.9-37028f4521-ba421350b2.zip/node_modules/node-fetch/@types/index.d.ts:137:22 - error TS2749: 'FormData' refers to a value, but is being used as a type here. Did you mean 'typeof FormData'?

137  formData(): Promise<FormData>;
                         ~~~~~~~~

I am unable to replicate. I just did a quick test:

mkdir test && cd test
npm i node-fetch @types/node typescript
echo 'import fetch from 'node-fetch'; console.log(fetch);' > test.ts
npx tsc test.ts

Node 16.14.2
TypeScript 4.7.4
node-fetch 3.2.9
formdata-polyfill 4.0.10

No errors. Can you share what version of Node and Typescript you are using? Also the installed versions of node-fetch and formdata-polyfill?

@stephank
Copy link

I can reproduce it with your example if I instead do npx tsc --lib ES2021 test.ts. I guess DOM is a default include, and setting lib explicitely (via cli or tsconfig) removes it.

node.js v16.15.0

$ npm ls -a
nf@ /src/tests/nf
├── @types/node@18.0.6
├─┬ node-fetch@3.2.9
│ ├── data-uri-to-buffer@4.0.0
│ ├─┬ fetch-blob@3.2.0
│ │ ├── node-domexception@1.0.0
│ │ └── web-streams-polyfill@3.2.1
│ └─┬ formdata-polyfill@4.0.10
│   └── fetch-blob@3.2.0 deduped
└── typescript@4.7.4

mathieudutour added a commit to mathieudutour/node-fetch that referenced this pull request Aug 31, 2022
node-fetch#1287 has the unintended consequence of breaking the types of `AbortSignal`. This fixes it.

The [`AbortSignal` definition from `node-fetch`](https://github.com/node-fetch/node-fetch/blob/bcfb71c7d10da252280d13818daab6925e12c368/%40types/index.d.ts#L14-L19) is different from the [node's one](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/node/globals.d.ts#L59-L65).

This wasn't an issue before because the dom types were imported and were extending the nodejs types with the event listener methods, but that's not the case anymore.

The issue can be reproduce with the following steps:
```
mkdir test && cd test
npm i node-fetch @types/node typescript
touch test.ts
touch tsconfig.json
```

with the `tsconfig.json`:
```json
{
  "include": ["test.ts"],
  "compilerOptions": {
    "lib": ["es2022"],
    "module": "es2022",
    "target": "es2022",
    "skipLibCheck": true,
    "moduleResolution": "node"
  }
}
```

and the test.ts (taken from the README):
```ts
import fetch, { AbortError } from "node-fetch";

const controller = new AbortController();
const timeout = setTimeout(() => {
  controller.abort();
}, 150);

try {
  const response = await fetch("https://example.com", {
    signal: controller.signal,
  });
  const data = await response.json();
} catch (error) {
  if (error instanceof AbortError) {
    console.log("request was aborted");
  }
} finally {
  clearTimeout(timeout);
}
```

Running `npx tsc --project ./tsconfig.json` will show
```
test.ts:10:5 - error TS2739: Type 'AbortSignal' is missing the following properties from type 'AbortSignal': addEventListener, removeEventListener

10     signal: controller.signal,
       ~~~~~~

  node_modules/node-fetch/@types/index.d.ts:91:2
    91  signal?: AbortSignal | null;
        ~~~~~~
    The expected type comes from property 'signal' which is declared here on type 'RequestInit'


Found 1 error in test.ts:10
```
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Typings polutes global space with DOM types
7 participants