Catching invalid source error using videojs

Question

I am loading an invalid source into videojs player instance like this:

player.src({
    src: 'http://example.com/invalid',
    type: 'audio/mp4',
});

Then I try to catch the occurring error as follows:

player.on('error', () => {
    console.log(player.error); //Gives MEDIA_ERR_SRC_NOT_SUPPORTED error
})

which gives me the error thrown internally by videojs, but not the error that caused it. In my application, I am consuming an API that throws specific error code if you are trying to load a source that you are not supposed to. How could I catch such an error.

I would like to catch the first error in the screenshot below:

Answer 1

I would like to catch the first error in the screenshot below:

You can't. It is invoked when src attribute element in video element changes.

However you can listen to it.

const playerElement = document.querySelector("#player")

playerElement.addEventListener("error", (event) => {
  console.log(event.target.error.message);
})

const player = videojs('player');

player.src({
    src: 'http://example.com/invalid',
    type: 'audio/mp4',
});

<script src="https://vjs.zencdn.net/7.7.6/video.js"></script>
<video id="player" ></video>