From 6565146ebf86dc92f04bd06cb424769ffbe86c74 Mon Sep 17 00:00:00 2001
From: Philipp Fritsche <ph.fritsche@gmail.com>
Date: Wed, 29 Dec 2021 16:47:46 +0000
Subject: [PATCH 1/2] fix(pointer): fire pointer events on disabled elements

---
 src/pointer/pointerPress.ts | 106 ++++++++++++++++++------------------
 tests/pointer/index.ts      |  19 ++++---
 2 files changed, 66 insertions(+), 59 deletions(-)

diff --git a/src/pointer/pointerPress.ts b/src/pointer/pointerPress.ts
index b887bbf1..d51f635d 100644
--- a/src/pointer/pointerPress.ts
+++ b/src/pointer/pointerPress.ts
@@ -102,39 +102,40 @@ function down(
   }
   pointerState.pressed.push(pressObj)
 
-  if (!targetIsDisabled) {
-    if (pointerType !== 'mouse') {
-      fire('pointerover')
-      fire('pointerenter')
-    }
-    if (
-      pointerType !== 'mouse' ||
-      !pointerState.pressed.some(
-        p => p.keyDef !== keyDef && p.keyDef.pointerType === pointerType,
-      )
-    ) {
-      fire('pointerdown')
-    }
-    if (pointerType === 'mouse') {
+  if (pointerType !== 'mouse') {
+    fire('pointerover')
+    fire('pointerenter')
+  }
+  if (
+    pointerType !== 'mouse' ||
+    !pointerState.pressed.some(
+      p => p.keyDef !== keyDef && p.keyDef.pointerType === pointerType,
+    )
+  ) {
+    fire('pointerdown')
+  }
+
+  // TODO: touch...
+
+  if (pointerType === 'mouse') {
+    if (!targetIsDisabled) {
       pressObj.unpreventedDefault = fire('mousedown')
     }
 
-    // TODO: touch...
-  }
-
-  if (pointerType === 'mouse' && pressObj.unpreventedDefault) {
-    mousedownDefaultBehavior({
-      target,
-      targetIsDisabled,
-      clickCount,
-      position: pointerState.position[pointerName],
-      node,
-      offset,
-    })
-  }
+    if (pressObj.unpreventedDefault) {
+      mousedownDefaultBehavior({
+        target,
+        targetIsDisabled,
+        clickCount,
+        position: pointerState.position[pointerName],
+        node,
+        offset,
+      })
+    }
 
-  if (pointerType === 'mouse' && button === 'secondary') {
-    fire('contextmenu')
+    if (button === 'secondary') {
+      fire('contextmenu')
+    }
   }
 
   return pressObj
@@ -179,19 +180,20 @@ function up(
 
   // TODO: pointerleave for touch device
 
-  if (!targetIsDisabled) {
-    if (
-      pointerType !== 'mouse' ||
-      !pointerState.pressed.filter(p => p.keyDef.pointerType === pointerType)
-        .length
-    ) {
-      fire('pointerup')
-    }
-    if (pointerType !== 'mouse') {
-      fire('pointerout')
-      fire('pointerleave')
-    }
-    if (pointerType !== 'mouse' && !isMultiTouch) {
+  if (
+    pointerType !== 'mouse' ||
+    !pointerState.pressed.filter(p => p.keyDef.pointerType === pointerType)
+      .length
+  ) {
+    fire('pointerup')
+  }
+  if (pointerType !== 'mouse') {
+    fire('pointerout')
+    fire('pointerleave')
+  }
+
+  if (pointerType !== 'mouse' && !isMultiTouch) {
+    if (!targetIsDisabled) {
       if (clickCount === 1) {
         fire('mouseover')
         fire('mouseenter')
@@ -199,17 +201,17 @@ function up(
       fire('mousemove')
       unpreventedDefault = fire('mousedown') && unpreventedDefault
     }
-  }
 
-  if (unpreventedDefault && pointerType !== 'mouse' && !isMultiTouch) {
-    mousedownDefaultBehavior({
-      target,
-      targetIsDisabled,
-      clickCount,
-      position: pointerState.position[pointerName],
-      node,
-      offset,
-    })
+    if (unpreventedDefault) {
+      mousedownDefaultBehavior({
+        target,
+        targetIsDisabled,
+        clickCount,
+        position: pointerState.position[pointerName],
+        node,
+        offset,
+      })
+    }
   }
 
   delete pointerState.position[pointerName].selectionRange
diff --git a/tests/pointer/index.ts b/tests/pointer/index.ts
index e1f16d28..0babe338 100644
--- a/tests/pointer/index.ts
+++ b/tests/pointer/index.ts
@@ -109,7 +109,9 @@ describe('delay', () => {
 })
 
 test('only pointer events on disabled elements', async () => {
-  const {element, getEventSnapshot, getEvents} = setup('<button disabled />')
+  const {element, getEventSnapshot, eventWasFired} = setup(
+    '<button disabled />',
+  )
 
   await userEvent.pointer([{target: element}, {keys: '[MouseLeft]'}])
 
@@ -119,12 +121,15 @@ test('only pointer events on disabled elements', async () => {
     button - pointerover
     button - pointerenter
     button - pointermove
+    button - pointerdown
+    button - pointerup
   `)
 
-  expect(getEvents('pointerover')).toHaveLength(1)
-  // TODO: pointer down/up also happen on disabled elements
-  // expect(getEvents('pointerdown')).toHaveLength(1)
-  expect(getEvents('mouseover')).toHaveLength(0)
-  expect(getEvents('mousedown')).toHaveLength(0)
-  expect(getEvents('click')).toHaveLength(0)
+  expect(eventWasFired('pointerover')).toBe(true)
+  expect(eventWasFired('pointerdown')).toBe(true)
+  expect(eventWasFired('pointerup')).toBe(true)
+  expect(eventWasFired('mouseover')).toBe(false)
+  expect(eventWasFired('mousedown')).toBe(false)
+  expect(eventWasFired('mouseup')).toBe(false)
+  expect(eventWasFired('click')).toBe(false)
 })

From 3c1ef55d36691eb2a6d19f4ba747b2d8b09712ac Mon Sep 17 00:00:00 2001
From: Philipp Fritsche <ph.fritsche@gmail.com>
Date: Sat, 1 Jan 2022 18:15:20 +0000
Subject: [PATCH 2/2] test coverage

---
 tests/pointer/index.ts  | 12 +++++++++++-
 tests/pointer/select.ts |  3 ++-
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/tests/pointer/index.ts b/tests/pointer/index.ts
index 0babe338..48ab58e0 100644
--- a/tests/pointer/index.ts
+++ b/tests/pointer/index.ts
@@ -113,7 +113,11 @@ test('only pointer events on disabled elements', async () => {
     '<button disabled />',
   )
 
-  await userEvent.pointer([{target: element}, {keys: '[MouseLeft]'}])
+  await userEvent.pointer([
+    {target: element},
+    {keys: '[MouseLeft]'},
+    {target: element, keys: '[TouchA]'},
+  ])
 
   expect(getEventSnapshot()).toMatchInlineSnapshot(`
     Events fired on: button
@@ -123,6 +127,12 @@ test('only pointer events on disabled elements', async () => {
     button - pointermove
     button - pointerdown
     button - pointerup
+    button - pointerover
+    button - pointerenter
+    button - pointerdown
+    button - pointerup
+    button - pointerout
+    button - pointerleave
   `)
 
   expect(eventWasFired('pointerover')).toBe(true)
diff --git a/tests/pointer/select.ts b/tests/pointer/select.ts
index ac376f7c..30df93b6 100644
--- a/tests/pointer/select.ts
+++ b/tests/pointer/select.ts
@@ -26,7 +26,7 @@ test('move focus to closest focusable element', async () => {
   await userEvent.pointer({keys: '[MouseLeft>]', target: element.children[1]})
   expect(element.children[1]).toHaveFocus()
 
-  await userEvent.pointer({keys: '[MouseLeft>]', target: element.children[0]})
+  await userEvent.pointer({keys: '[TouchA]', target: element.children[0]})
   expect(element).toHaveFocus()
 })
 
@@ -35,6 +35,7 @@ test('mousedown handlers can prevent moving focus', async () => {
   element.addEventListener('mousedown', e => e.preventDefault())
 
   await userEvent.pointer({keys: '[MouseLeft>]', target: element})
+  await userEvent.pointer({keys: '[TouchA]', target: element})
 
   expect(element).not.toHaveFocus()
   expect(element).toHaveProperty('selectionStart', 0)