search

ampproject / amphtml

The AMP web component framework.
https://amp.dev
Apache License 2.0
14.89k stars 3.89k forks source link

amp-brightcove should not be able to dock when autoplaying #32706

Open alanorozco opened 3 years ago

alanorozco commented 3 years ago

⚠️ 2021/03/10: dock has been disabled on <amp-brightcove> elements.

The vendor should update the player documents loaded by AMP so that they don't autoplay without user interaction, at which point dock can be re-enabled.

An autoplaying video can only be docked after a user interacts with it by clicking.

That's not the case on the <amp-brightcove> video on this document. Investigating.

alanorozco commented 3 years ago

cc @mister-ben

alanorozco commented 3 years ago

Video inside an <amp-brightcove> element's iframe may autoplay without the autoplay attribute. Isolated example here.

<amp-brightcove
  dock
  data-account="5036649783001"
  data-block-on-consent
  data-param-descurl="https://sport.virgilio.it/la-procura-apre-nuovo-caso-tifosi-juve-e-caccia-alle-streghe-675112/amp/"
  data-param-iu="/5180/virgilio/sport/amp/video"
  data-param-muted="muted"
  data-player="BJfO4tbswM"
  data-video-id="6170165728001"
  data-param-playsinline
  height="270"
  layout="responsive"
  width="480"
></amp-brightcove>

Since the AMP host gets a playing event anyway, it assumes manual playback.

https://github.com/ampproject/amphtml/blob/4ebe517fe6dbb2038298bbecae3e715576610be0/src/service/video-manager-impl.js#L967-L975

amp-video-docking then allows the video to dock, even though the user has not clicked on it. This should not happen.

Workaround

The ideal solution is that the document loaded on Brightcove's end does not autoplay unless allowed by the <amp-brightcove> element, possibly by a query param.

If this solution is not implemented on Brightcove's end, we'll mitigate it on AMP's side with one of the workarounds below.

Input from @mister-ben would be appreciated, since we would like to ensure the player works consistently.

A. Hide, pause, show

Force a video without autoplay to start on paused state:

  1. Hide video
  2. Delay layoutCallback until a playing event is received or times out.
  3. Pause and show video.

(I'm leaning towards this option, working change #32714)

B. Click-to-play

On layoutCallback, delay creating the iframe until element is clicked, at which point it will be unmuted and played. The visible state on click-to-play is the [placeholder] element.

B. PLAYING_AUTO without autoplay

Since we can't currently determine whether a play event occurs by user interaction if the element lacks an autoplay attribute, we always treat amp-brightcove:not([autoplay]) as PLAYING_AUTO. This means that the video cannot dock if it lacks the autoplay attribute.

mister-ben commented 3 years ago

Looking into this. We could disable the player's internal autoplay setting. I don't think delaying the load of all non muted players is reasonable.

32714 has the effect of making the amp-brightcove that does have the autoplay attribute at examples/brightcove.amp.html require a click to show the play button and another to play.

alanorozco commented 3 years ago

We could disable the player's internal autoplay setting.

That would be great. Please let me know.

alanorozco commented 3 years ago

@mister-ben Hi. Has this been looked at?