Fix frameless windows with vibrancy #11886

MarshallOfSound · 2018-02-11T01:22:58Z

Tested with setVibrancy as well so this supports dynamically switching vibrancy still as well.

ckerr · 2018-02-11T01:44:35Z

atom/browser/native_window_mac.h

@@ -149,6 +149,8 @@ class NativeWindowMac : public NativeWindow,

  bool simple_fullscreen() const { return always_simple_fullscreen_; }

+  void SetRenderWidgetHostOpaque(bool opaque);


This is only called from within the class. Seems like it could be moved to inside the protected block?

ckerr · 2018-02-11T02:11:01Z

atom/browser/native_window_mac.mm

+        impl->SetBackgroundOpaque(opaque);
+    }
+  }
+}


This is a pretty egregious demeter violation but I'm not sure what the Right Thing is here since some of these conditionals are for upstream classes out of our control 🤔

Yeah, I tried to collapse it as much as I could but everything is just consecutive potentially nullptr values 🤔

I inverted the logic to collapse it a bit 👍

Still like 4 steps of separation though so idk 🤔

ckerr · 2018-02-11T02:26:23Z

atom/browser/native_window_mac.h

@@ -213,6 +215,9 @@ class NativeWindowMac : public NativeWindow,
  NSRect original_frame_;
  NSUInteger simple_fullscreen_mask_;

+  NSColor* background_color_before_vibrancy_ = nil;


I'm not positive but should this be a base::scoped_nsobject<NSColor>?

You right 👍 😄

MarshallOfSound · 2018-02-11T02:37:10Z

@ckerr Updated 👍

codebytere

Looks 💯 to me now!

sallar · 2018-02-12T18:40:35Z

@codebytere when do you think this will be released?

codebytere · 2018-02-12T18:42:42Z

@sallar it's on the table for 2.0, i believe, so fairly soon

HuChundong · 2018-02-24T12:41:39Z

not include in 2.0 beta1?

MarshallOfSound · 2018-02-24T12:51:00Z

@HuChundong It should be, do you have a case where it's not working?

HuChundong · 2018-02-24T13:48:16Z

@MarshallOfSound
yes,there is something wrong with me, at first i'm sorry for my poor english,thanks for your quick reply
mainWindow = new BrowserWindow({ height: 540, minHeight: 540, width: 830, minWidth: 830, useContentSize: true, webPreferences: {webSecurity: false}, resizable: true, alwaysOnTop: false, transparent: true, show: false, frame: false, titleBarStyle: 'hiddenInset', vibrancy: 'ultra-dark' })

this main window still lose round corner in high sierra 10.13.3
i need to set fullscreen and then exit full screen to get round corner back

MarshallOfSound · 2018-02-24T21:42:16Z

This PR was not intended to fix the round / square corner issue. There is a separate open issue for that

tcaer · 2018-02-26T01:41:54Z

Hi, I don't know what I am doing wrong but this is still not working for me... running MacOS 10.13.3. I still get the same error of the transparent bar showing up.
Here is my window code:

function createWindow() {
	var bounds = electron.screen.getPrimaryDisplay().workAreaSize;

	/*
	* Fix the issue where the window bounds are not correct in windows 10
	*/
	var shouldMaximize;
	if (process.platform == 'win32') {
		if (bounds.x === 0 || bounds.y === 0 || bounds.x === -8 || bounds.y === -8) {
        	var screenSize = electron.screen.getPrimaryDisplay().workAreaSize
        	if ((screenSize.width === bounds.width || bounds.width - screenSize.width === 16) && (screenSize.height === bounds.height || bounds.height - screenSize.height === 16)) {
          		shouldMaximize = true
        	}
      	}
	}

	mainWindow = new electron.BrowserWindow({
		width: bounds.width,
		minWidth: 300,
		height: bounds.height,
		minHeight: 430,
		x: 0,
		y: 0,
		titleBarStyle: 'hidden-inset',
		show: false,
		frame: false,
		vibrancy: 'light'
	});

	if (shouldMaximize) {
		mainWindow.maximize();
	}

	if (process.platform == 'win32') {
		mainWindow.setMenu(null);
	}

	mainWindow.loadURL(path.join('file://', __dirname, '/public/app/index.html'));

	mainWindow.once('ready-to-show', function() {
		mainWindow.show();
	});

	mainWindow.on('closed', function() {
		mainWindow = null;
	});
}

