WICG / document-picture-in-picture

https://wicg.github.io/document-picture-in-picture/
Other
56 stars 9 forks source link

Option to Remove "Back to Tab" Button in Picture-in-Picture (PiP) Window #113

Closed offbeatful closed 5 months ago

offbeatful commented 6 months ago

The current "Back to Tab" button within the Picture-in-Picture window presents some usability concerns that deserve consideration:

Proposed Solution: Provide an option to remove the "Back to Tab" button from the Picture-in-Picture requestWindow method.

beaufortfrancois commented 6 months ago

The "Back to tab" button is an implementation detail browsers choose to expose in their UI. I don't think the spec should say something about how browsers should handle this potential button.

Contradicts Design Language: The "Back to Tab" closes the PiP window while navigating back to original tab, may conflict with the common web design pattern of "open in a new tab" button navigating towards a new page. This inconsistency can lead to user confusion, specifically when both buttons are visible (Back to Tab in the header and Open in a New Tab HTML button created by user).

Can you share a real-life example of this issue? It's not clear to me where user confusion may happen.

Unexpected Behavior: Users might not intuitively understand that the "Back to Tab" button closes the PiP window entirely. They might expect it to return focus to the original tab while keeping the PiP window open.

Safari and Firefox browsers also have respectively a "Return" and "Back to tab" button in their PiP video windows implementations. We didn't hear yet users complaining about it.

Instead, we may want to update the Back to Tab" button UI in Chrome. Data points that proves that "Back to Tab" is confusing would also help as well.

safarifirefox

Alternative Controls: The standard "close" button (usually an "X") already provides the functionality of closing the PiP window, rendering the "Back to Tab" button potentially redundant.

The "Back to tab" button closes the PiP window but also focuses the opener tab. We could argue the "Back to Tab" button should be just about focusing the tab also.

Proposed Solution: Provide an option to remove the "Back to Tab" button from the Picture-in-Picture requestWindow method.

A way to do feature detection before calling requestWindow with the option would also come handy for web developers.

beaufortfrancois commented 6 months ago

Since web developers can now use the focus() Window method to focus the opener window from the Picture-in-Picture window, I wonder if we should simply remove the "back to tab" button from the PiP window and let the web app handle it by itself.

steimelchrome commented 6 months ago

I'm not sure I'm convinced that the focus() changes are enough to motivate always removing the "back to tab" button and forcing websites to create their own button.

Do you have any ideas on how to enable feature detection for the option?

beaufortfrancois commented 6 months ago

I'm not sure I'm convinced that the focus() changes are enough to motivate always removing the "back to tab" button and forcing websites to create their own button.

Do we have user stats about the usage of "close" vs "back to tab" buttons in PiP windows?

Do you have any ideas on how to enable feature detection for the option?

With no standardized ways to do proper feature detection before calling the documentPictureInPicture.requestWindow(), web developers would have to do it afterwards with the following code for instance:

let supportsAllowReturnToTab = false;

await documentPictureInPicture.requestWindow(
  Object.defineProperty({ width: 300, height: 200 }, "allowReturnToTab", {
    get: () => {
      supportsAllowReturnToTab = true;
      return true; // the actual value of "allowReturnToTab"
    },
  }),
);
console.log({ supportsAllowReturnToTab });
steimelchrome commented 6 months ago

Do we have user stats about the usage of "close" vs "back to tab" buttons in PiP windows?

Yep. Just checked Windows stats and it looks like "back to tab" is used about twice as often as "close", so users definitely find it to be a useful feature.

Also, thanks for the link about feature detection. Definitely seems like a larger issue

iamryflores commented 6 months ago

I just want to support some of the comments that were already mentioned: