hidden captions textTrack not triggering "cuechange" events

[ghost]

Description

When setting a 'captions' text track to 'hidden' mode and adding a cuechange event, the events are not being fired.

Steps to reproduce

1. set the captions track to hidden
2. add cuechange event listener
3. send some cue events

Results

Expected

cuechange event triggered with the data

Actual

event is not being triggered, but works when setting the track mode to 'showing'

Error output

no error output

Additional Information

versions

videojs

7.11

browsers

Chrome Latest

OSes

OSX

[gkatsev]

Can you provide a reduced test case? Just tried the following and it's working for me.

var player = videojs('myplayer');
player.on('loadedmetadata', function() {
  var track = player.textTracks()[0];
  track.on('cuechange', (e) => console.log(track.activeCues));
  track.mode = 'hidden';
});

[sgrogov]

Hello,

I've got the same problem.
Here is reduced test case https://github.com/sgrogov/bug-cases/tree/master/videojs/mode-hidden-cuechange.

My code is pretty similar to yours

player.on('loadedmetadata', function() {
	const trackElement = p.addRemoteTextTrack({src: 'captions.vtt'}, false);
	trackElement.addEventListener('load', function() {
		const track = this.track;
		track.addEventListener('cuechange', printActiveCuesContent);
		track.mode = 'hidden';
	});
});

but cuechange callback is never fired.

I tried your code but it threw an error because the track variable is undefined.

[ghost]

@gkatsev sorry for my late reply, your code works but only with the metadata track, which is not what i'm looking for, i'm pushing a subtitles track in a live event and that's the one i need to work on, when i try to add the listener to it nothing gets triggered, it works perfectly if i manually select the CC track from the button, the problem is that i want to render it somewhere else and not on the player so i need it to be hidden or to hide it in another way (on both mobile and desktop clients of course)

here's a test case:

player.on('loadedmetadata', function() {
    var track = player.textTracks()[1];
    track.on('cuechange', (e) => console.log(track.activeCues));
    track.mode = 'hidden';
});

[gkatsev]

OH, I see. Also, I realize what the issue is now. If you set the mode to showing and then hidden programmatically or not, it'll work.
Looks like when the mode is changed, we only enable the updates if it's being set to showing. Why? I'm not sure, probably something silly:

video.js/src/js/tracks/text-track.js

Lines 229 to 234 in 74bbc5d

	if (mode === 'showing') {
	this.tech_.ready(() => {
	this.tech_.on('timeupdate', timeupdateHandler);
	}, true);
	}

We probably want to update that line to look more like this one:

video.js/src/js/tracks/text-track.js

Lines 188 to 192 in 74bbc5d

	if (mode !== 'disabled') {
	this.tech_.ready(() => {
	this.tech_.on('timeupdate', timeupdateHandler);
	}, true);
	}

Would you be interested in making a PR for that?

[gkatsev]

Actually, even worse, looks like we never disable the timer once set. I'll make the PR since there's more going on there.

[ghost]

@gkatsev thanks so much, will test ASAP and get back to you

[gkatsev]

@kalieye it's out now in 7.2.5, let us know if you still have issues.

[ghost]

@gkatsev i updated and i can confirm that the issue is now fixed, thank you!

[gkatsev]

You're welcome. Thanks for checking back in!