JSFiddle - React, Tailwind, and code Playground

by boushley

HTML

<div id="output">

</div>

<video src="http://hboespana-uat-vod.dash.adaptive.level3.net/pp/f0b3-00004f70aec//HBOE-AAAMX-000-PGM-01-01-2500-HD-169-SR-1920x1080-500-134129/HBOE-AAAMX-000-PGM-01-01-2500-HD-169-SR-1920x1080-500-134129.m3u8" autoplay></video>

JavaScript

var video = document.querySelector('video')
var output = document.querySelector('#output')

log('Starting up')

video.addEventListener('webkitneedkey', function () {
  log('Need Key Event - If this is after pause and after tab switch wait for about 15 seconds to see the error')
})

video.addEventListener('error', function () {
	console.log('Got an error:', video.error)
  log('Got an error: ' + video.error.code)
})

setTimeout(function () {
	video.pause();
  log('pausing - open another tab and come back here, that triggers a need key event')
  }, 6000)


function log(message) {
	var el = document.createElement('p')
  el.innerText = message
  output.appendChild(el)
}