Estoy tratando de reducir mi uso de jQuery y desencadenar un evento usando el constructor de eventos en JS.

La llamada de activación de jQuery que estoy tratando de replicar es

$(document).trigger('menu.refreshOptions');

El evento menu.refreshOptions se escucha y maneja en un archivo separado, con $(document).on('menu.refreshOptions', syncMenu);

En el archivo en el que estoy trabajando, intento construir un nuevo evento personalizado para desencadenar esto.

He probado ambos:

 let event = new CustomEvent('menu.refreshOptions', {bubbles:true}); document.dispatchEvent(event);

y

 document.dispatchEvent(new Event('menu.refreshOptions'));

En ambos casos, confirmé que se creó el evento, pero nunca llegué a la función de controlador de eventos syncMenu como se mencionó anteriormente.

No estoy seguro de lo que estoy haciendo mal aquí. ¿El hecho de que el controlador esté escrito en jQuery impide que se capture este evento JS? ¡Cualquier ayuda sería realmente apreciada!