sallar · 2018-02-26T07:51:40Z

@huangruichang @tcaer Remove frame: false from your configs to see if it makes any difference.

huangruichang · 2018-02-26T07:59:34Z

@sallar Maybe I am not the person you wanna notice 🤣

tcaer · 2018-02-26T13:42:29Z

@sallar No luck... I get the square corners and the invisible tab :/

MarshallOfSound · 2018-02-26T13:50:42Z

@tcaer Can you share repro?

igor10k · 2018-02-26T14:06:12Z

@tcaer add transparent: true. The invisible tab should disappear but that was working even before this PR. There's no fix for the rounded corners though.

Judging by your comments this PR fixes nothing.

sallar · 2018-02-26T17:53:49Z

I just tested beta1. This fix changes nothing. Vibrancy+Square Corners was also possible before (using transparent: true and frame: false). This issue should be re-opened?

But judging by @MarshallOfSound's comment, there is a separate issue for the rounded corners... #10886

tommoor · 2018-02-27T00:37:51Z

Also just tested and unfortunately I'm also seeing much worse behavior than before the fix.

Previously there was just a transparent area where the titlebar would normally be – now it's showing corrupted artifacts and the titlebar has reverted to the standard thickness / position even with titleBarStyle: "hidden-inset" window option.

MarshallOfSound · 2018-02-27T04:00:06Z

@tommoor Super weird, let me test this real quick 🤔

MarshallOfSound · 2018-02-27T04:08:16Z

@tommoor Two quick things

hidden-inset shouldn't be an option in 2.0.0-beta.1 it has been replaced with hiddenInset (the other one was deprecated for a while)
Can you share your exact browser window constructor options object, I can't repro what you have a screenshot of

tommoor · 2018-02-27T04:13:45Z

Oh, interesting I did check the release notes for breaking changes and there wasn't a mention of that property being deprecated but that would explain the first part of the issue 😄. I wonder if having the deprecated option there caused it. Was the deprecation removed in 2.0? If so I guess we should add that to the notes.

The screenshot doesn't capture it too well, basically the entire titlebar is showing artifacts depending on what's behind - It mostly looks black / transparent. Options are:

{
      titleBarStyle: "hidden-inset",
      acceptFirstMouse: true,
      file: "index",
      webPreferences: { scrollBounce: true, textAreasAreResizable: false },
      x,
      y,
      width,
      height
}

MarshallOfSound · 2018-02-27T04:22:21Z

These are two screenshots off current master using

{
  vibrancy: 'dark',
  titleBarStyle: 'hiddenInset',
  transparent: true,
  frame: false,
}

MarshallOfSound · 2018-02-27T04:25:06Z

And just to prove no bamboozle, here is a screenshot from electron-quick-start using the above config using electron@2.0.0.-beta.1

tommoor · 2018-02-27T04:25:08Z

Thanks @MarshallOfSound – I'm out for the day now, but I'll try with 2.0 again tomorrow and the correct hiddenInset option, hopefully that does the trick 👍

MarshallOfSound · 2018-02-27T04:26:24Z

@tommoor It might also be the frame and transparent options helping out, let me know if you can't make it look like mine 😆

tommoor · 2018-02-27T04:28:54Z

Maybe, I can't really use those options as the square corners are unacceptable on macOS unfortunately 😞

MarshallOfSound · 2018-02-27T04:30:27Z

Hm, fair enough, we had an issue somewhere for the square corner thing. Will try take a look at that later this week if I get a chance.

tcaer · 2018-02-27T13:58:33Z

Thanks so much for all the help!
There is also another bug I get when closing an app (I am using the current beta). MacOS reports that the app crashed even though it didn't.

MarshallOfSound · 2018-02-28T10:28:17Z

@tcaer Known bug and I think it's already fixed 😆

stevenfabre · 2018-03-15T22:41:39Z

Hey guys, thanks so much for fixing this!

Does this fix the corner radius bug too? In my build, the top two corners aren't rounded when I use the following settings with a webview in it #10522:

titleBarStyle: 'default',
transparent: true,
vibrancy: 'dark',

mlabod · 2018-05-23T14:34:50Z

Rounded corners are still missing at the top edges, when vibrancy is activated.
Tested in Electron 2.0.2

MarshallOfSound requested a review from a team February 11, 2018 01:22

