microsoft / TypeScript-DOM-lib-generator

Tool for generating dom related TypeScript and JavaScript library files
Apache License 2.0
600 stars 417 forks source link

Make DOM types available without polluting the global scope with 790 global variables #1734

Open SystemParadox opened 1 month ago

SystemParadox commented 1 month ago

Adding lib: ['DOM'] introduces 790 global variables. Many of these are deprecated and useless. Many of them have short names that can hide mistakes like a missing var or let. Some obvious offenders that absolutely result in regular bugs:

For this reason I have so far refrained from using lib: ['DOM'] in my projects and prefer to access all globals via window.foo instead for clarity and safety.

However, this means that TS doesn't know about any of these types. Please can we make these types available so that we can at least access and use the type information without polluting the global scope with all these variables.

I'd be happy with one that just declares document and window globals, or a types-only version that leave all globals up to us, either way I don't mind, just anything that makes the types available without all these junk globals.

HolgerJeromin commented 1 month ago

ref https://github.com/microsoft/TypeScript/issues/14306 and https://github.com/microsoft/TypeScript/issues/18433 Often "fixed" with a eslint rule no-restricted-globals

SystemParadox commented 1 month ago

If eslint had a way to whitelist only a specific set of acceptable globals that would be ok but having to blacklisting them all with no-restricted-globals is madness.

HolgerJeromin commented 1 month ago

Far from elegant but configuring eslint once is far from madness IMO.

eslint rule ```txt 'no-restricted-globals': [ 'error', // eslint severity // globals similar to local variables 'error', 'event', 'external', 'location', 'name', 'orientation', 'toString', // globals similar to local element properties 'addEventListener', 'blur', 'close', 'closed', 'dispatchEvent', 'focus', 'innerHeight', 'innerWidth', 'length', 'moveBy', 'moveTo', 'onclick', 'open', 'origin', 'outerHeight', 'outerWidth', 'parent', 'removeEventListener', 'resizeBy', 'resizeTo', 'scroll', 'scrollBy', 'scrollTo', 'scrollX', 'scrollY', 'status', 'stop', 'top', ], ```