Fixed: Ignore mouse-up event after 'long-click' action invoked

mbnuqw · Jan 11, 2020 · 4c12e08 · 4c12e08
1 parent 58fdcdd
commit 4c12e08
Show file tree

Hide file tree

Showing 6 changed files with 33 additions and 64 deletions.
diff --git a/src/sidebar/actions/menu.js b/src/sidebar/actions/menu.js
@@ -9,8 +9,8 @@ const xmlSerializer = new XMLSerializer()
  */
 async function openCtxMenu(type, x, y) {
   if (!this.state.selected.length) return
-  if (this.state.tabLongRightClickFired) {
-    this.state.tabLongRightClickFired = false
+  if (this.state.tabLongClickFired) {
+    this.state.tabLongClickFired = false
     return
   }
   if (!type) return

diff --git a/src/sidebar/actions/misc.js b/src/sidebar/actions/misc.js
@@ -208,6 +208,17 @@ function blockCtxMenu() {
   }, 500)
 }
 
+/**
+ * Reset long-click action fired flag
+ */
+function resetLongClickLock() {
+  if (this.state.tabLongClickFired) {
+    setTimeout(() => {
+      this.state.tabLongClickFired = false
+    }, 120)
+  }
+}
+
 /**
  * Start multi selection
  */
@@ -370,6 +381,7 @@ export default {
   updateSidebarWidth,
   blockWheel,
   blockCtxMenu,
+  resetLongClickLock,
   startMultiSelection,
   stopMultiSelection,
   confirm,

diff --git a/src/sidebar/components/pinned-tab.vue b/src/sidebar/components/pinned-tab.vue
@@ -159,7 +159,6 @@ export default {
       }
 
       // Long-click action
-      this.longClickActionLeftFired = false
       this.longClickActionLeft = setTimeout(() => {
         if (State.dragNodes) return
         let llc = State.tabLongLeftClick
@@ -169,7 +168,7 @@ export default {
         if (llc === 'mute') Actions.remuteTabs([this.tab.id])
         if (llc === 'clear_cookies') Actions.clearTabsCookies([this.tab.id])
         if (llc === 'new_after') Actions.createTabAfter(this.tab.id)
-        if (llc !== 'none') this.longClickActionLeftFired = true
+        if (llc !== 'none') State.tabLongClickFired = true
         this.longClickActionLeft = null
       }, 300)
     },
@@ -192,7 +191,6 @@ export default {
       }
 
       // Long-click action
-      this.longClickActionRightFired = false
       this.longClickActionRight = setTimeout(() => {
         Actions.stopMultiSelection()
         let lrc = State.tabLongRightClick
@@ -202,28 +200,19 @@ export default {
         if (lrc === 'mute') Actions.remuteTabs([this.tab.id])
         if (lrc === 'clear_cookies') Actions.clearTabsCookies([this.tab.id])
         if (lrc === 'new_after') Actions.createTabAfter(this.tab.id)
-        if (lrc !== 'none') this.longClickActionRightFired = true
+        if (lrc !== 'none') State.tabLongClickFired = true
         this.longClickActionRight = null
-        State.tabLongRightClickFired = true
       }, 300)
     },
 
     /**
      * Handle mouseup event
      */
     onMouseUp(e) {
-      setTimeout(() => {
-        State.tabLongRightClickFired = false
-      }, 120)
-      if (State.tabLongRightClickFired) return
+      if (State.tabLongClickFired) return Actions.resetLongClickLock()
 
       if (e.button === 0) {
-        if (
-          (State.selected.length || State.activateOnMouseUp) &&
-          !this.longClickActionLeftFired &&
-          !e.ctrlKey &&
-          !e.shiftKey
-        ) {
+        if ((State.selected.length || State.activateOnMouseUp) && !e.ctrlKey && !e.shiftKey) {
           browser.tabs.update(this.tab.id, { active: true })
         }
         if (this.longClickActionLeft) {
@@ -239,25 +228,19 @@ export default {
         if (e.ctrlKey || e.shiftKey) return
 
         Actions.stopMultiSelection()
-        if (!State.ctxMenuNative && !this.longClickActionRightFired) {
+        if (!State.ctxMenuNative) {
           Actions.selectItem(this.tab.id)
+          Actions.openCtxMenu('tab', e.clientX, e.clientY)
         }
-        if (!State.ctxMenuNative) Actions.openCtxMenu('tab', e.clientX, e.clientY)
       }
     },
 
     /**
      * Handle context menu
      */
     onCtxMenu(e) {
-      if (State.tabLongRightClickFired) {
-        State.tabLongRightClickFired = false
-        e.stopPropagation()
-        e.preventDefault()
-        return
-      }
-
-      if (this.longClickActionRightFired || !State.ctxMenuNative || e.ctrlKey || e.shiftKey) {
+      if (State.tabLongClickFired || !State.ctxMenuNative || e.ctrlKey || e.shiftKey) {
+        State.tabLongClickFired = false
         e.stopPropagation()
         e.preventDefault()
         return

diff --git a/src/sidebar/components/tab.vue b/src/sidebar/components/tab.vue
@@ -171,7 +171,6 @@ export default {
       }
 
       // Long-click action
-      this.longClickActionLeftFired = false
       this.longClickActionLeft = setTimeout(() => {
         if (State.dragNodes) return
         let llc = State.tabLongLeftClick
@@ -182,7 +181,7 @@ export default {
         if (llc === 'clear_cookies') Actions.clearTabsCookies([this.tab.id])
         if (llc === 'new_after') Actions.createTabAfter(this.tab.id)
         if (llc === 'new_child') Actions.createChildTab(this.tab.id)
-        if (llc !== 'none') this.longClickActionLeftFired = true
+        if (llc !== 'none') State.tabLongClickFired = true
         this.longClickActionLeft = null
       }, 300)
     },
@@ -211,7 +210,6 @@ export default {
       }
 
       // Long-click action
-      this.longClickActionRightFired = false
       this.longClickActionRight = setTimeout(() => {
         Actions.stopMultiSelection()
         Actions.resetSelection()
@@ -223,28 +221,19 @@ export default {
         if (lrc === 'clear_cookies') Actions.clearTabsCookies([this.tab.id])
         if (lrc === 'new_after') Actions.createTabAfter(this.tab.id)
         if (lrc === 'new_child') Actions.createChildTab(this.tab.id)
-        if (lrc !== 'none') this.longClickActionRightFired = true
+        if (lrc !== 'none') State.tabLongClickFired = true
         this.longClickActionRight = null
-        State.tabLongRightClickFired = true
       }, 300)
     },
 
     /**
      * Handle mouseup event
      */
     onMouseUp(e) {
-      setTimeout(() => {
-        State.tabLongRightClickFired = false
-      }, 120)
-      if (State.tabLongRightClickFired) return
+      if (State.tabLongClickFired) return Actions.resetLongClickLock()
 
       if (e.button === 0) {
-        if (
-          (State.selected.length || State.activateOnMouseUp) &&
-          !this.longClickActionLeftFired &&
-          !e.ctrlKey &&
-          !e.shiftKey
-        ) {
+        if ((State.selected.length || State.activateOnMouseUp) && !e.ctrlKey && !e.shiftKey) {
           browser.tabs.update(this.tab.id, { active: true })
         }
         if (this.longClickActionLeft) {
@@ -261,9 +250,7 @@ export default {
 
         Actions.stopMultiSelection()
         if (State.ctxMenuBlockTimeout) return
-        if (!State.selected.length && !State.ctxMenuNative && !this.longClickActionRightFired) {
-          this.select()
-        }
+        if (!State.selected.length && !State.ctxMenuNative) this.select()
         if (!State.ctxMenuNative) Actions.openCtxMenu('tab', e.clientX, e.clientY)
       }
     },
@@ -272,14 +259,8 @@ export default {
      * Handle context menu
      */
     onCtxMenu(e) {
-      if (State.tabLongRightClickFired) {
-        State.tabLongRightClickFired = false
-        e.stopPropagation()
-        e.preventDefault()
-        return
-      }
-
-      if (this.longClickActionRightFired || !State.ctxMenuNative || e.ctrlKey || e.shiftKey) {
+      if (State.tabLongClickFired || !State.ctxMenuNative || e.ctrlKey || e.shiftKey) {
+        State.tabLongClickFired = false
         e.stopPropagation()
         e.preventDefault()
         return

diff --git a/src/sidebar/components/tabs-panel.vue b/src/sidebar/components/tabs-panel.vue
@@ -148,7 +148,7 @@ export default {
     },
 
     onRightMouseUp(e) {
-      if (State.tabLongRightClickFired) return
+      if (State.tabLongClickFired) return
       if (State.tabsPanelRightClickAction !== 'menu') return
       if (State.selected.length) return
 
@@ -172,20 +172,15 @@ export default {
      * Handle context menu event
      */
     onNavCtxMenu(e) {
-      if (State.tabLongRightClickFired) {
-        State.tabLongRightClickFired = false
-        e.stopPropagation()
-        e.preventDefault()
-        return
-      }
-
       if (
+        State.tabLongClickFired ||
         !State.ctxMenuNative ||
         e.ctrlKey ||
         e.shiftKey ||
         typeof State.selected[0] === 'number' ||
         typeof State.selected[0] === 'string'
       ) {
+        State.tabLongClickFired = false
         e.stopPropagation()
         e.preventDefault()
         return

diff --git a/src/sidebar/sidebar.vue b/src/sidebar/sidebar.vue
@@ -385,9 +385,7 @@ export default {
      * Mouse up event handler
      */
     onMouseUp(e) {
-      setTimeout(() => {
-        State.tabLongRightClickFired = false
-      }, 120)
+      Actions.resetLongClickLock()
 
       if (e.button === 0 && !e.ctrlKey && !e.shiftKey) {
         Actions.closeCtxMenu()