Getting the player has been destroyed error while playing the next content

I’m getting this below error whenever I’m playing the next content with DRM setup
“Cannot use the player.isCasting API: the player has already been destroyed.”

Before playing next content I’m calling the functions below

const videoElement = document.getElementById('bitmovinplayer-video-player')
    videoElement && videoElement.remove()
    player?.unload()
    player?.destroy()
    setPlayer(null)

After that I’m calling below setup

 const playerInstance = new Player(playerDiv?.current, playerConfig)
.....
.....
....
setPlayer(playerInstance)

@priyadharshan.b You don’t have to manually remove the video element or unload the player. When player.destroy() is called, the player handles these actions internally. You can simply destroy the player, wait for the callback, and then start loading the next source.

Here is the sample code:

 player.destroy().then(() => {
          loadSource(nextsource);
        })

I am also getting the same error every now and then when my player unmounts in my React application.

I have an almost identical copy of your “bitmovin-player-react” repository’s code from the file BitmovinPlayer.tsx. I am using a more complex UI build with UIManager though.

I am calling the destroyPlayer function accordingly. Player instantly disappears from the DOM, and a short file after this error appears:

_0x13B2C "API_NOT_AVAILABLE": "Cannot use the `player.isCasting` API: the player has already been destroyed."

Digging deeper into the error stack, it appears to come from bitmovin-player-ui module. More specifically from uicontainer.ts file’s hideUi method.

Any tips or ideas how I could avoid this error?

Thank you in advance!

Hi @teo.raunio,

This sounds like the UI is trying to access the player. Are you calling uiManager.release() (where uiManager is your instance of the UIManager) before calling player.destroy()? If not, please try this and let me know if this resolves the problem.

Hi,

That was it. Thank you for the quick reply!

I was not doing the release() properly.

I’ve now added it to the copy of your React example by returning the uiManager instance from the initializePlayerUi function and passing it to destroyPlayer when the component unmounts.

By the way, shouldn’t it be included in your example too in case customUi is used?