1515289 - Full Screen option in Youtube context menu is not working

Status: VERIFIED FIXED

(Web Compatibility :: Site Reports, defect, P3)

Description

[Timea Cernea [:tbabos][inactive]]

Attachment: Browser Console

[Affected versions]
66.0a1 (2018-12-18)
65.0b5 (64-bit)
64.0 (64-bit)

[Affected platforms]
Ubuntu 16.04 x32, Windows 8/10, Mac OS 10.14

[Steps to reproduce]
1. Open Firefox with a new profile
2. Go to Youtube.com
3. Open any video
4. Double right click to reach the context menu
5. Click on Full Screen option

[Expected result]
The video should be displayed in fullscreen mode

[Actual result]
A black screen appears after which the video is returned to normal mode.

Browser Console log:
Check the attached file

Comment 1

[Alastor Wu [:alwu]]

I can reproduce this issue on Nightly 67.0a1 (2019-02-06), OSX 10.13.5.

Comment 2

[Alastor Wu [:alwu]]

From the call stack, it seems site removing the fullscreen element explictly.

C++ call stack, the element leaves fullscreen when it unbinded from tree.

frame #0: 0x0000000103fddbb6 XUL`mozilla::dom::Element::UnbindFromTree(this=0x000000011c6ca000, aDeep=true, aNullParent=false) at Element.cpp:1856 [opt]
    frame #1: 0x000000010573ba48 XUL`nsGenericHTMLElement::UnbindFromTree(this=0x000000011c6ca000, aDeep=true, aNullParent=false) at nsGenericHTMLElement.cpp:469 [opt]
    frame #2: 0x00000001056d2236 XUL`mozilla::dom::HTMLMediaElement::UnbindFromTree(this=0x000000011c6ca000, aDeep=true, aNullParent=false) at HTMLMediaElement.cpp:4261 [opt]
    frame #3: 0x0000000103fde2a3 XUL`mozilla::dom::Element::UnbindFromTree(this=0x000000011db81d30, aDeep=true, aNullParent=<unavailable>) at Element.cpp:1992 [opt]

Here is JS call stack.

0 appendTo/<(h = [object Object]) ["https://www.youtube.com/yts/jsbin/desktop_polymer-vfl8ahXk7/desktop_polymer.js":11604:418]
    this = [object Object]
1 d.nextStep_() ["https://www.youtube.com/yts/jsbin/desktop_polymer-vfl8ahXk7/desktop_polymer.js":475:65]
    this = [object Object]
2 d.next_(a = [object Object]) ["https://www.youtube.com/yts/jsbin/desktop_polymer-vfl8ahXk7/desktop_polymer.js":470:209]
    this = [object Object]
3 wa/this.next(b = [object Object]) ["https://www.youtube.com/yts/jsbin/desktop_polymer-vfl8ahXk7/desktop_polymer.js":476:48]
    this = [object Object]
4 b(b = [object Object]) ["https://www.youtube.com/yts/jsbin/desktop_polymer-vfl8ahXk7/desktop_polymer.js":479:88]
    this = [object Window]

---

But I'm not sure whether this issue is caused by youtube internal logic (not calling fullscreen via their context menu), change the component to DOM to see if someone can help us confirm that.

Comment 3

[Marcela (Please NI request to Brindusa Tot)]

Reproducible in Windows10
Version 68.0a1
Build ID 20190513215004
User Agent Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:68.0) Gecko/20100101 Firefox/68.0

Comment 4

[Liviu Seplecan]

Reproducible in Windows 7x64 on latest nighlty 69.0a1 (10-06-2019)
Build ID 20190609214350
Mozilla/5.0 (Windows NT 6.1; WOW64; rv:69.0) Gecko/20100101 Firefox/69.0

Comment 5

[Virginia (please send need info request to Brindusa Tot)]

Reproducible in Windows 10 x64 on latest nightly 69.0a1 (2019-06-10) (64-bit)
Build ID 20190610093815
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:69.0) Gecko/20100101 Firefox/69.0

Comment 6

[Alin Ilea, Desktop QA]

Reproducible in Mac OS 10.12 on latest Nightly 69.0a1 (2019-06-10)
Build ID 20190610214846
Mozilla/5.0 (Macintosh; Intel Mac OS X 10.12; rv:69.0) Gecko/20100101 Firefox/69.0

