Using the ngx-sweetalert2 wrapper for Angular. Attempting to stop the sweet alert timer on mouseenter and resume it on mouseleave.
I've got a swal showing correctly and the eventlistener attaches to the modal element correctly and executes the anonymous function fine when the mouse enters the modal. However, the global method Swal.stopTimer() doesn't stop the timer of the currently displayed sweet alert.
hmtl:
<swal
#errorContent
position='top'
[toast]=true
icon="error"
[timerProgressBar]="true"
[timer]="3000"
[showConfirmButton]="false"
(didOpen)="addHoverEvent($event)"
(didDestroy)="nextToast()"
>
<div *swalPortal="swalTargets.content">
<strong class="d-flex justify-content-center">{{ this.body }}</strong>
</div>
</swal>
ts:
addHoverEvent(event: DidOpenEvent) {
event.modalElement.addEventListener('mouseenter', () => {
Swal.stopTimer();
});
event.modalElement.addEventListener('mouseleave', () => {
Swal.resumeTimer();
})
}