Fix frameless window overflow on Windows #9167
Conversation
|
I looked into this initially because I was seeing that Chrome app maximized frameless windows did not exhibit the overflow behavior and traced it down to |
|
Still getting some overflow, 150% DPI on Windows 10: Unmaximized (height: 5px on top): Maximized (only 1 pixel is shown): |
@TheSBros Just to confirm, did you run |
|
@kevinsawicki I ran |
Hmm, having trouble reproducing this on a Windows 10 VM, can you check all the edges with the following: <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
body, html {
padding: 0;
margin: 0;
}
#outer {
border: 5px solid red;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
#inner {
border: 5px solid blue;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
padding: 20px;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner">
<button onclick="require('electron').remote.getCurrentWindow().maximize()">Maximize</button>
<button onclick="require('electron').remote.getCurrentWindow().unmaximize()">Unmaximize</button>
<button onclick="window.close()">Close</button>
</div>
</div>
</body>
</html> |
|
Note that this doesn't fully fix the overflow (but that is seemingly impossible). On Win10, a maximized window will overflow on the top/left/bottom/right as follows:
So @TheSBros, I would expect you too see 2px missing from the top, but 4px seems high. |
Interesting, I'm only seeing it overflow 1px on each side at this scale. |
|
@kevinsawicki Not sure what's up - just deleted Electron and cloned a fresh repo, now it works. I'm also getting a 2px overflow on all sides, as @poiru said. Definitely better than before. |
So with the following tweaked page, you don't see a red border at all when maximized? <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
body, html {
padding: 0;
margin: 0;
}
#outer {
border: 2px solid red;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
#inner {
border: 5px solid blue;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
padding: 20px;
}
</style>
</head>
<body>
<div id="outer">
<div id="inner">
<button onclick="require('electron').remote.getCurrentWindow().maximize()">Maximize</button>
<button onclick="require('electron').remote.getCurrentWindow().unmaximize()">Unmaximize</button>
<button onclick="window.close()">Close</button>
</div>
</div>
</body>
</html> |
|
@kevinsawicki This is what I see: Perhaps it's not exactly 2px, but definitely in that ballpark. Also note the differently sized red parts. |
Yeah, I'm seeing the different sized parts as well at certain DPIs, so frustrating. |
|
@kevinsawicki I'm talking in terms of 2px display pixel overflow. (e.g. when opening the image in GIMP and looking how many pixels there are) With 150% DPI, 1 CSS pixel == 1.5 display pixels. I'm still seeing a 2px overflow with that HTML - but there's still a pixel of red left on each side because it's actually 3 pixels. |
Ah okay, 👍 💻 |
7984316 to
9211119
Compare
9211119 to
108f246
Compare
|
@kevinsawicki I rebased this on top of #9166 and also went ahead and merged it. Hopefully that was OK as this has been approved by everyone and I need this for another PR. |
|
Sorry, but the issue still persists. Please, take a look into #5267- it's still active. |
|
This PR actually cause a new bug when maximized frameless window use background material and it will make the 8px border with a acrylic effect. |
This pull request is an attempt to fix #5267 and #8728.
It removes the custom inset handling in Electron and instead uses Chrome's default inset handling in hwnd_message_handler.cc.
This previously did not work because Electron was using different a different linker flag than Chrome that resulted in the system metrics returning incorrect values.
I'm not sure if lowering the
SUBSYSTEMflag to5.02has any other consequences, but it does seem to prevent the overflow of maximized frameless windows.Fixes #5267
Fixes #8728
Refs #9140
Refs #8808
/cc @poiru @bsclifton @TheSBros @juturu