Obter e definir volume com JavaScript

O <audio> e <video> oferecem muito mais funcionalidades do que a maioria das pessoas sabe. Por exemplo, o senhor sabia que é possível detectar as tags formatos de vídeo e formatos de áudio usando alguns truques de JavaScript? Isso me fez pensar sobre as possibilidades de detectar o volume do sistema com JavaScript no navegador.

Detesto ser desmancha-prazeres, mas infelizmente o JavaScript não fornece acesso direto ao sistema mas o senhor pode, usando o <audio> e/ou <video> definem e obtêm o nível de volume de forma programática.

// Getting volume level
const volume = document.querySelector("video").volume; // 1 

// Setting volume level
document.querySelector("video").volume = 0.5;  // set volume to 50%

O senhor também pode ouvir as alterações de volume com o evento “onvolumechange”:

document.querySelector("video").addEventListener("onvolumechange", e => {
    // Change your custom control UI
});

Faz sentido que não seja possível definir o nível de volume do sistema a partir de um trecho aleatório de JavaScript em um navegador, mas eu tinha uma pequena esperança de que o senhor pudesse recuperar esse nível. Definir o volume com JavaScript para uma determinada mídia é relativo ao nível de volume do sistema, mas, pelo menos, podemos criar controles personalizados para esses elementos com o .volume settings!