Update - Found a Solution
I managed to solve this by creating a custom DOM element that controls sidebar visibility using CSS instead of trying to block the original JavaScript events. The approach isn’t perfect since I’m still learning, but it gets the job done.
Note that this method works with Greasemonkey/Tampermonkey in regular browsers but doesn’t function properly as a Fluid userscript. If anyone has more experience and can suggest improvements, that would be awesome.
Initial Question
I’m just starting with JavaScript and learning through hands-on projects.
I use Notion regularly and find the automatic sidebar popup really frustrating when my cursor moves near the left edge of the screen.
I heard that Fluid app supports custom userscripts and might allow me to disable this behavior using custom CSS or JavaScript modifications.
However, I’m struggling to figure out the right approach to either block mouseover events with JS or hide the functionality with CSS.
I believe I’ve located the event listener responsible for this behavior, but I’m unsure how to properly remove that listener or prevent the function from executing.
Can someone guide me on the best way to approach this?
For Notion, target the sidebar with #notion-app .notion-sidebar and use visibility: hidden !important. The problem with Fluid userscripts is timing - they load before the DOM is ready. Wrap your CSS in a MutationObserver that waits for the sidebar to appear, then applies your styles. I’ve done this in desktop apps where regular userscript managers don’t work. The observer keeps your changes even when Notion updates its interface.
Been fighting the same UI automation problems for years. CSS fixes help, but they break every time the app updates.
What actually works is system-level automation that catches and controls these behaviors before they happen. I built workflows that intercept mouse events and stop web apps from doing annoying stuff.
Works across all browsers and apps - no userscript compatibility headaches. You can set rules to detect when you’re near screen edges and kill those sidebar triggers completely.
Bonus: extend it to fix other annoying UI crap in different apps. Way more solid than crossing your fingers that userscripts work everywhere.
Check out https://latenode.com for building these automation workflows.
Try pointer-events: none on the sidebar trigger zone. I’ve dealt with similar auto-hiding elements and CSS targeting works way better than messing with event listeners after they’re attached. You need to find the exact DOM element detecting mouse proximity - usually it’s an invisible div at the screen edge. Inspect the element and slap pointer-events: none or display: none right on that trigger zone. This stays stable through app updates since you’re not wrestling with JavaScript execution order. Worth trying CSS first before diving into complex event stuff.
nice tip! i think fluid has its quirks with userscripts. you might also want to explore if the sidebar has a specific class that you can target with CSS to hide it completely. good luck!