waitForVideoPlaying.js

/**
 * @param {HTMLVideoElement} videoElement
 */
export function waitForVideoPlaying(videoElement, duration = 500) {
  return new Promise((resolve, _reject) => {
    const seconds = duration / 1000;

    const timeUpdateHandler = (evt) => {
      if (evt.target.currentTime > seconds) {
        evt.target.removeEventListener('timeupdate', timeUpdateHandler);
        resolve();
      }
    };

    if (videoElement.currentTime > seconds) resolve();
    else videoElement.addEventListener('timeupdate', timeUpdateHandler);
  });
}

/**
 * @param {HTMLVideoElement} videoElement
 */
export function waitForVideoPlayThrough(videoElement) {
  return new Promise((resolve, _reject) => {
    const canplaythroughHandler = (evt) => {
      if (evt.target.readyState >= 4) {
        evt.target.removeEventListener('canplaythrough', canplaythroughHandler);
        resolve();
      }
    };

    if (videoElement.readyState >= 4) resolve();
    else videoElement.addEventListener('canplaythrough', canplaythroughHandler);
  });
}