Player displays loading animation over next loaded video

[danaburger]

EXPECTED BEHAVIOUR:

We currently load a video in an iframe, this does not use auto play or loop. All videos are private and protected with specified domains in the embed settings.

When the end of the video is reached the next one is automatically loaded using the player.js player.loadVideo(data.nextVideo).then(function(id) {});

The new video is loaded in but does not use auto play. This worked fine for the last couple of years, with no code changes.

ACTUAL BEHAVIOUR:

All videos still load fine on page load i.e. the initial iframe creation. They also load the next video when the end of the video is reached. However it now loads with a spinning loading icon over the top of the new video.

When I check the browser console it is showing a 500 error for the new video when loaded:

message: 'To play your video here, change its privacy settings so it can be embedded on: player.vimeo.com'

The strange thing is the video still loads and the user can press the play button, it is just you get the spinning wheel over the top of the video until you press play.

I added 'player.vimeo.com' as an embed domain option in the Vimeo admin area and this does actually stop the 500 error, but it doesn't solve the spinning icon over the top of the video.

STEPS TO REPRODUCE:

• Visit https://csp.onpld.com/learn-more
• Watch the video until the end
• Then watch the behaviour when the next video loads; visually in the Vimeo player for the spinning icon, and the browser console for the 500 error.

cc// @luwes @fisherinnovation

[luwes]

The buffer animation should definitely not be there, that's our faulty buffer tracker. But besides that it's kind of expected behavior.

player.loadVideo alone will not autoplay the video, it requires a next player.play() call or an autoplay: true param in the config object.

[tomworks]

Yes we don't want it to play automatically, just want the video to be loaded without the buffer animation persisting.

Is the stuck buffer animation a new issue or is this a long standing issue?

[luwes]

Yes, I believe it's a recent issue. We made some changes in that area. This will be resolved very soon, thanks for your patience.

[danrossi]

This is a work around

vimeoPlayer.loadVideo(1084537).then((id) => {

                    vimeoPlayer.play();

            })
}

[tomworks]

Thanks @danrossi but we don't want the video to play until the user hits the play button.

[danrossi]

What if you manually turn on autopause ? I see the buffer animation also when loading a new video and likely an issue with this missing load event I have reported on new videos as I have noticed.

I believe if they fix the metadata / loaded event the buffer animation should be fixed ?

this.vimeoPlayer.setAutopause(true).then(function(autopause) {
          // Autopause is disabled
        }).catch(function(error) {
          switch (error.name) {
            case 'UnsupportedError':
                // Autopause isn't supported by the current player or browser
                break;

            default:
                // Some other error occurred
                break;
          }
        });

[danrossi]

Check if this issue is fixed in #391

[tomworks]

Is this an update to the vimeo/player.js version? Or should it work as is? Issue still there without updating vimeo/player.js version.

[danrossi]

There is a change in the player api to properly handle metadata load events, this was broken now is working again.

[tomworks]

Ah right, currently not resolved this issue

[luwes]

@tomworks this issue is resolved. Please let me know if anything is not working as expected. Thank you.

[tomworks]

That works great now, thanks a lot.