title: 'AbortError: The operation was aborted.' - Error when adjusting HTML 5 video.currentTime in Firefox
body: <p>When using Firefox and changing the position of a video using HTML5 video. Does anyone have insight to what causes this? </p>
  
  <p>Here are my ideas:</p>
  
  <ol>
  <li>Setting it to a time value that has no corresponding frame -  I have attempted to always set it to a time where a frame exists to counter this</li>
  <li>The video frame does not load by the time the next frame is asked for - in order to test this I have set the timeout to 5 ms, this definitely drops the amount of errors so that is some evidence that this is the source of the error. </li>
  </ol>
  
  <p>I have made slider that adjusts video time that replicates the error:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var vid = $('#v0')[0];
  var slider = document.getElementById('vidSlider')
  linkVideoToSlider();
  
  vid.onplay = vid.onclick = function() {
    vid.onplay = vid.onclick = null;
  
    setTimeout(function() {
      vid.pause();
      slider.value = vid.currentTime / vid.duration * 100
      vid.currentTime += (1 / 29.97);
  
    }, 12000);
  
    setInterval(function() {
      $('#time').html((vid.currentTime * 29.97).toPrecision(5));
      slider.value = vid.currentTime / vid.duration * slider.max;
    }, 100);
  };
  
  function linkVideoToSlider() {
    var adjustVideoTime = function() {
      //Note that we attempt to adjust to a time that has a frame.
      setTimeout(function() {
        vid.currentTime = Number.parseFloat(slider.value / 29.97).toFixed(4);
      }, 5);
    }
    slider.oninput = adjustVideoTime
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"&gt;&lt;/script&gt;
  Frame number:
  &lt;p id="time"&gt;&lt;/p&gt;
  &lt;video id="v0" controls tabindex="0" autobuffer preload&gt;
      &lt;source type="video/webm; codecs=&amp;quot;vp8, vorbis&amp;quot;" src="http://www.html5rocks.com/tutorials/video/basics/Chrome_ImF.webm"&gt;&lt;/source&gt;
      &lt;source type="video/ogg; codecs=&amp;quot;theora, vorbis&amp;quot;" src="http://www.html5rocks.com/tutorials/video/basics/Chrome_ImF.ogv"&gt;&lt;/source&gt;
      &lt;source type="video/mp4; codecs=&amp;quot;avc1.42E01E, mp4a.40.2&amp;quot;" src="http://www.html5rocks.com/tutorials/video/basics/Chrome_ImF.mp4"&gt;&lt;/source&gt;
      &lt;p&gt;Sorry, your browser does not support the &amp;lt;video&amp;gt; element.&lt;/p&gt;
  &lt;/video&gt;
  &lt;div class="slidecontainer"&gt;
    &lt;p&gt;Time of video slider:&lt;/p&gt;
    &lt;input type="range" min="0" max="1024" value="0" class="slider" id="vidSlider"&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>if you prefer JSFiddle:
  <a href="https://jsfiddle.net/tehsurfer/9ahz5rmd/52/" rel="noreferrer">https://jsfiddle.net/tehsurfer/9ahz5rmd/52/</a></p>