How to refresh TextTrack after removeCue() function

Question

After removing a cue it seems to be removed from the cues list but still displays within the html5 video. Is there a way to refresh the textTrack after removing one? I am able to add additional cues but not remove them.

var video = document.getElementById("vid1");
var track = video.textTracks[0];
track.mode = "showing";

var cue = new TextTrackCue(1.121,3.121,"test1");
cue.id = "cue1";
track.addCue(cue);

//some time later
track.removeCue(track.cues.getCueById(cue.id));

Edit: Internet Explorer browser, I'm able to use VTTCue's with other browsers and those remove with no issues.

Edit2: Upon further investigation I found that this is happening if the cue that I want to remove is active at the time that I am removing it. When that is the case, it seems to remove from the cues list but never stop displaying from the video. I am now thinking a possible solution is to force seek a different time in the video then remove, then seek back to the previous position. Does anyone know if there's a way to hide the caption first before I remove it to avoid having to seek?

Answer 1

I noticed there is a "mode" property of tracks which can be set to 0=disabled, 1=hidden, 2=showing. I found setting the mode to hidden on the line before removing a cue solves the problem.

track.mode = 'hidden';
removeCue(track.cues.getCueById(cue.id));
track.mode = 'showing';