1699650 - The PiP toggle appears too close to (or past) the edge of the video

Status: VERIFIED FIXED

(Toolkit :: Picture-in-Picture, defect, P2)

Description

[Simona Badau, Desktop QA]

Affected Versions:
Nightly 88.0a1

Tested On:
Windows 10
Ubuntu 20.04
Mac OS X 10.15

Steps to Reproduce:

1. Launch Firefox with a clean profile
2. Go to a video sharing website (eg. www.youtube.com) and start a random video
3. Hover your mouse on the video to bring up the PiP toggle
4. Observe the PiP toggle and then click on it.

Expected:
The PiP toggle should be properly displayed.

Actual results:
On Windows 10 - the PiP toggle does not fit into the video's surface.
On Mac OS X and on Ubuntu 20.04 - the PiP toggle position is right at the edge of the video.

Notes:
The issue is not reproducible on Firefox 87 Beta.
Mozregression found commit message:
Found commit message:
Bug 1687022 - Enable nnt on Windows Nightly by default. r=mstange
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=b6cdff635c85ac511a6639a4659798a4ee4155af&tochange=e2e3769604efd9724670ca1474377789e003a992

Comment 1

[Simona Badau, Desktop QA]

Attachment: PiP on Windows 10

Comment 2

[Simona Badau, Desktop QA]

Attachment: Pip on Mac OS X

Comment 3

[Simona Badau, Desktop QA]

Attachment: PiP after click on - Windows 10

Comment 4

[Simona Badau, Desktop QA]

Attachment: PiP on Windows 10

Comment 5

[Mike Conley (:mconley) (:⚙️)]

Hi Simona,

Are you still able to reproduce this? I'm unable to see the issue you're seeing on Windows 10 using Firefox 89 Beta or Firefox 90 Nightly.

Comment 6

[Simona Badau, Desktop QA]

(In reply to Mike Conley (:mconley) (:⚙️) (Catching up on needinfos) from comment #5)

Hi Simona,

Are you still able to reproduce this? I'm unable to see the issue you're seeing on Windows 10 using Firefox 89 Beta or Firefox 90 Nightly.

I can no longer reproduce it like that. Now, the location of the pip toggle on Windows 10 is the same as in Comment 2. Tried on Firefox 89 beta 9 and on the latest Nightly 90.0a1.

Comment 7

[Pascal Chevrel:pascalc (PTO until April 26)]

marking as WFM as per comment #6

Comment 8

[Raluca Popovici, Desktop QA]

Attachment: PiPmacos111.png

Comment 9

[Raluca Popovici, Desktop QA]

This bug is still reproducible on my machine MacOS11 using Nightly 91.0a1 (2021-07-07) .

Comment 10

[Ania]

Timea, can I please kindly ask if you can still reproduce it? It works for me on macOS 11.6 and Win 10 in the latest Nightly, but I don't have access to an earlier macOS version.

Comment 11

[Timea Cernea [:tbabos][inactive]]

Hey Ania, I checked on my macOS 10.15 and Windows 10 systems and also asked Simona and Raluca individually to check it out and we can't reproduce the initial issue where the PiP toggle is cutoff.

However, the PiP toggle (both the one with the descriptive info and the normal one) are closer to the edge of the video. I am more concerned about the descriptive PiP toggle, please check the attached screenshot.

Comment 12

[Timea Cernea [:tbabos][inactive]]

Attachment: Latest Nightly 97

Comment 13

[Ania]

Thank you for checking on this, Timea.

The descriptive label one looks the same on my machine, at the very edge of the video.

Comment 14

[Ania]

This is still reproducible in Nightly 99.

Comment 15

[Daniel Bodea [:danibodea]]

I was a little confused until I realized that the button should actually be displayed close to the edge of the video, but not sticking to it.

I could not reproduce the issue with the button spilling out of the video area, but I can reproduce the less severe issue of the button being displayed right to the edge of the video area on Windows 10, Ubuntu 20.04.4 LTS and Mac OS 11.6.2 in the latest Nightly. The issue reproduces for both the descriptive PiP button and the "default" icon button.

I reconfirmed the regressor:
2022-02-24T23:09:31.094000: DEBUG : Found commit message:
Bug 1687022 - Enable nnt on Windows Nightly by default. r=mstange
With the fixes on autoland + the fixes in your queue this should be green, so
let's try this.
Differential Revision: https://phabricator.services.mozilla.com/D106953

Comment 16

[Daniel Bodea [:danibodea]]

Reverting unintentional changes.

Comment 17

[James Graham [:jgraham]]

Emilio: apparently this regressed almost a year ago with the windows theme changes you landed. It seems like maybe all that's left is a minor cosmetic issue?

Comment 18

[Emilio Cobos Álvarez (:emilio)]

So the only potential thing that can affect this is this. And indeed a while ago we didn't have anything overriding that in the PiP controls so that could've introduced some unwanted spacing. However it seems that was corrected in bug 1733580. So I don't think there's much I can do on my end anymore. If we want the PiP button to change position it'd be a trivial CSS change, but probably not worth tracking as the same regression as comment 0?

Comment 19

[kpatenio]

Attachment: Bug 1699650 - fix picture in picture toggle being too close to video edge. r=#pip-reviewers!

This patch fixes the PiP toggle position by setting the pip toggle button (and pip explainer) 12px away from the edge of the video, regardless if toggle is positioned to the left or to the right.

Comment 20

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/520798611801
fix picture in picture toggle being too close to video edge. r=pip-reviewers,mhowell

Comment 21

[Andreea Pavel [:apavel]]

https://hg.mozilla.org/mozilla-central/rev/520798611801

Comment 22

[Daniel Bodea [:danibodea]]

This fix was verified in Nightly v99.0a1 from 2022-03-04 on Windows 10, Ubuntu 20 and Mac OS 11.
This fix is not dependable on the activation/deactivation of the newly implemented subtitles in PiP.