From 08a89cfd2890e9f97f96d46250d8786af7125877 Mon Sep 17 00:00:00 2001
From: Antoine Vandecreme <antoine@vandecreme.net>
Date: Sat, 28 Mar 2020 16:54:09 +0100
Subject: [PATCH] fix: #911 isDragActive value when dragging over text on
 Firefox

---
 src/index.js      | 13 ++++++++-----
 src/index.spec.js |  6 ++++++
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/index.js b/src/index.js
index ca86761b..95a75250 100755
--- a/src/index.js
+++ b/src/index.js
@@ -487,10 +487,7 @@ export function useDropzone({
       event.persist()
       stopPropagation(event)
 
-      // Count the dropzone and any children that are entered.
-      if (dragTargetsRef.current.indexOf(event.target) === -1) {
-        dragTargetsRef.current = [...dragTargetsRef.current, event.target]
-      }
+      dragTargetsRef.current = [...dragTargetsRef.current, event.target]
 
       if (isEvtWithFiles(event)) {
         Promise.resolve(getFilesFromEvent(event)).then(draggedFiles => {
@@ -542,8 +539,14 @@ export function useDropzone({
 
       // Only deactivate once the dropzone and all children have been left
       const targets = dragTargetsRef.current.filter(
-        target => target !== event.target && rootRef.current && rootRef.current.contains(target)
+        target => rootRef.current && rootRef.current.contains(target)
       )
+      // Make sure to remove a target present multiple times only once
+      // (Firefox may fire dragenter/dragleave multiple times on the same element)
+      const targetIdx = targets.indexOf(event.target)
+      if (targetIdx !== -1) {
+        targets.splice(targetIdx, 1)
+      }
       dragTargetsRef.current = targets
       if (targets.length > 0) {
         return
diff --git a/src/index.spec.js b/src/index.spec.js
index 4ae172d4..f9e077a0 100644
--- a/src/index.spec.js
+++ b/src/index.spec.js
@@ -1878,6 +1878,12 @@ describe('useDropzone() hook', () => {
       expect(dropzone).toHaveTextContent('dragAccept')
       expect(dropzone).not.toHaveTextContent('dragReject')
 
+      fireDragLeave(dropzone, data)
+      await flushPromises(ui, container)
+      expect(dropzone).toHaveTextContent('dragActive')
+      expect(dropzone).toHaveTextContent('dragAccept')
+      expect(dropzone).not.toHaveTextContent('dragReject')
+
       fireDragLeave(dropzone, data)
       await flushPromises(ui, container)
       expect(dropzone).not.toHaveTextContent('dragActive')