Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Autoplay detection library: initial release && Teads Bid Adapter: detect autoplay #11222

Merged
merged 5 commits into from
Mar 20, 2024

Conversation

github-matthieu-wipliez
Copy link
Contributor

@github-matthieu-wipliez github-matthieu-wipliez commented Mar 15, 2024

Type of change

  • Bugfix

  • Feature

  • New bidder adapter

  • Code style update (formatting, local variables)

  • Refactoring (no functional changes, no api changes)

  • Build related changes

  • CI related changes

  • Does this change affect user-facing APIs or examples documented on http://prebid.org?

  • Other

Description of change

This PR adds an autoplay detection library, and updates the Teads adapter to use this feature to filter out bid responses containing ads that require autoplay when autoplay is not enabled on the browser.

The autoplay detection library works by attempting to play a 1-frame, 1 second video of a 160x90 pixels black image without sound, encoded with ffmpeg as H.264 wrapped in an MP4. I reduced its size by stripping the unneeded encoder details. The play() promise fails immediately when the OS does not allow autoplay, but when autoplay is allowed the promise does not necessarily resolve right away, hence the choice to consider that autoplay is enabled by default unless it has been explicitly forbidden. Note that the video does not need to be in the DOM for this to work, which makes this easier. We have tested this in production on our side.

For context see preliminary discussion on Slack: https://prebid.slack.com/archives/C7TLBVAH3/p1709305698637079

Other information

Copy link
Contributor

@github-tom-kuhnen github-tom-kuhnen left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM 👌

// followed by:
// echo "data:video/mp4;base64,$(base64 -i autoplay.mp4)"

const autoplayVideoUrl =
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

much happier this worked than sourcing an external file

@patmmccann patmmccann changed the title Add autoplay detection library and use it in Teads bid adapter Autoplay detection library: initial release && Teads Bid Adapter: detect autoplay Mar 15, 2024
@patmmccann patmmccann added feature needs 2nd review Core module updates require two approvals from the core team labels Mar 15, 2024
@patmmccann patmmccann requested a review from karimMourra March 15, 2024 16:16
Copy link
Collaborator

@karimMourra karimMourra left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think startDetection can be called in the library .
This is great stuff!


/**
* @typedef {import('../src/adapters/bidderFactory.js').BidRequest} BidRequest
* @typedef {import('../src/adapters/bidderFactory.js').Bid} Bid
*/

// start autoplay detection as soon as Prebid is loading
startDetection();
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why not call this in autoplay.js ? Every module using this library will need to do it, so might as well do it in the library. I can't think of a case where a module would want to delay this

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes good point, this makes sense since libraries are not included by default, so the detection will only run if a module includes it. I'll make the change!

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

By doing that, we can also remove the detectionInProgress logic, since the code is executed once when the module is initialized.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done in ed3427c

@patmmccann patmmccann merged commit 075abb7 into prebid:master Mar 20, 2024
3 checks passed
dgirardi pushed a commit to dgirardi/Prebid.js that referenced this pull request Mar 20, 2024
…ect autoplay (prebid#11222)

* Add autoplay library

* Filter out bids with needAutoplay if autoplay is disabled

* Refactoring + add test

* Simplify logic for filtering bids

* Start detection in autoplay.js directly
@aanton
Copy link

aanton commented May 7, 2024

Hi @github-matthieu-wipliez @karimMourra @patmmccann.

We have detected a problem in an iOS APP using webviews that includes a Prebid file with the Teads adapter (that includes the autoplay library which startDetection function runs as soon as possible). A fullscreen black 1s videoplayer is displayed (hiding the content) and the user must click on it and close it to display the page content.

It seems the webview opens this 1s videoplayer on fullscreen automatically.

Any ideas or suggestions about this issue?

Thanks!
Armando

@github-matthieu-wipliez
Copy link
Contributor Author

Hi @github-matthieu-wipliez @karimMourra @patmmccann.

We have detected a problem in an iOS APP using webviews that includes a Prebid file with the Teads adapter (that includes the autoplay library which startDetection function runs as soon as possible). A fullscreen black 1s videoplayer is displayed (hiding the content) and the user must click on it and close it to display the page content.

It seems the webview opens this 1s videoplayer on fullscreen automatically.

Any ideas or suggestions about this issue?

Thanks! Armando

Hi @aanton

yes you should allow inline media playback, see this issue for details: #11438

Thanks,
Matthieu

@aanton
Copy link

aanton commented May 7, 2024

Thanks @github-matthieu-wipliez!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature needs 2nd review Core module updates require two approvals from the core team video
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants