TypeError: Cannot read property 'el_' of undefined

[obronov]

Description

Player throws an error when switching closed captions. Player launches HLS streams. The player is used in the Nuxt 3 environment. The problem only occurs in Chrome versions below 87.

Reduced test case

No response

Steps to reproduce

1. Use these player settings

const videoOptions = {
        autoplay: true,
        controls: false,
        loop: false,
        language: 'en',
        preload: 'auto',
        sourceOrder: true,
        errorDisplay: false,
        fluid: false,
        liveui: true,
        loadingSpinner: false,
        html5: { 
            vhs: {
                overrideNative: true,
                maxPlaylistRetries: 5,
            },
            nativeAudioTracks: false,
            nativeVideoTracks: false,
            nativeTextTracks: false,
        },
        techOrder: ['html5'],
        plugins: {},
        children: [
            'textTrackDisplay',
            'textTrackSettings'
        ]
    }

3. Start HLS stream
4. On/Off closed captions.

Errors

What version of Video.js are you using?

8.18.1, 8.23.3

Video.js plugins used.

No

What browser(s) including version(s) does this occur with?

Chrome 69

What OS(es) and version(s) does this occur with?

Tizen 5.5

[amtins]

@obronov the error comes from the fact that all components have been removed from the children list except for textTrackDisplay and textTrackSettings, which means that the controlBar component is undefined. See https://videojs.com/guides/options/#children-1

[obronov]

@amtins I use my own controlbar.

How to solve the problem if I don't use VideoJs controlBar?

[amtins]

If you don't use videojs controlBar then the property controlBarHeight should point to the height returned by your control bar. At least that's what I understand from your code.

[obronov]

If you don't use videojs controlBar then the property controlBarHeight should point to the height returned by your control bar. At least that's what I understand from your code.

@amtins "updateDisplay()" is a function in "videojs". Can I quickly fix this or should I contribute to the videojs code?