" _typeof is not defined" when loading m3u8 file using hls.js

Question

I am trying to load my m3u8 files that i have saved on my aws s3.
My code looks like this:

    var video = document.getElementById('video');
    var videoSrc = "https://my-file-link.m3u8";
    if (Hls.isSupported()) {
      console.log("creating");
      var hls = new Hls();
      console.log("loading");
      hls.loadSource(videoSrc);
      console.log("attaching");
      hls.attachMedia(video);
      console.log("finished");
    }
    else if (video.canPlayType('application/vnd.apple.mpegurl')) {
      video.src = videoSrc;
    }

    <div class="wrapper">
      <video id="video"></video>
    </div>

But the files are not loading, and the logs look like this:

creating
loading
attaching
finished
Uncaught ReferenceError: _typeof is not defined
    at enableLogs (...)
    at ...

If I comment out hls.attachMedia(video); the error disappears
(the files obviously don't load).
I am trying to view the video from Chrome, and my site is using npm.
I still do not have a full understanding of CORS headers, but I am guessing CORS is not the issue as the video is able to play from here.

What is causing this issue, and how can I make my video play on my site?
Is there anything else I need to share?

Answer 1

I just had to add controls to the video tag like so:

<video class="live-player" id="video" controls></video>

And it worked...
Any clue as to why? They do not seem to be adding controls in the examples here:
https://github.com/video-dev/hls.js/