From 05ca57d538240d48cc28553e9f2dafe95b717a5a Mon Sep 17 00:00:00 2001
From: Szymon <szympix21@icloud.com>
Date: Wed, 5 Nov 2025 02:54:20 +0100
Subject: [PATCH] [PM-26821] Improve macOS fullscreen ux (#16838)

* Improve popout window UX for fullscreen macOS

Adds special handling for popout windows when the sender is in fullscreen mode on macOS. The sender window moves from fullscreen to maximized before opening the popout, and the new window is focused after creation to improve user experience.

* Add tests for fullscreen popout behavior on mac

added happy path and skip path tests

* Move popout window check before fullscreen logic

* Refactor openPopout tests for platform-specific fullscreen handling

* run prettier

---------

Co-authored-by: Addison Beck <github@addisonbeck.com>
---
 .../browser/browser-popup-utils.spec.ts       | 64 +++++++++++++++++++
 .../platform/browser/browser-popup-utils.ts   | 23 ++++++-
 2 files changed, 86 insertions(+), 1 deletion(-)

diff --git a/apps/browser/src/platform/browser/browser-popup-utils.spec.ts b/apps/browser/src/platform/browser/browser-popup-utils.spec.ts
index e4165348c6..6e2175e3a7 100644
--- a/apps/browser/src/platform/browser/browser-popup-utils.spec.ts
+++ b/apps/browser/src/platform/browser/browser-popup-utils.spec.ts
@@ -140,6 +140,11 @@ describe("BrowserPopupUtils", () => {
 
   describe("openPopout", () => {
     beforeEach(() => {
+      jest.spyOn(BrowserApi, "getPlatformInfo").mockResolvedValueOnce({
+        os: "linux",
+        arch: "x86-64",
+        nacl_arch: "x86-64",
+      });
       jest.spyOn(BrowserApi, "getWindow").mockResolvedValueOnce({
         id: 1,
         left: 100,
@@ -150,6 +155,8 @@ describe("BrowserPopupUtils", () => {
         width: 380,
       });
       jest.spyOn(BrowserApi, "createWindow").mockImplementation();
+      jest.spyOn(BrowserApi, "updateWindowProperties").mockImplementation();
+      jest.spyOn(BrowserApi, "getPlatformInfo").mockImplementation();
     });
 
     it("creates a window with the default window options", async () => {
@@ -267,6 +274,63 @@ describe("BrowserPopupUtils", () => {
         url: `chrome-extension://id/${url}?uilocation=popout&singleActionPopout=123`,
       });
     });
+
+    it("exits fullscreen and focuses popout window if the current window is fullscreen and platform is mac", async () => {
+      const url = "popup/index.html";
+      jest.spyOn(BrowserPopupUtils as any, "isSingleActionPopoutOpen").mockResolvedValueOnce(false);
+      jest.spyOn(BrowserApi, "getPlatformInfo").mockReset().mockResolvedValueOnce({
+        os: "mac",
+        arch: "x86-64",
+        nacl_arch: "x86-64",
+      });
+      jest.spyOn(BrowserApi, "getWindow").mockReset().mockResolvedValueOnce({
+        id: 1,
+        left: 100,
+        top: 100,
+        focused: false,
+        alwaysOnTop: false,
+        incognito: false,
+        width: 380,
+        state: "fullscreen",
+      });
+      jest
+        .spyOn(BrowserApi, "createWindow")
+        .mockResolvedValueOnce({ id: 2 } as chrome.windows.Window);
+
+      await BrowserPopupUtils.openPopout(url, { senderWindowId: 1 });
+      expect(BrowserApi.updateWindowProperties).toHaveBeenCalledWith(1, {
+        state: "maximized",
+      });
+      expect(BrowserApi.updateWindowProperties).toHaveBeenCalledWith(2, {
+        focused: true,
+      });
+    });
+
+    it("doesnt exit fullscreen if the platform is not mac", async () => {
+      const url = "popup/index.html";
+      jest.spyOn(BrowserPopupUtils as any, "isSingleActionPopoutOpen").mockResolvedValueOnce(false);
+      jest.spyOn(BrowserApi, "getPlatformInfo").mockReset().mockResolvedValueOnce({
+        os: "win",
+        arch: "x86-64",
+        nacl_arch: "x86-64",
+      });
+      jest.spyOn(BrowserApi, "getWindow").mockResolvedValueOnce({
+        id: 1,
+        left: 100,
+        top: 100,
+        focused: false,
+        alwaysOnTop: false,
+        incognito: false,
+        width: 380,
+        state: "fullscreen",
+      });
+
+      await BrowserPopupUtils.openPopout(url);
+
+      expect(BrowserApi.updateWindowProperties).not.toHaveBeenCalledWith(1, {
+        state: "maximized",
+      });
+    });
   });
 
   describe("openCurrentPagePopout", () => {
diff --git a/apps/browser/src/platform/browser/browser-popup-utils.ts b/apps/browser/src/platform/browser/browser-popup-utils.ts
index cd55f6361a..8343799d0e 100644
--- a/apps/browser/src/platform/browser/browser-popup-utils.ts
+++ b/apps/browser/src/platform/browser/browser-popup-utils.ts
@@ -168,8 +168,29 @@ export default class BrowserPopupUtils {
     ) {
       return;
     }
+    const platform = await BrowserApi.getPlatformInfo();
+    const isMacOS = platform.os === "mac";
+    const isFullscreen = senderWindow.state === "fullscreen";
+    const isFullscreenAndMacOS = isFullscreen && isMacOS;
+    //macOS specific handling for improved UX when sender in fullscreen aka green button;
+    if (isFullscreenAndMacOS) {
+      await BrowserApi.updateWindowProperties(senderWindow.id, {
+        state: "maximized",
+      });
 
-    return await BrowserApi.createWindow(popoutWindowOptions);
+      //wait for macOS animation to finish
+      await new Promise((resolve) => setTimeout(resolve, 1000));
+    }
+
+    const newWindow = await BrowserApi.createWindow(popoutWindowOptions);
+
+    if (isFullscreenAndMacOS) {
+      await BrowserApi.updateWindowProperties(newWindow.id, {
+        focused: true,
+      });
+    }
+
+    return newWindow;
   }
 
   /**