fix: no keypress with ctrlKey and altKey

testing-library · Mar 23, 2021 · 7a9a0b8 · 7a9a0b8
1 parent 2b0632a
commit 7a9a0b8
Show file tree

Hide file tree

Showing 3 changed files with 42 additions and 32 deletions.
diff --git a/src/__tests__/keyboard/keyboardImplementation.ts b/src/__tests__/keyboard/keyboardImplementation.ts
@@ -0,0 +1,17 @@
+import userEvent from '../../index'
+import {setup} from '../helpers/utils'
+
+test('no character input if `altKey` or `ctrlKey` is pressed', () => {
+  const {element, eventWasFired} = setup(`<input/>`)
+  ;(element as HTMLInputElement).focus()
+
+  userEvent.keyboard('[ControlLeft>]g')
+
+  expect(eventWasFired('keypress')).toBe(false)
+  expect(eventWasFired('input')).toBe(false)
+
+  userEvent.keyboard('[AltLeft>]g')
+
+  expect(eventWasFired('keypress')).toBe(false)
+  expect(eventWasFired('input')).toBe(false)
+})
diff --git a/src/__tests__/type-modifiers.js b/src/__tests__/type-modifiers.js
@@ -235,7 +235,7 @@ test('{alt}a{/alt}', () => {
   userEvent.type(element, '{alt}a{/alt}')
 
   expect(getEventSnapshot()).toMatchInlineSnapshot(`
-    Events fired on: input[value="a"]
+    Events fired on: input[value=""]
 
     input[value=""] - pointerover
     input[value=""] - pointerenter
@@ -252,11 +252,8 @@ test('{alt}a{/alt}', () => {
     input[value=""] - click: Left (0)
     input[value=""] - keydown: Alt (18) {alt}
     input[value=""] - keydown: a (97) {alt}
-    input[value=""] - keypress: a (97) {alt}
-    input[value="a"] - input
-      "{CURSOR}" -> "a{CURSOR}"
-    input[value="a"] - keyup: a (97) {alt}
-    input[value="a"] - keyup: Alt (18)
+    input[value=""] - keyup: a (97) {alt}
+    input[value=""] - keyup: Alt (18)
   `)
 })
 
@@ -297,7 +294,7 @@ test('{ctrl}a{/ctrl}', () => {
   userEvent.type(element, '{ctrl}a{/ctrl}')
 
   expect(getEventSnapshot()).toMatchInlineSnapshot(`
-    Events fired on: input[value="a"]
+    Events fired on: input[value=""]
 
     input[value=""] - pointerover
     input[value=""] - pointerenter
@@ -314,11 +311,8 @@ test('{ctrl}a{/ctrl}', () => {
     input[value=""] - click: Left (0)
     input[value=""] - keydown: Control (17) {ctrl}
     input[value=""] - keydown: a (97) {ctrl}
-    input[value=""] - keypress: a (97) {ctrl}
-    input[value="a"] - input
-      "{CURSOR}" -> "a{CURSOR}"
-    input[value="a"] - keyup: a (97) {ctrl}
-    input[value="a"] - keyup: Control (17)
+    input[value=""] - keyup: a (97) {ctrl}
+    input[value=""] - keyup: Control (17)
   `)
 })
 
@@ -896,7 +890,7 @@ test('{meta}{alt}{ctrl}a{/ctrl}{/alt}{/meta}', () => {
   userEvent.type(element, '{meta}{alt}{ctrl}a{/ctrl}{/alt}{/meta}')
 
   expect(getEventSnapshot()).toMatchInlineSnapshot(`
-    Events fired on: input[value="a"]
+    Events fired on: input[value=""]
 
     input[value=""] - pointerover
     input[value=""] - pointerenter
@@ -915,13 +909,10 @@ test('{meta}{alt}{ctrl}a{/ctrl}{/alt}{/meta}', () => {
     input[value=""] - keydown: Alt (18) {alt}{meta}
     input[value=""] - keydown: Control (17) {alt}{meta}{ctrl}
     input[value=""] - keydown: a (97) {alt}{meta}{ctrl}
-    input[value=""] - keypress: a (97) {alt}{meta}{ctrl}
-    input[value="a"] - input
-      "{CURSOR}" -> "a{CURSOR}"
-    input[value="a"] - keyup: a (97) {alt}{meta}{ctrl}
-    input[value="a"] - keyup: Control (17) {alt}{meta}
-    input[value="a"] - keyup: Alt (18) {meta}
-    input[value="a"] - keyup: Meta (93)
+    input[value=""] - keyup: a (97) {alt}{meta}{ctrl}
+    input[value=""] - keyup: Control (17) {alt}{meta}
+    input[value=""] - keyup: Alt (18) {meta}
+    input[value=""] - keyup: Meta (93)
   `)
 })
 
@@ -1123,7 +1114,7 @@ test('any remaining type modifiers are automatically released at the end', () =>
   userEvent.type(element, '{meta}{alt}{ctrl}a{/alt}')
 
   expect(getEventSnapshot()).toMatchInlineSnapshot(`
-    Events fired on: input[value="a"]
+    Events fired on: input[value=""]
 
     input[value=""] - pointerover
     input[value=""] - pointerenter
@@ -1142,13 +1133,10 @@ test('any remaining type modifiers are automatically released at the end', () =>
     input[value=""] - keydown: Alt (18) {alt}{meta}
     input[value=""] - keydown: Control (17) {alt}{meta}{ctrl}
     input[value=""] - keydown: a (97) {alt}{meta}{ctrl}
-    input[value=""] - keypress: a (97) {alt}{meta}{ctrl}
-    input[value="a"] - input
-      "{CURSOR}" -> "a{CURSOR}"
-    input[value="a"] - keyup: a (97) {alt}{meta}{ctrl}
-    input[value="a"] - keyup: Alt (18) {meta}{ctrl}
-    input[value="a"] - keyup: Meta (93) {ctrl}
-    input[value="a"] - keyup: Control (17)
+    input[value=""] - keyup: a (97) {alt}{meta}{ctrl}
+    input[value=""] - keyup: Alt (18) {meta}{ctrl}
+    input[value=""] - keyup: Meta (93) {ctrl}
+    input[value=""] - keyup: Control (17)
   `)
 })
 

diff --git a/src/keyboard/keyboardImplementation.ts b/src/keyboard/keyboardImplementation.ts
@@ -51,10 +51,7 @@ export async function keyboardImplementation(
         state,
       )
 
-      if (
-        unpreventedDefault &&
-        (keyDef.key?.length === 1 || keyDef.key === 'Enter')
-      ) {
+      if (unpreventedDefault && hasKeyPress(keyDef, state)) {
         keypress(keyDef, getCurrentElement, options, state)
       }
 
@@ -194,3 +191,11 @@ function applyPlugins(
 
   return !!plugin
 }
+
+function hasKeyPress(keyDef: keyboardKey, state: keyboardState) {
+  return (
+    (keyDef.key?.length === 1 || keyDef.key === 'Enter') &&
+    !state.modifiers.ctrl &&
+    !state.modifiers.alt
+  )
+}