Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Frameless window makes "-webkit-app-region: drag" styled element ignore ":hover" style rules #13534

Closed
christian-judt opened this Issue Jul 2, 2018 · 4 comments

Comments

Projects
None yet
2 participants
@christian-judt
Copy link

christian-judt commented Jul 2, 2018

  • Electron version: 1.7.8 - 2.0.3
  • Operating system: Windows 7 / Windows 10

Preconditions

  • Window is frameless
  • Window has own "-webkit-app-region: drag" element that is styled to change its color when hovered

Expected behavior

  • Mouse is moved over "-webkit-app-region: drag" element
  • "-webkit-app-region: drag" element changes its color as styled

Actual behavior

  • Mouse is moved over "-webkit-app-region: drag" element
  • "-webkit-app-region: drag" element remains visibly unchanged

How to reproduce

git clone -b webkit-app-region-drag-swallows-mouse-events-bug https://github.com/christian-judt/electron-quick-start.git
cd electron-quick-start
npm install
npm start

Maybe related issues

  • mouseleave event isn't fired when moving the mouse outside the window (Windows) #611
  • -webkit-app-region drag disables parts of UI and doesn't act like normal HTML #741
  • -webkit-app-region: drag eats all click events #1354
  • App-region: drag on Windows 10, blocking events #7107
@MarshallOfSound

This comment has been minimized.

Copy link
Member

MarshallOfSound commented Jul 2, 2018

This is a duplicate of one of the issues you found (#741)

Basically this isn't something we can fix, once you add that CSS property the OS will steal all events away from us

@christian-judt

This comment has been minimized.

Copy link
Author

christian-judt commented Jul 2, 2018

Good to know this is a problem at the operating system level. In #741 this aspect does not stick out as much as it probably should,

I am going to assume tickets regarding these operating system level problems have already been created further upstream. Can you give me information about those? A simple link will suffice.

@MarshallOfSound

This comment has been minimized.

Copy link
Member

MarshallOfSound commented Jul 2, 2018

I am going to assume tickets regarding these operating system level problems have already been created further upstream

This isn't an issue upstream with OS's, this is expected and documented behavior from OS's

@christian-judt

This comment has been minimized.

Copy link
Author

christian-judt commented Jul 2, 2018

My current workaroud regarding my specific ":hover" problems is checking for the cursor position and window size and position at the current screen every 50 milliseconds via the main process and updating a DOM attribute value depending on whether the cursor should be hovering over my "-webkit-app-region: drag" element right now. (and using a corresponding attribute selector instead of the ":hover" selector in the CSS of course)

I suppose it would be asked too much to add a corresponding and slightly more effective workaround a little bit more upstream? While such a workaround would neither fix the original issue feature at its source nor provide a full workaround for electron, it would at least restore some standard styling behavior for "-webkit-app-region: drag" elements.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.