Controlling YouTube video playback is broken

[dematerializer]

Current Behavior

Controlling YouTube video playback is broken.

Expected Behavior

YouTube video playback should be controllable.

Steps to Reproduce

1. go to https://cookpete.com/react-player/ using Google Chrome 85.0.4183.102
2. select YouTube Test A
3. notice video starting automatic playback
4. click on Pause does not pause the video (no console output)
5. click on Play again gives console output "ReactPlayer: YouTube player could not call playVideo – The method was not available"
6. changing the volume gives console output "ReactPlayer: YouTube player could not call setVolume – The method was not available"

Environment

• URL attempting to play: builtin YouTube Test A video URL
• Browser: Google Chrome 85.0.4183.102
• Operating system: Mac OS X 10.14.5
• jsFiddle example: not needed

Other Information

• /

[cookpete]

Working fine for me on Chrome 85.0.4183.102.

Are you using any extensions or something that might be interfering?

[dematerializer]

This is so strange:

1. I deactivated all browser extensions.
2. I experience the problem while being logged into google chrome with my google account
3. when I switch to the Guest account or incognito mode everything is fine
4. switching back to my google account makes the problem come back again
5. then, just by chance, I went to youtube.com itself, noticing I'm being logged into youtube automatically by the chrome browser
6. then I went back to your demo page seeing that the problem is gone
7. trying to reproduce the issue, I log out of google chrome
8. visiting the demo page brings back the playback problem
9. logging back in into google chrome and visiting the demo page the problem is still there
10. briefly visiting youtube.com and then the demo page makes the problem go away again
11. full circle

[dematerializer]

I wonder if this might have something to do with the YouTube API, GDPR compliancy and the fact that i live in Germany.

[mcapkovic]

I had the same problem today (no play, pause, seekTo, getCurrentTime...) on chrome 85.0.4183.102 and os x 10.15.6. Chrome "Clear browsing data" fixed the issue in my case.

[aaronkchsu]

Hey, we are getting this too for specific computers, but not for other computers haha. Super weird. But boiled it down to the video loads but onReady is never called! -> We live in the U.S

[aaronkchsu]

Let me know if this helps but same computers different browsers work
We've seen controlling events broken for firefox, and chrome

For the cases that are broken we have only seen it happen for youtube and we verify it here to make sure it's not an environment specific problem https://cookpete.com/react-player/

[aaronkchsu]

We have also seen incognito sometimes solve the problem on firefox!

[cookpete]

Can someone who experiences this problem confirm if the same thing happens when using the iFrame Player API directly?

https://developers.google.com/youtube/iframe_api_reference#Getting_Started

In other words – is this something is specifically wrong with ReactPlayer's implementation, or is this actually a problem with the YouTube Player API on certain browsers? If it's the latter then I don't see what can be done in this library.

[loolooii]

This issue is closed, but if someone has this problem (like I did), it was for me https://poperblocker.com/ that caused it.

[keyfoe]

Btw if someone by chance bumps into this...
Seems like something like OneTrust Cookies Consent Notice script is blocking other scripts to execute so if you have something like that in your page then make sure to "consent" and see if you can play the video. Or just remove the cookie consent script and check if that helps.
Would have saved an hour of time if I knew this beforehand...