feat: enable window controls overlay on macOS #29253

jkleinsc · 2021-05-20T00:03:16Z

Description of Change

This PR adds a new property titleBarOverlay to BrowserWindow on macOS to support Window Controls Overlay. On macOS, when using a frameless window in conjunction with win.setWindowButtonVisibility(true) or using a titleBarStyle so that the traffic lights are visible, this property enables the Window Controls Overlay JavaScript APIs and CSS Environment Variables will be available for developers to use to better style custom titlebars.

There will be another PR forthcoming that will enable this capability on Windows. Windows needs NativeWindow::SetWindowControlsOverlayRect(const gfx::Rect& overlay_rect), but this newly added method is not used on macOS.

Checklist

PR description included and stakeholders cc'd
npm test passes
tests are changed or added
relevant documentation is changed or added
PR release notes describe the change in a way relevant to app developers, and are capitalized, punctuated, and past tense.

Release Notes

Notes: Added support for Windows Control Overlay on macOS.

zcbenz

NotifyLayoutWindowControlsOverlay should also be called when SetWindowButtonVisibility and SetTrafficLightPosition are called.

shell/browser/native_window.cc

shell/browser/native_window_mac.mm

shell/browser/native_window_observer.h

docs/api/browser-window.md

shell/browser/native_window_mac.mm

shell/browser/native_window_observer.h

docs/api/frameless-window.md

zcbenz · 2021-06-10T05:02:33Z

I'm not sure whether this needs API approval, since it implements an experimental feature of Chromium, but the API looks good to me anyway.

@electron/wg-api

MarshallOfSound

Requesting changes just so this doesn't land in the current state, we had some offline discussions mostly revolving around the large quantity of copied code in the windows PR but both PRs should be updated to only take effect when a new "overlay" tile bar style is defined. This should not affect any existing apps.

docs/api/frameless-window.md

nornagon · 2021-06-14T16:53:44Z

I think the only wg-api-relevant consideration here is whether this has the potential to break existing use cases. Eventually the JS/CSS parts of this feature will be available without the blink feature flag, so it's worth considering whether a developer would want to have a hidden titlebar style without allowing the JS to set titlebar properties. I can't really imagine a compelling use case for that, so I'm 👍 from an API perspective.

shell/browser/api/electron_api_browser_window.cc

shell/browser/native_window_mac.mm

Co-authored-by: Samuel Attard <sam@electronjs.org>

release-clerk · 2021-07-01T19:25:42Z

Release Notes Persisted

Added support for Windows Control Overlay on macOS.

trop · 2021-07-01T19:25:55Z

I was unable to backport this PR to "13-x-y" cleanly;
you will need to perform this backport manually.

trop · 2021-07-01T19:26:06Z

I have automatically backported this PR to "14-x-y", please check out #29986

* feat: enable windows control overlay on macOS * address review feedback * chore: address review feedback * Address review feedback * update doc per review * only enable WCO when titleBarStyle is overlay * Revert "only enable WCO when titleBarStyle is overlay" This reverts commit 1b58b5b. * Add new titleBarOverlay property to manage feature * spelling fix * Update docs/api/frameless-window.md Co-authored-by: Samuel Attard <sam@electronjs.org> * Update shell/browser/api/electron_api_browser_window.cc Co-authored-by: Samuel Attard <sam@electronjs.org> * update per review feedback Co-authored-by: Samuel Attard <sam@electronjs.org> (cherry picked from commit 1f8a46c)

trop · 2021-08-25T14:11:14Z

@jkleinsc has manually backported this PR to "13-x-y", please check out #30698

* feat: enable windows control overlay on macOS * address review feedback * chore: address review feedback * Address review feedback * update doc per review * only enable WCO when titleBarStyle is overlay * Revert "only enable WCO when titleBarStyle is overlay" This reverts commit 1b58b5b. * Add new titleBarOverlay property to manage feature * spelling fix * Update docs/api/frameless-window.md Co-authored-by: Samuel Attard <sam@electronjs.org> * Update shell/browser/api/electron_api_browser_window.cc Co-authored-by: Samuel Attard <sam@electronjs.org> * update per review feedback Co-authored-by: Samuel Attard <sam@electronjs.org>

* feat: enable windows control overlay on macOS * address review feedback * chore: address review feedback * Address review feedback * update doc per review * only enable WCO when titleBarStyle is overlay * Revert "only enable WCO when titleBarStyle is overlay" This reverts commit 1b58b5b. * Add new titleBarOverlay property to manage feature * spelling fix * Update docs/api/frameless-window.md Co-authored-by: Samuel Attard <sam@electronjs.org> * Update shell/browser/api/electron_api_browser_window.cc Co-authored-by: Samuel Attard <sam@electronjs.org> * update per review feedback Co-authored-by: Samuel Attard <sam@electronjs.org> (cherry picked from commit 1f8a46c)