Comment 7

[Hani Yacoub, Desktop QA]

Managed to reproduce this bug on Ubuntu 18.04 x64 using the latest Firefox Nightly 69.0a1 (2019-06-12).

Comment 8

[Alin Ilea, Desktop QA]

Reproducible on latest Nightly version 70.0a1 (2019-07-16).
Build ID: 20190716001037

Comment 9

[Hsin-Yi Tsai (she/her) [:hsinyi]]

I tried to test this and this issue was reproducible all way back to ff50.
That made me wonder if this is an issue on youtube side ... ...
:xidorn, when you get a chance, would you mind shedidng some light here? Thank you,

Comment 10

[Xidorn Quan [:xidorn] UTC+11]

As analyzed in comment 2, this happens because YouTube uses appendChild to move the fullscreen element in that function.

The behavior triggered by UnbindFromTree happens based on removing steps in the Fullscreen spec. (But when I tried to follow the spec to see how appendChild can trigger the removing steps, I couldn't find a path.)

I wrote a simple testcase

<!DOCTYPE html>
<style>
  #parent1 { color: green; }
  #parent2 { color: red; }
  #child { width: 100px; height: 100px; background: pink; }
</style>
<div id="parent1">
  <div id="child">click to fullscreen</div>
</div>
<div id="parent2">
</div>
<script>
child.addEventListener('click', () => child.requestFullscreen());
document.addEventListener('fullscreenchange', () => {
  if (document.fullscreen) {
    parent2.appendChild(child);
  } else {
    parent1.appendChild(child);
  }
});
</script>

which shows that Chrome also exits fullscreen when using appendChild to move the fullscreen element. So this specific behavior doesn't seem to have interoperability issue.

This issue isn't reproducible on Chrome (Chrome doesn't have fullscreen in menu, but you can enable the native video controls and use it to fullscreen the video), and I checked the DOM tree, and don't see any difference between fullscreen state and non-fullscreen state, so presumably they are not doing the appendChild thing on Chrome.

Given these, I think it's likely something from YouTube that we have nothing to do with.

I would also argue that this is probably not an important issue anyway, as double right click isn't something normal users would likely to do...

Comment 11

[Olli Pettay [:smaug][[e-mail]]]

(But when I tried to follow the spec to see how appendChild can trigger the removing steps, I couldn't find a path.)
https://dom.spec.whatwg.org/#concept-node-pre-insert calls https://dom.spec.whatwg.org/#concept-node-adopt

Comment 12

[Xidorn Quan [:xidorn] UTC+11]

(In reply to Olli Pettay [:smaug] from comment #11)

(But when I tried to follow the spec to see how appendChild can trigger the removing steps, I couldn't find a path.)
https://dom.spec.whatwg.org/#concept-node-pre-insert calls https://dom.spec.whatwg.org/#concept-node-adopt

Oh I see, I overlooked the second step of adopt, and thought it only does something when the document is different.

Comment 13

[Hsin-Yi Tsai (she/her) [:hsinyi]]

Thanks Xidorn!
Moving to Webcompat component per comment 10. :)

Comment 14

[Mike Taylor [:miketaylr]]

Thanks all, I've sent an email to our partner list.

Comment 15

[Mike Taylor [:miketaylr]]

The update we got was:

The problem here is that we assume that we're entering our enhanced fullscreen, which fullscreens the whole page to allow the user to scroll down while in fullscreen. This is the behavior that occurs when the user presses the fullscreen button in the player controls. I believe that the native context menu triggers fullscreen on just the <video> element, which our code is not currently expecting (because it's difficult for the user to trigger, and it isn't as good an experience as our enhanced fullscreen feature). We can look into supporting this use case.

I wouldn't expect this to be fixed any time soon, but it's nice to understand why the bug exists.

Comment 16

[Mike Taylor [:miketaylr]]

Brindusa, YouTube said a fix was rolled out for this bug. Could you please verify?

Comment 17

[Liviu Seplecan]

Re-test it on Windows 7x64, Windows 10, Mac OS X & Ubuntu 18.04 -using latest nightly build 70.0a1 (26 August 2019)- the issue won't occur.

Comment 18

[Mike Taylor [:miketaylr]]

Thanks, changing to FIXED as YouTube pushed out a fix for this.