Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
Tech breaks other video.js players on same page
See original GitHub issueIssue Description
The WavesurferTech breaks video.js when there are multiple players present on a page. I suggest we remove it and add an option that programatically enables them (so it also works in safari).
It’s already possible to query the tracks at startup of the plugin:
var tracks = player.textTracks();
console.log('tracks', tracks);
0: e {tech_: e, cues_: Array(2), activeCues_: Array(0), src: "media/hal.vtt", ..
Related issue in project that uses this plugin as dependency: https://github.com/collab-project/videojs-record/issues/235
Here’s an example of how to break it using 2 instances: clicking the progress bar doesn’t work on the 2nd video.js player with a random mp4 file:
diff --git a/examples/index.html b/examples/index.html
index fc08e44..89d2ea4 100644
--- a/examples/index.html
+++ b/examples/index.html
@@ -24,6 +24,8 @@
<audio id="myAudio" class="video-js vjs-default-skin"></audio>
+<video id="myVideo" class="video-js vjs-default-skin"></video>
+
<script>
var player = videojs('myAudio', {
controls: true,
@@ -53,6 +55,16 @@ var player = videojs('myAudio', {
player.on('error', function(error) {
console.warn('ERROR:', error);
});
+
+var player2 = videojs("myVideo", {
+ controls: true,
+ autoplay: false
+}, function() {
+ console.log('second player ready');
+});
+// load example MP4 at startup
+player2.src('big_buck_bunny.mp4');
+
</script>
</body>
Issue Analytics
- State:
- Created 5 years ago
- Comments:12 (12 by maintainers)
Top Results From Across the Web
Top Related Medium Post
Top Related StackOverflow Question
Troubleshoot Live Code
Top Related Reddit Thread
Top Related Hackernoon Post
Top Related Tweet
Top Related Dev.to Post
Top Related Hashnode Post
I agree it’s non-intuitive but this plugin does not run without any javascript setup (atm) and I’d like to keep the actual metadata in the
audiotag to a minimum, and specify it using the player config.AFAIK it’s not possible to specify a
srcof anaudioelement and use that to render the waveform anyway. so defining the track metadata there is confusing to me because you still define a ‘src’ on the player config, so why not define the texttracks there as well?Not being able to specify a
srcof anaudioelement is something from video.js 4.0 times (when this plugin was created), when it was not possible, or really hard, to override or interact with thatsrcattribute, so I went the all-in javascript route with this plugin. It might be easier today though (with techs etc).I encourage compatibility with the
srcof audio elements of course, the simpler the better, and I think this tech might be the way to go, but it cannot interfere with other video.js players as it’s doing now.As long as it works on Safari, with other players, etc, I’m happy 😉
I created #65 and managed to get the text track example work without any other modifications (so both using a
<track>element and the dynamic video.jstracksoption). The tech was removed because it breaks the player (and introduced high CPU, see #63). We can introduce the tech again if:videojs.registerTechthe custom tech in safari)I think it also doesn’t make sense to try to make text tracks work in Safari, when an even bigger and more important issue (actual normal playback on Safari, see #47) has to be solved before adding other features.
I will open a new ticket for Safari text track support (which will be blocked by #47 but perhaps that also fixes it) and optimize #65 a little more. It’s unfortunate to have to rip out code now but a half-baked solution that resulted in large issues with other plugins and browsers is a bigger problem IMO and it’s hard to move forward this way.