Web Speech API - Local voices not functioning - Mac OSX

I've been trying to use speech synthesis provided by the Web Speech API. None of the examples I found online were working except one which picked voices at random. I realized the only voices working were those provided by google rather than the local voices provided by OSX. My guess is there is some OSX permission I need to enable so the browser can use those voices. Here is my code:

let utterance = new SpeechSynthesisUtterance();
let voices = [];
let isLoaded = false;

window.speechSynthesis.onvoiceschanged = () => {
  if (!isLoaded) {
    voices = window.speechSynthesis.getVoices();
    isLoaded = true;
    console.log('Voices loaded!', voices);
    utterance.voice = voices[50]; // Set your voice by index here
  }
};

const setup = () => {
  const button = document.getElementById('button');
  button.addEventListener('click', e => {
    if (isLoaded) {
      synth.cancel();
      utterance.text = 'Hello World';
      utterance.volume = 1;
      utterance.rate = 1;
      utterance.pitch = 1;
      utterance.lang = 'en-US';
      console.log(utterance);
      synth.speak(utterance);
    }
  });
};