refactor: migrate to VS Code titlebar drag region pattern

packages/desktop/src/window/window-manager.test.ts

@@ -1,6 +1,15 @@
-import { describe, expect, it } from "vitest";
+import { describe, expect, it, vi } from "vitest";
 
-import { getTitleBarOverlayOptions, readBadgeCount, readWindowTheme } from "./window-manager";
+import {
+  applyWindowControlsOverlayUpdate,
+  createWindowControlsOverlayState,
+  getMainWindowChromeOptions,
+  getTitleBarOverlayOptions,
+  readBadgeCount,
+  readWindowControlsOverlayUpdate,
+  readWindowTheme,
+  resolveRuntimeTitleBarOverlayOptions,
+} from "./window-manager";
 
 describe("window-manager", () => {
   describe("readBadgeCount", () => {
@@ -39,7 +48,7 @@ describe("window-manager", () => {
       expect(getTitleBarOverlayOptions("light")).toEqual({
         color: "#ffffff",
         symbolColor: "#09090b",
-        height: 48,
+        height: 29,
       });
     });
 
@@ -47,7 +56,133 @@ describe("window-manager", () => {
       expect(getTitleBarOverlayOptions("dark")).toEqual({
         color: "#18181c",
         symbolColor: "#e4e4e7",
+        height: 29,
+      });
+    });
+  });
+
+  describe("readWindowControlsOverlayUpdate", () => {
+    it("accepts partial runtime overlay updates", () => {
+      expect(
+        readWindowControlsOverlayUpdate({
+          height: 48,
+          backgroundColor: "#18181c",
+        }),
+      ).toEqual({
         height: 48,
+        backgroundColor: "#18181c",
+      });
+    });
+
+    it("rejects empty and invalid payloads", () => {
+      expect(readWindowControlsOverlayUpdate(undefined)).toBeNull();
+      expect(readWindowControlsOverlayUpdate({})).toBeNull();
+      expect(readWindowControlsOverlayUpdate({ height: 0 })).toBeNull();
+      expect(readWindowControlsOverlayUpdate({ backgroundColor: 12 })).toBeNull();
+    });
+  });
+
+  describe("resolveRuntimeTitleBarOverlayOptions", () => {
+    it("applies the VS Code height minus border adjustment", () => {
+      expect(
+        resolveRuntimeTitleBarOverlayOptions({
+          height: 48,
+          backgroundColor: "#ffffff",
+          foregroundColor: "#09090b",
+        }),
+      ).toEqual({
+        color: "#ffffff",
+        symbolColor: "#09090b",
+        height: 47,
+      });
+    });
+  });
+
+  describe("applyWindowControlsOverlayUpdate", () => {
+    it("merges cached colors with later runtime height updates", () => {
+      const setTitleBarOverlay = vi.fn();
+      let state = createWindowControlsOverlayState("dark");
+
+      state = applyWindowControlsOverlayUpdate({
+        win: { setTitleBarOverlay },
+        current: state,
+        update: {
+          backgroundColor: "#18181c",
+          foregroundColor: "#e4e4e7",
+        },
+      });
+
+      state = applyWindowControlsOverlayUpdate({
+        win: { setTitleBarOverlay },
+        current: state,
+        update: { height: 48 },
+      });
+
+      expect(state).toEqual({
+        height: 48,
+        backgroundColor: "#18181c",
+        foregroundColor: "#e4e4e7",
+      });
+      expect(setTitleBarOverlay).toHaveBeenNthCalledWith(1, {
+        color: "#18181c",
+        symbolColor: "#e4e4e7",
+        height: 28,
+      });
+      expect(setTitleBarOverlay).toHaveBeenNthCalledWith(2, {
+        color: "#18181c",
+        symbolColor: "#e4e4e7",
+        height: 47,
+      });
+    });
+  });
+
+  describe("getMainWindowChromeOptions", () => {
+    it("uses frameless hidden title bars with overlay on windows", () => {
+      expect(
+        getMainWindowChromeOptions({
+          platform: "win32",
+          theme: "dark",
+        }),
+      ).toEqual({
+        titleBarStyle: "hidden",
+        frame: false,
+        autoHideMenuBar: true,
+        titleBarOverlay: {
+          color: "#18181c",
+          symbolColor: "#e4e4e7",
+          height: 29,
+        },
+      });
+    });
+
+    it("uses frameless hidden title bars with overlay on linux", () => {
+      expect(
+        getMainWindowChromeOptions({
+          platform: "linux",
+          theme: "light",
+        }),
+      ).toEqual({
+        titleBarStyle: "hidden",
+        frame: false,
+        autoHideMenuBar: true,
+        titleBarOverlay: {
+          color: "#ffffff",
+          symbolColor: "#09090b",
+          height: 29,
+        },
+      });
+    });
+
+    it("keeps the mac traffic-light path separate", () => {
+      expect(
+        getMainWindowChromeOptions({
+          platform: "darwin",
+          theme: "dark",
+        }),
+      ).toEqual({
+        titleBarStyle: "hidden",
+        titleBarOverlay: true,
+        trafficLightPosition: { x: 16, y: 14 },
       });
     });
   });