htmx Headers hx-triggers

O como hacer un request a un destino que nos envía una cabecera que desencadena en una alerta por JS al llegar a su posición.

header-event.php

<?php
header('HX-Trigger: myEvent');
header('Cache-Control: no-cache');
flush();
?>

Lo llamamos desde una capa que hemos puesto al final de la página, para que la alerta nos aparezca al llegar a la capa.

ul>li*30 (por ejemplo)

<div 
hx-get="header-event.php"
    hx-trigger="revealed"
>sorpresa!
</div>

Y por último, de diremos a la página que esté pendiente de si se lanza myEvent para mostrar una alerta

<script>
document.body.addEventListener("myEvent", function(evt){
    alert("myEvent ha sido llamado!");
})
</script>

Una vez se haya cerrado la alerta, el contenido que hayamos puesto en la capa (sorpresa! – en el ejemplo) desaparece.