YouTube embedded video inside Chrome extension page appears as back rectangle in Chrome 56

Question

Problem:

YouTube embedded video inside Chrome extension page appears as back rectangle in Chrome 56. How can we fix it?

Demo extension:

https://github.com/terales/youtube-not-play-in-extension-in-crome-v56

How to reproduce:

1. Load unpacked extension in chrome://extensions/
2. Open new tab
3. Video won't load, check developer tools for logged requests

Request displays as cancelled in Network tab:

But there is no problems if we look at request with WebRequest API:

Code for embedding:

<iframe width="853" height="480"
    src="https://www.youtube.com/embed/dm57RF1l0Cs?rel=0&showinfo=0" 
    frameborder="0" allowfullscreen></iframe>

Manifest:

{
  "name": "Youtube won't play embeded videos in crome-extension [Demo]",
  "version": "1.0.0",
  "manifest_version": 2,
  "description": "Demo for encountered problem with cancelled request",
  "chrome_url_overrides": {
    "newtab": "newtab.html"
  },
  "permissions": [
    "webRequest",
    "<all_urls>"
  ],
  "content_security_policy": "default-src 'self' https://s.ytimg.com; frame-src https://www.youtube.com;"
}

Checked:

• content security policy — should be ok, worked fine month ago
• disabled all other extensions — checked on empty chrome v56 profile
• sharing url is from Share → Embed text box from youtube
• video is loading and playing without any problems even if running from local html file
• documentation for extension don't have any info about restricting iframes inside extension pages
• protocol explicitly defined, so it isn't an error with a protocol-relative URL
• build iframe with API — the same result

Chrome versions:

• 56.0.2924.87 (64-bit) — won't play a video, request displayed as cancelled,
• 59.0.3035.0 canary (64-bit) — will play a video, but request displayed as cancelled

Chromium:

• 59.0.3036.0 (Developer Build) (32-bit) — will play a video, but request displayed as cancelled

Answer 1

Update from Chromium Dev:

This is probably not a fix that we would do a stable push for, so you'll have to wait until 57 becomes stable (which should be soon).

Source of the error

Found in net-internal error:

error_204
Unknown error
Error: Failed to construct 'IntersectionObserver': Unable to get root node in main frame to track.
    at new AZ (https://www.youtube.com/yts/jsbin/player-en_US-vflg9Wu9U/base.js:3691:122)
    at new V1 (https://www.youtube.com/yts/jsbin/player-en_US-vflg9Wu9U/base.js:3972:112)
    at V1.create (https://www.youtube.com/yts/jsbin/player-en_US-vflg9Wu9U/base.js:6964:333)
    at Bh.<anonymous> (https://www.youtube.com/yts/jsbin/www-embed-player-vflzkmSYc/www-embed-player.js:431:269)
    at Bh.k.mb (https://www.youtube.com/yts/jsbin/www-embed-player-vflzkmSYc/www-embed-player.js:431:308)
    at Fh (https://www.youtube.com/yts/jsbin/www-embed-player-vflzkmSYc/www-embed-player.js:429:143)
    at Bh.k.qa (https://www.youtube.com/yts/jsbin/www-embed-player-vflzkmSYc/www-embed-player.js:422:176)
    at https://www.youtube.com/yts/jsbin/www-embed-player-vflzkmSYc/www-embed-player.js:464:420
    at https://www.youtube.com/yts/jsbin/www-embed-player-vflzkmSYc/www-embed-player.js:69:63
line=Not available
level=ERROR

There is already closed question about this error: IntersectionObserver Error when embedding a YouTube video in an iframe

There is an issue submitted to the Chrome team: https://bugs.chromium.org/p/chromium/issues/detail?id=698545

We can't do anything now, waiting for reply.