MarshallOfSound mentioned this pull request Feb 11, 2018

hiddenInset and vibrancy cause a invisible/low-alpha titlebar on 10.13 #10521

Closed

MarshallOfSound force-pushed the fix-vibrant-frameless-windows branch from 108e862 to cede986 Compare February 11, 2018 02:04

ckerr reviewed Feb 11, 2018

View reviewed changes

MarshallOfSound force-pushed the fix-vibrant-frameless-windows branch from cede986 to cd31f8f Compare February 11, 2018 02:37

Fix frameless windows with vibrancy

636f0dd

MarshallOfSound force-pushed the fix-vibrant-frameless-windows branch from cd31f8f to 636f0dd Compare February 11, 2018 02:40

codebytere approved these changes Feb 12, 2018

View reviewed changes

codebytere merged commit ae65938 into master Feb 12, 2018

codebytere deleted the fix-vibrant-frameless-windows branch February 12, 2018 18:38

tommoor mentioned this pull request Feb 22, 2018

Frameless Vibrant windows have square corners (no border radius) #10886

Closed

tommoor mentioned this pull request Mar 7, 2018

setVibrancy crashes in beta 2.0 #12068

Closed

MarshallOfSound mentioned this pull request Mar 7, 2018

More vibrancy fixes #12157

Merged

chadluo mentioned this pull request Apr 29, 2018

Issues in High Sierra simurai/one-vibrancy#13

Open

sethlu pushed a commit to sethlu/electron that referenced this pull request May 3, 2018

Fix frameless windows with vibrancy (electron#11886)

8d014cc

Kilian mentioned this pull request Aug 30, 2018

Titlebar on high sierra is transparent Kilian/fromscratch#72

Closed

zcbenz mentioned this pull request May 12, 2021

fix: remove background color hack in vibrancy #29114

Merged

5 tasks

		@@ -149,6 +149,8 @@ class NativeWindowMac : public NativeWindow,

		bool simple_fullscreen() const { return always_simple_fullscreen_; }

		void SetRenderWidgetHostOpaque(bool opaque);

Fix frameless windows with vibrancy #11886

Fix frameless windows with vibrancy #11886

Conversation

MarshallOfSound commented Feb 11, 2018

ckerr Feb 11, 2018

Choose a reason for hiding this comment

ckerr Feb 11, 2018

Choose a reason for hiding this comment

MarshallOfSound Feb 11, 2018

Choose a reason for hiding this comment

MarshallOfSound Feb 11, 2018

Choose a reason for hiding this comment

MarshallOfSound Feb 11, 2018

Choose a reason for hiding this comment

ckerr Feb 11, 2018

Choose a reason for hiding this comment

MarshallOfSound Feb 11, 2018

Choose a reason for hiding this comment

MarshallOfSound commented Feb 11, 2018

codebytere left a comment

Choose a reason for hiding this comment

sallar commented Feb 12, 2018

codebytere commented Feb 12, 2018

HuChundong commented Feb 24, 2018

MarshallOfSound commented Feb 24, 2018

HuChundong commented Feb 24, 2018

MarshallOfSound commented Feb 24, 2018

tcaer commented Feb 26, 2018

sallar commented Feb 26, 2018

huangruichang commented Feb 26, 2018

tcaer commented Feb 26, 2018

MarshallOfSound commented Feb 26, 2018

igor10k commented Feb 26, 2018

sallar commented Feb 26, 2018 • edited Loading

tommoor commented Feb 27, 2018

MarshallOfSound commented Feb 27, 2018

MarshallOfSound commented Feb 27, 2018

tommoor commented Feb 27, 2018

MarshallOfSound commented Feb 27, 2018

MarshallOfSound commented Feb 27, 2018

tommoor commented Feb 27, 2018

MarshallOfSound commented Feb 27, 2018

tommoor commented Feb 27, 2018 • edited Loading

MarshallOfSound commented Feb 27, 2018

tcaer commented Feb 27, 2018 • edited Loading

MarshallOfSound commented Feb 28, 2018

stevenfabre commented Mar 15, 2018 • edited Loading

mlabod commented May 23, 2018

sallar commented Feb 26, 2018 •

edited

Loading

tommoor commented Feb 27, 2018 •

edited

Loading

tcaer commented Feb 27, 2018 •

edited

Loading

stevenfabre commented Mar 15, 2018 •

edited

Loading