animationevent.js

let square = document.getElementById('square');
square.addEventListener('animationstart', (ev) => {
    console.log("Animation Startted", ev);
});

square.addEventListener('animationiteration', (ev) => {
  console.log("animation_iteration", ev);
});

square.addEventListener('animationend', (ev) => {
   console.log("animation end", ev);
});

square.addEventListener('animationcancel', (ev) => {
    console.log("Animation canceled" , ev); 
});