@types/audioworklet + DOM API

[h-a-n-n-e-s]

Is there a proper way to use @types/audioworklet while keeping "lib": ["DOM",...] ?
(In the installation notes it says: Update your tsconfig.json to avoid clashing with the DOM APIs... You should remove "dom")

For doing front-end development while using AudioWorkletProcessor that would be really helpful.

[saschanaz]

What's the use case here? Are you creating a script that works as a normal script and also as a worklet script?

[h-a-n-n-e-s]

I'm writing a web app (that's what I need the DOM for) which uses webAudio including the AudioWorkletProcessor class. The types of that class are unknown by default (I wonder why?) so I have to use a JS file to make use of the class. I would like to use TS for that class as well.

[saschanaz]

That doesn't answer the question. Can you move your worklet script to a subdirectory and add another tsconfig.json to apply another set of lib? Why would you need both in one tsconfig?

[h-a-n-n-e-s]

Ok, that would be a solution.
I didn't know that one can have more than one tsconfig.json, so I did some search and found this feature "project references". Do you mean that?
I hope there is another way, because I just spent an hour trying to get this "references" thing to work, but it doesn't.
(For example, I get this problem)

[h-a-n-n-e-s]

So I guess it is only possible with "project references".

Coming back to the original issue, I just tried to add @types-audioworklet without deleting "DOM" from "lib" in the (one and only) tsconfig.json and everything works fine!

Could somebody give an example of how a "clashing with the DOM APIs" could happen?

[Krivega]

So I guess it is only possible with "project references".

Coming back to the original issue, I just tried to add @types-audioworklet without deleting "DOM" from "lib" in the (one and only) tsconfig.json and everything works fine!

Could somebody give an example of how a "clashing with the DOM APIs" could happen?

"lib": ["DOM", "ESNext"],
"compilerOptions": {
    "types": [ "audioworklet"]
  },

[h-a-n-n-e-s]

Sorry for asking very basic questions, but why do I need "types": [ "audioworklet"] in "compilerOptions"? For me everything works fine without it. (And with it nothing changes.)

[Bashamega]

Hello @h-a-n-n-e-s
Sorry for the late reply

The "types": ["audioworklet"] entry in your tsconfig.json file specifies that TypeScript should include type definitions for the audioworklet feature, which is part of the Web Audio API.

If everything works fine without it, it's likely because:

1. TypeScript's Default Behavior: TypeScript already has basic type definitions for common JavaScript APIs, including the Web Audio API. So, it's possible that TypeScript automatically includes these definitions without needing to explicitly list them in the types array.

2. No Direct Usage: If you aren't using the AudioWorklet directly in your code (or aren't using any features that require it), you wouldn't notice any difference whether or not it's explicitly listed in the types array.

In short, you only need "audioworklet" in the types array if you are working directly with the Web Audio API's AudioWorklet and want to ensure TypeScript has type definitions for it. If everything works without it, it just means TypeScript is able to resolve types for it without extra configuration in your case.

[saschanaz]

That looks like a plain ChatGPT answer that doesn't really help... 😅

This was a question and hasn't been active for years, so closing. Feel free to reopen or open a new issue for any remaining questions. Thanks!

@github-actions close

[github-actions]

Closing because @saschanaz is one of the code-owners of this repository.