@types/react cannot find name 'HTMLDialogElement'

Question

I am encountering a weird build issue with typescript and @types/react. I have two typescript config files: one for files which use react, and one for those that don't. When building the portion of my project which doesn't use react, I see the following error:

node_modules/@types/react/index.d.ts(3508,58): error TS2304: Cannot find name 'HTMLDialogElement'. node_modules/@types/react/index.d.ts(3508,78): error TS2304: Cannot find name 'HTMLDialogElement'. node_modules/@types/react/index.d.ts(3782,72): error TS2304: Cannot find name 'HTMLDialogElement'. node_modules/@types/react/index.d.ts(3782,92): error TS2304: Cannot find name 'HTMLDialogElement'.

I was able to reproduce the error with a minimal example:

node_modules/typescript/bin/tsc typescript/foo.ts --outDir static/js/src --module none

The file typescript/foo.ts is a minimal file I used to reproduce the problem, and is deliberately short:

function printNumber(n: number) {
    console.log(n);
}

let x = 3;
x *= 4;
printNumber(x);

Note that foo.ts does not have any references to react whatsoever. The weirdest part of this is when I uninstall @types/react, the error messages go away.

What's going on?

EDIT: I found this issue which manifests when tsc version > 2.3.2. I downgraded tsc to version 2.3.2 but the problem persists.

Answer 1

As fair as I understand the typescript's policies, this is relative to the version you are using. When typescript 2.3.2 was out the definition for HTMLDialogElement was not included in @types/react, so you see this error. You can read more about this in this github issue.

Probably, even if you don't include React on your foo.ts, the typescript compiler will include and check all the definitions that you've got, even those in node_modules. This will explain why you have this error even without including React.

Now that I think about it, I don't event include the definitions that I wrote - but they're used by the transpiler.

I had the same issue on a project recently cloned yesterday; I fixed it by updating typescript to ^2.7.0.