The ConstantSourceNode is the newest member of the family of AudioScheduledSourceNodes. It is meant to output a signal with a constant value. At first glance its older siblings called AudioBufferSourceNode and OscillatorNode seem to be much more powerful but that is actually not the case. A ConstantSourceNode is just an innocent looking low level building block which only shows its true power when taking a closer look.
The AudioScheduledSourceNode interface
In the world of RxJS one would probably describe an AudioScheduledSourceNode as a cold observable. That means it doesn't do anything until it is explictly asked to do so. In case of an AudioScheduledSourceNode this can be done by calling its start() method. Once it has been started it continues playing until stop() gets called or (in case of an AudioBufferSourceNode) there is no more audio data left to be played. Another similarity to cold observables is that an AudioScheduledSourceNode can't be restarted once it is stopped. It is designed for one-time use only.
This is what the interface looks like, when written in TypeScript:
interface AudioScheduledSourceNode extends AudioNode {
onended: EventHandler;
start (when?: number): void;
stop (when?: number): void;
}The ConstantSourceNode interface
In addition to the common methods shared by all AudioScheduledSourceNodes a ConstantSourceNode has an AudioParam called offset which regulates its value. This turns the ConstantSourceNode into the missing piece which finally allows AudioParams to be connected to other AudioParams. Of course a ConstantSourceNode is an AudioNode and not an AudioParam, but you can think of it as a programmable AudioParam which can be connected to other AudioNodes and AudioParams. This is the scenario where it shows its full potential. MDN has a very detailed article about the ConstantSourceNode which also features an example use case.
The declaration of the interface in TypeScript looks like this:
interface ConstantSourceNode extends AudioScheduledSourceNode {
readonly offset: AudioParam;
}Browser support
Unfortunately the ConstantSourceNode is not supported in Edge and Safari. And at least in Safari the term Web Audio API is rather uncommon to be found in the release notes. Therefore chances are not high that there will be a native implementation in all major browsers any time soon. This is why a polyfill is currently required.
Polyfill design
Luckily a ConstantSourceNode (CSN) is mainly syntactic sugar. It can be modelled by using an AudioBufferSourceNode (ABSN) and a GainNode as the following diagram shows:
In order for that to work the AudioBufferSourceNode needs to be constructed with a single channel AudioBuffer with all samples set to 1. The AudioBufferSourceNode also needs to be looped. With all that in place all that needs to be done is connecting the AudioBufferSourceNode to the GainNode and setting up a proxy to make them appear as a single node to the outside world.
Sadly this is not the whole story. There are some subtle bugs which make the implementation a bit more complicated. But the good news is that you don't have to roll your own polyfill, instead you can use my package called standardized-audio-context which comes with a polyfill for the ConstantSourceNode. It also contains a polyfill for the AudioWorklet which relies on ConstantSourceNodes internally. But this is a whole topic on its own.
Ironically an AudioBufferSourceNode in Safari still has a built-in gain AudioParam which could be used to simplify the polyfill even more. However that gain AudioParam is not present in Edge as it was removed from the spec a while ago.