Supabase broadcast not working in local development

onMount(() => {
  if (!page.data.supabase) return;

  const broadcastChannel = page.data.supabase
    .channel('TEST')
    .on('broadcast', { event: 'typing' }, (payload) => {
      //this doesnt log anything from my sendTyping function
      console.log(payload);
    })
    .subscribe();

  return () => broadcastChannel.unsubscribe();
});

const sendTyping = () => {
  if (!page.data.supabase) return;

  const sendingTyping = page.data.supabase.channel('TEST');

  sendingTyping
  .send({ type: 'broadcast', event: 'typing', payload: { from: page.data.user?.id } })
  .then((x) => {
    //this tells me that it sent successfully it logs 'typing sent ok'
    console.log('typing sent', x);
  });
};

onMount(() => {
  if (!page.data.supabase) return;

  const broadcastChannel = page.data.supabase
    .channel('TEST')
    .on('broadcast', { event: 'typing' }, (payload) => {
      //this doesnt log anything from my sendTyping function
      console.log(payload);
    })
    .subscribe();

  return () => broadcastChannel.unsubscribe();
});

const sendTyping = () => {
  if (!page.data.supabase) return;

  const sendingTyping = page.data.supabase.channel('TEST');

  sendingTyping
  .send({ type: 'broadcast', event: 'typing', payload: { from: page.data.user?.id } })
  .then((x) => {
    //this tells me that it sent successfully it logs 'typing sent ok'
    console.log('typing sent', x);
  });
};