Open bchah opened 1 month ago
Hi @bchah . Does this happen in situations like this test code?
If only the background color is visible, will the player be unable to load the thumbnail forever?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Thumbnail Test</title>
<style>
#player {
width: 100%;
}
</style>
</head>
<body>
<div id="player"></div>
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
<script src="https://cdn.jsdelivr.net/npm/ovenplayer@0.10.35/dist/ovenplayer.min.js"></script>
<script>
const player = OvenPlayer.create('player', {
image: 'https://picsum.photos/720/480',
sources: [
{
type: 'hls',
file: 'https://llhls-demo.ovenmediaengine.com/app/stream/llhls.m3u8'
},
]
});
</script>
</body>
</html>
@SangwonOh I was able to periodically reproduce this problem with these options: autoStart TRUE, mute FALSE, showBigPlayButton FALSE and a WebRTC source that is offline.
It's not critical for now and I can't give you the exact steps to reproduce it, I just often see the background color of the player with no image while loading, even though an 'image' is specified for the background.
I notice that when creating an instance of OvenPlayer and setting the 'image' option to a URL which fetches an image from an API, on many occasions OvenPlayer will only show the background color, not the image. In a few random tests it behaves as though there's some sort of race condition or synchronous callback that is preventing OP from waiting for the image to load and failing over to just showing the background color.
Has anybody else noticed this? If so, my workaround was to set the poster on the video player manually after OP is ready, e.g.