* feat: enable window controls overlay on macOS (#29253) * feat: enable windows control overlay on macOS * address review feedback * chore: address review feedback * Address review feedback * update doc per review * only enable WCO when titleBarStyle is overlay * Revert "only enable WCO when titleBarStyle is overlay" This reverts commit 1b58b5b. * Add new titleBarOverlay property to manage feature * spelling fix * Update docs/api/frameless-window.md Co-authored-by: Samuel Attard <sam@electronjs.org> * Update shell/browser/api/electron_api_browser_window.cc Co-authored-by: Samuel Attard <sam@electronjs.org> * update per review feedback Co-authored-by: Samuel Attard <sam@electronjs.org> (cherry picked from commit 1f8a46c) * feat: enable windows control overlay on Windows (#30678) cherry-picked from 41646d1 Co-Authored-By: Michaela Laurencin <35157522+mlaurencin@users.noreply.github.com> Co-authored-by: Michaela Laurencin <35157522+mlaurencin@users.noreply.github.com> * modify included header files and update patches * kick off missed ci * fix lint error * chore: update patches * chore: update patches * remove version control marker * correct `resizeable_` backport Co-authored-by: John Kleinschmidt <jkleinsc@electronjs.org> Co-authored-by: PatchUp <73610968+patchup[bot]@users.noreply.github.com> Co-authored-by: Cheng Zhao <zcbenz@gmail.com>

electron-cation bot added the new-pr 🌱 PR opened in the last 24 hours label May 20, 2021

jkleinsc added target/13-x-y semver/minor backwards-compatible functionality labels May 20, 2021

electron-cation bot added the api-review/requested 🗳 label May 20, 2021

zcbenz requested changes May 20, 2021

View reviewed changes

shell/browser/native_window.cc Show resolved Hide resolved

shell/browser/native_window_mac.mm Outdated Show resolved Hide resolved

electron-cation bot removed the new-pr 🌱 PR opened in the last 24 hours label May 27, 2021

zcbenz added the target/14-x-y label May 27, 2021

jkleinsc requested a review from zcbenz May 27, 2021 18:30

zcbenz requested changes Jun 1, 2021

View reviewed changes

jkleinsc force-pushed the title-overlay-macos branch from befd91b to c8d27fe Compare June 8, 2021 21:56

jkleinsc requested a review from zcbenz June 8, 2021 21:56

mlaurencin mentioned this pull request Jun 9, 2021

feat: enable windows control overlay on Windows #29600

Merged

5 tasks

zcbenz reviewed Jun 9, 2021

View reviewed changes

shell/browser/native_window_observer.h Outdated Show resolved Hide resolved

docs/api/frameless-window.md Outdated Show resolved Hide resolved

jkleinsc added 5 commits June 9, 2021 13:51

feat: enable windows control overlay on macOS

49cc7ef

address review feedback

0abf709

chore: address review feedback

ebb8ab6

Address review feedback

a40a868

update doc per review

4c47634

jkleinsc force-pushed the title-overlay-macos branch from 2afae95 to 4c47634 Compare June 9, 2021 17:54

jkleinsc requested a review from zcbenz June 9, 2021 17:55

MarshallOfSound changed the title ~~feat: enable windows control overlay on macOS~~ feat: enable window controls overlay on macOS Jun 9, 2021

zcbenz approved these changes Jun 10, 2021

View reviewed changes

MarshallOfSound requested changes Jun 14, 2021

View reviewed changes

codebytere reviewed Jun 14, 2021

View reviewed changes

docs/api/frameless-window.md Show resolved Hide resolved

electron-cation bot added api-review/approved ✅ and removed api-review/requested 🗳 labels Jun 14, 2021

only enable WCO when titleBarStyle is overlay

1b58b5b

jkleinsc requested a review from MarshallOfSound June 17, 2021 20:25

MarshallOfSound reviewed Jun 30, 2021

View reviewed changes

shell/browser/api/electron_api_browser_window.cc Outdated Show resolved Hide resolved

zcbenz approved these changes Jun 30, 2021

View reviewed changes

shell/browser/native_window_mac.mm Outdated Show resolved Hide resolved

jkleinsc and others added 3 commits June 30, 2021 10:14

Update docs/api/frameless-window.md

0f1ca3d

Co-authored-by: Samuel Attard <sam@electronjs.org>

Update shell/browser/api/electron_api_browser_window.cc

fdd888d

Co-authored-by: Samuel Attard <sam@electronjs.org>

update per review feedback

7cd5bd0

jkleinsc requested a review from MarshallOfSound June 30, 2021 14:33

MarshallOfSound approved these changes Jul 1, 2021

View reviewed changes

jkleinsc merged commit 1f8a46c into main Jul 1, 2021

jkleinsc deleted the title-overlay-macos branch July 1, 2021 19:25

trop bot added needs-manual-bp/13-x-y and removed target/13-x-y labels Jul 1, 2021

trop bot mentioned this pull request Jul 1, 2021

feat: enable window controls overlay on macOS #29986

Merged

trop bot added in-flight/14-x-y and removed target/14-x-y labels Jul 1, 2021

jkleinsc mentioned this pull request Aug 25, 2021

feat: enable window controls overlay on macOS (#29253) #30698

Merged

trop bot added in-flight/13-x-y and removed needs-manual-bp/13-x-y labels Aug 25, 2021

trop bot added merged/13-x-y and removed in-flight/13-x-y labels Sep 16, 2021

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: enable window controls overlay on macOS #29253

feat: enable window controls overlay on macOS #29253

jkleinsc commented May 20, 2021 •

edited

zcbenz left a comment

zcbenz commented Jun 10, 2021

MarshallOfSound left a comment •

edited

nornagon commented Jun 14, 2021

release-clerk bot commented Jul 1, 2021

trop bot commented Jul 1, 2021

trop bot commented Jul 1, 2021

trop bot commented Aug 25, 2021

feat: enable window controls overlay on macOS #29253

feat: enable window controls overlay on macOS #29253

Conversation

jkleinsc commented May 20, 2021 • edited

Description of Change

Checklist

Release Notes

zcbenz left a comment

Choose a reason for hiding this comment

zcbenz commented Jun 10, 2021

MarshallOfSound left a comment • edited

Choose a reason for hiding this comment

nornagon commented Jun 14, 2021

release-clerk bot commented Jul 1, 2021

trop bot commented Jul 1, 2021

trop bot commented Jul 1, 2021

trop bot commented Aug 25, 2021

jkleinsc commented May 20, 2021 •

edited

MarshallOfSound left a comment •

edited