Video not playing in Firefox

Firefox can’t play H.264 videos natively so the video player is supposed to load a Flash player to take over for the browser. But for some reason on your page the Flash player won’t play when you hit play.

It looks like there is some other JavaScript on your page that’s breaking the playback capability. There are 4 errors that pop up in the console when you load the page. It reads as “Uncaught TypeError: Cannot read property ‘length’ of undefined” in Chrome and Firefox says [11:30:53.683] TypeError: e is undefined @ https://cscmensministry.com/wp-includes/js/jquery/jquery.js?ver=1.8.3:2

There’s also an error message about Facebook:

##########################
# The endpoint used to load this resource has been deprecated.
# Please update to the current Facebook JavaScript SDK.
# https://developers.facebook.com/docs/reference/javascript/
##########################

Wow…. It seems that there is something really not working. Do you have any suggestions on what I should do? I am a newbie and would welcome any advice you can give.

I would start by selectively disabling other plugins. There’s a ton of JavaScript being generated on your pages and I assume it’s from another plugin. I hope that it isn’t from your theme because that will make things more difficult. If you can pinpoint the plugin that is causing the problem, you might be able to find a better one that gives you the same functionality. Either way you should probably find a different plugin to generate your Facebook like buttons since the one you’re using is apparently outdated.

I just ran into this same problem on one of my other websites. Some other people are running into it too. It appears to be a bug in Video.js version 4. https://github.com/videojs/video.js/issues/526

I’m going to try to fix it myself but we might have to wait for the Video.js developers to solve the problem. In the meantime, you don’t have to go through all that trouble with the plugins.

I spent some time troubleshooting with the Video.js developer today and we narrowed it down to fitVids.js which is a jQuery plugin that appears to be loaded by JW Player for the video on your sidebar. fitVids.js and the current version of Video.js do not seem to like each other.

Kyle, I read your last post and this is what I did.
1. Deleted the sidebar widget using JWPlayer.
2. Disabled the JWPlayer plugin.
3. Added the video back on the page using your plugin.
4. Reloaded the page in Firefox

And I still get the exact same thing. Nothing is working even though the video shows up. If I did something wrong please let me know. But based upon your troubleshooting I was hoping that this might work. Do you have any suggestions on what I should do next?

Thanks for your hard work in trying to figure this out. I really appreciate your effort. You are awesome.

Ron

It looks like you’re using a YouTube video on that page now. Do you have any examples of the [KGVID] shortcode still in use on your site?

Kyle, I set that page back up with the [KGVID] plugin. I took it out and used Youtube because it worked without an issue. I have now set it to where it was when you first start troubleshooting. Let me know if you need anything else.

Oh! I don’t know how I missed this before. Your theme is loading up fitVids.js at the bottom of every page. JW Player is actually disabling fitVids, which is why I thought they were related. JW Player doesn’t play nice with fitVids either. You’d have to edit your theme’s functions page to remove it.

Now that I know about this issue I’m working on a similar solution to the one the JW Player guys came up with so you wouldn’t have to edit your theme if you don’t know how. Honestly you might be happier with YouTube.

Kyle,
Having the same problem over at https://www.Marchingbandwellness.com however it only plays in some FF browsers and I do not have the fitVids.js on my site. Any ideas what might be causing the problem?

-Kyle

p.s. great name.

p.p.s thanks for an awesome plugin, it’s super easy to use.

Kyle, you’re having a different problem. Your video at https://marchingbandwellness.com/sample-video/ is encoded with the JVT/AVC video codec which is similar to but is not H.264. It happens to work in some browsers but it apparently does not work well with the Flash player. You should re-encode your video as H.264. I can actually get it to play in Firefox once the entire 104MB file downloads, but only if I load up a more recent version of jQuery. You’re loading version 1.4, which is three and a half years old. WordPress 3.5 uses jQuery v1.8.3.

Hi Kyle,

I am having a similar problem with Firefox. I have an .mp4 video that plays great using the video.js player (which I prefer) but it won’t play in firefox. I have no problems in Chrome, IE or Safari or on mobile.

When I switch the player to Strobe Media Playback it seems to work fine on Firefox but it slows way down and won’t play on my iPhone. Is there something that I am doing wrong. I thought the plugin said I could use the video.js player and it would switch automatically to the strobe player if it didn’t work. Isn’t this what’s supposed to happen in Firefox?

My site is https://katapultservices.com.

By the way, I do love the plugin. You did a fantastic job.

Thanks for your help!

Josh

You’re having the Fitvids problem. Your theme is loading Fitvids.js which as we learned earlier in this thread, breaks the Video.js player in Firefox.

I released version 4.1.5 today, which disables fitVids whenever there’s a video embedded using my plugin. Please let me know if this doesn’t solve your Firefox playback problem.

Hey, thanks for taking a look. So I updated the plugin as you suggested and it still doesn’t work. It played the sound, but without the picture. Now it just defaults back to the flash player but still won’t play in firefox.

Works great in IE, Chrome and Safari.

Thanks again for helping me out.

Josh