hls.js in react application

[hasanrabiee]

What do you want to do with Hls.js?

Currently, I'm using hls js in my react application, but I'm having trouble getting levels and qualities from the manifest Actually, Hls.Events.MANIFEST_PARSED does not fire in Android browsers. On PC, it works fine; however, this issue only occurs in Android browsers. this is part of my code .

 const newHls = new Hls({
                enableWorker: false,
                ...hlsConfig,
            });

newHls.once(Hls.Events.MANIFEST_PARSED, (event, data) => {
                if (autoPlay) {
                    setIsPlaying(true)
                    playerRef?.current
                        ?.play()
                        .catch((e: any) => {
                                console.log(e)
                                setIsPlaying(false)
                            }

            });

What have you tried so far?

No response

[robwalch]

Hi @hasanrabiee,

Can you provide more information about the Android browsers you are testing in? Which Android device(s), OS version(s), and browser name and version(s) are you seeing this issue in?

[hasanrabiee]

Hi @robwalch yes sure . Currently, I'm testing on a Galaxy Tab A7 with Android version 12 and Google Chrome version 108.0.5359.128.

[robwalch]

Tested on Pixel 6 Android 12 with Chrome 102. The N quality levels found demo page message comes from the MANIFEST_PARSED event. It works using hls.on or hls.once.

Please try debugging through your application issue with pause on caught exceptions enabled to pinpoint the issue. There is no platform specific reason for this event to not fire.