0

Has anyone else run into compatibility issues when using MediaElement and jQuery Tools on the same page?

Firefox crashes whenever I have both libraries included on a page and I call $('video').mediaelementplayer(); If I remove the reference to jQuery Tools, the page loads perfectly, and if I remove the call to mediaelementplayer(), the page loads perfectly.

No exceptions are thrown. The entire browser just locks up and will not respond. I have recreated this problem on both Mac and Windows machines.

Here's a test page: http://thewellcommunity.org/firefox-crash.htm

I have upgraded to the latest versions of jQuery, jQuery Tools and MediaElement. The crash existed before I upgraded each of those libraries. The only difference is that when I had version 1.2.5 of jQuery Tools, the crash was less severe, only happened occasionally, and seemed to be limited to Macs. Firefox would lock up for a short time, but then would eventually become stable again. As soon as I updated to 1.2.7, the crash started happening every time and could not be recovered from.

The live home page of our site is still using jQuery Tools 1.2.5, so the original crash can be seen there... http://thewellcommunity.org

Does anyone have any idea what might be happening? Or do you know how I might debug this. I've tried try-catch blocks, but the browser crashes before the catch can happen.

Jargs
  • 675
  • 3
  • 10
  • 22
  • Wow... that's horrific but it's not a Firefox issue... locked up my Safari too... I couldn't even get the console open. – Sparky Apr 25 '12 at 19:24
  • Ugh! Thanks for letting me know. I'm assuming you're using Safari on a Mac, right? I just tried it in Safari for Windows, and froze up for a while, but after loading for about a minute, it eventually worked. – Jargs Apr 25 '12 at 19:40
  • Safari on a _slow_ Mac but still, I usually don't see it lock it up that bad. – Sparky Apr 25 '12 at 19:43
  • I'm not a big fan of jQuery Tools... actually I have a very low opinion of it overall. Everything works when you deactivate that? – Sparky Apr 25 '12 at 19:44
  • You should be able pull up the developer tools in Safari Windows and look at the timeline for the page loading and see which script is the real problem. – Sparky Apr 25 '12 at 19:58
  • I'm not a big fan of jQuery Tools either... initially I really liked it and used it for several features, but I've been slowly moving away from it. Now I'm only using it for it's tab slideshow feature. When I have time, I'll probably move away from that as well. – Jargs Apr 25 '12 at 21:19

1 Answers1

1

I found the problem! It appears that the tabs in jQuery Tools and the volume slider in MediaElement don't play nicely together.

I was finally able to get Firefox to load the page enough to the point where it told me that a script was taking a long time. I checked the firebug debug window and it was stuck on changing the visibility of the volume slider for the MediaElement player.

I went into my initialization code and disabled the volume slider and suddenly the entire page works perfectly.

Definitely not an ideal solution, but I'm willing to live with it for now, at least until I have time to find a different HTML5 video player or get rid of jQuery Tools completely.

Thanks to @Sparky672 for your help!

Jargs
  • 675
  • 3
  • 10
  • 22
  • Haha thanks... yeah not only did I have to wait to post my answer, but then I had to wait to mark it as the correct answer. Ugh... I need some more rep. ;) – Jargs Apr 30 '12 at 21:28