Player not showing only with Android/Chrome and 3G/4G connections

[Joan-Rojo1]

Hi there,

I am facing an extremely rare issue. The player is not being displayed when using Android/Chrome and 3G/4G connections, with Wifi everything is ok. I have tried to debug it, but I am not getting any message on console. Here it is an example URL:

http://prem.publico.es/publicotv/577486/la-ola-de-incendios-en-galicia-hace-sospechar-que-son-intencionados

I dont know if any has faced this problem, but every help would be appreciated.

Thanks in advance,

Note: we use video.js 5.9.2 we use plugins for ads such as video.ima.js and video.ads.js, for example.

[mister-ben]

Can you reduce that down to a minimal test case?

[Joan-Rojo1]

Hi Ben,

Even you don't have to use your cell and mobile data to reproduce it. It's enough to use Chrome with developer tools and set throttling to any XG connection vs Wifi to see the difference. I can't find any difference in DOM. Here are 2 captures reproducing the problem:

http://oi66.tinypic.com/2wgf8n6.jpg

http://oi68.tinypic.com/apgzg6.jpg

Thanks a lot for answering,

[misteroneill]

I tried all the way down to "Good 2G" and I saw a video player to appear and playback start. Granted, I had to wait almost 2 minutes for the ~700 requests and 5MB of data to finish. 😆

The reason Ben asked about a reduced test case is that without one there is simply too much going on here to narrow a problem down to video.js specifically. There are too many factors at play that could be affecting your player to say that there's a bug in video.js.

[brandonocasey]

here is the starter template for generating a reduced test case http://jsbin.com/axedog/edit?html,output

[Joan-Rojo1]

Hi there, thanks a lot for your time and test. I will prepare a minimal test as you suggest and let you know next week. Have a nice weekend :)

[mister-ben]

I believe the issue here is using fluid mode with preload disabled, when no other size information is available. The aspect ratio can't be detected and the intended default 16:9 isn't being used.

You're seeing this only on cellular because the browser forces preload to none on a cellular connection, but allows preload on wifi.

I think I have a fix, but you can work around it in the meantime by setting a width on the player, e.g. width="100%" or including an aspect ratio in the settings {"aspectRatio": "16:9"}.

[Joan-Rojo1]

Hi Ben,

This morning I've been testing in that way and I was getting that if I set width and height explicitly in the video tag the player was being showed, but I was losing responsiveness.

You are right, in Android+mobile data+Chrome last versions the preload feature acts like set to none and the player doesn't know his aspect ratio. I have added in the settings {"aspectRatio": "16:9"} as you suggested and It's working now keeping responsiveness ok. You can see it in the URL that I posted first.

This is something that must be took into account and I didn't find any info about it on web.

Thanks a lot for your support and time. I hope this to be useful for others in the future,
Best