← Projects

Open source contribution · co-authored fix

Zen Browser

Compact Mode. Drag text or a URL toward the window edge to reveal the sidebar. The sidebar flickers — cycling rapidly between visible and hidden. Drag-and-drop completely unusable. Reported on Windows x64, version 1.17b, issue #10942.

Root cause

Expanding the sidebar during dragover changes the DOM boundaries. The browser fires a spurious dragleave because the cursor is suddenly “outside” the element it just expanded into. That triggers a collapse — which fires another dragover — and the loop repeats faster than the eye can track.

Two fixes

my PR — debounce

 handleDragleave(event) {
+  this._isDragging = true;
+  clearTimeout(this._debounceTimer);
+  this._debounceTimer = setTimeout(
+    () => this._collapse(), 150);
 }

what shipped — contains() check

-  this._ignoreNextHover
+  this._ignoreNextHover ||
+  (event.type === 'dragleave' &&
+    event.explicitOriginalTarget !== target &&
+    target.contains?.(event.explicitOriginalTarget))

Both work. One addresses the cause.

The patch

src/zen/compact-mode/ZenCompactMode.mjs  +4 −1

-  this._ignoreNextHover
+  this._ignoreNextHover ||
+  (event.type === 'dragleave' &&
+    event.explicitOriginalTarget !== target &&
+    target.contains?.(event.explicitOriginalTarget))

What I learned

  • Browser Toolbox + log breakpoints for DOM event debugging.
  • explicitOriginalTarget vs target in Firefox’s event model.
  • Debouncing can solve the symptom; contains() checks solve the cause.
  • When a maintainer overrides your fix, ask why — the answer is usually worth more than the merge.

If you have a problem
worth solving —
let’s talk.