From 88897768072522a8e66b4c2b11cb1a3b52d465b4 Mon Sep 17 00:00:00 2001 From: "Kent C. Dodds" Date: Wed, 24 Jun 2020 22:54:19 -0600 Subject: [PATCH] fix: ensure all events are fired in the eventWrapper (#385) Closes #384 --- package.json | 1 + src/blur.js | 4 +++- src/clear.js | 3 +++ src/click.js | 4 ++++ src/focus.js | 3 ++- src/hover.js | 4 ++++ src/paste.js | 7 ++++++- src/select-options.js | 5 +++-- src/tab.js | 3 ++- src/type.js | 3 +++ src/upload.js | 2 ++ src/utils.js | 16 ++++++++++++++++ 12 files changed, 49 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index 389efe05..cd05e78d 100644 --- a/package.json +++ b/package.json @@ -55,6 +55,7 @@ "rules": { "jsx-a11y/click-events-have-key-events": "off", "jsx-a11y/tabindex-no-positive": "off", + "no-func-assign": "off", "no-return-assign": "off", "react/prop-types": "off", "testing-library/no-dom-import": "off" diff --git a/src/blur.js b/src/blur.js index 549e0454..305a8b56 100644 --- a/src/blur.js +++ b/src/blur.js @@ -1,5 +1,5 @@ import {fireEvent} from '@testing-library/dom' -import {getActiveElement, isFocusable} from './utils' +import {getActiveElement, isFocusable, wrapInEventWrapper} from './utils' function blur(element, init) { if (!isFocusable(element)) return @@ -11,4 +11,6 @@ function blur(element, init) { fireEvent.focusOut(element, init) } +blur = wrapInEventWrapper(blur) + export {blur} diff --git a/src/clear.js b/src/clear.js index 965d1a6c..a604e5a8 100644 --- a/src/clear.js +++ b/src/clear.js @@ -1,4 +1,5 @@ import {type} from './type' +import {wrapInEventWrapper} from './utils' function clear(element) { if (element.tagName !== 'INPUT' && element.tagName !== 'TEXTAREA') { @@ -27,4 +28,6 @@ function clear(element) { } } +clear = wrapInEventWrapper(clear) + export {clear} diff --git a/src/click.js b/src/click.js index ee5fc6ec..7a5f1889 100644 --- a/src/click.js +++ b/src/click.js @@ -2,6 +2,7 @@ import {fireEvent} from '@testing-library/dom' import { getMouseEventOptions, isLabelWithInternallyDisabledControl, + wrapInEventWrapper, } from './utils' import {hover} from './hover' import {blur} from './blur' @@ -103,4 +104,7 @@ function dblClick(element, init) { fireEvent.dblClick(element, getMouseEventOptions('dblclick', init, 2)) } +click = wrapInEventWrapper(click) +dblClick = wrapInEventWrapper(dblClick) + export {click, dblClick} diff --git a/src/focus.js b/src/focus.js index 52644ae6..2e4f7c5f 100644 --- a/src/focus.js +++ b/src/focus.js @@ -1,5 +1,5 @@ import {fireEvent} from '@testing-library/dom' -import {getActiveElement, isFocusable} from './utils' +import {getActiveElement, isFocusable, wrapInEventWrapper} from './utils' function focus(element, init) { if (!isFocusable(element)) return @@ -10,5 +10,6 @@ function focus(element, init) { element.focus() fireEvent.focusIn(element, init) } +focus = wrapInEventWrapper(focus) export {focus} diff --git a/src/hover.js b/src/hover.js index e2a3bb80..7c81a34f 100644 --- a/src/hover.js +++ b/src/hover.js @@ -2,6 +2,7 @@ import {fireEvent} from '@testing-library/dom' import { isLabelWithInternallyDisabledControl, getMouseEventOptions, + wrapInEventWrapper, } from './utils' function hover(element, init) { @@ -34,4 +35,7 @@ function unhover(element, init) { } } +hover = wrapInEventWrapper(hover) +unhover = wrapInEventWrapper(unhover) + export {hover, unhover} diff --git a/src/paste.js b/src/paste.js index 5c091290..a0bdd26a 100644 --- a/src/paste.js +++ b/src/paste.js @@ -1,5 +1,9 @@ import {fireEvent} from '@testing-library/dom' -import {setSelectionRangeIfNecessary, calculateNewValue} from './utils' +import { + setSelectionRangeIfNecessary, + calculateNewValue, + wrapInEventWrapper, +} from './utils' function paste( element, @@ -49,5 +53,6 @@ function paste( }) } } +paste = wrapInEventWrapper(paste) export {paste} diff --git a/src/select-options.js b/src/select-options.js index a63cd238..88121a95 100644 --- a/src/select-options.js +++ b/src/select-options.js @@ -1,4 +1,5 @@ import {createEvent, getConfig, fireEvent} from '@testing-library/dom' +import {wrapInEventWrapper} from './utils' import {click} from './click' import {focus} from './focus' @@ -73,7 +74,7 @@ function selectOptionsBase(newValue, select, values, init) { } } -const selectOptions = selectOptionsBase.bind(null, true) -const deselectOptions = selectOptionsBase.bind(null, false) +const selectOptions = wrapInEventWrapper(selectOptionsBase.bind(null, true)) +const deselectOptions = wrapInEventWrapper(selectOptionsBase.bind(null, false)) export {selectOptions, deselectOptions} diff --git a/src/tab.js b/src/tab.js index 96ae333a..fd5706f4 100644 --- a/src/tab.js +++ b/src/tab.js @@ -1,5 +1,5 @@ import {fireEvent} from '@testing-library/dom' -import {getActiveElement, FOCUSABLE_SELECTOR} from './utils' +import {getActiveElement, FOCUSABLE_SELECTOR, wrapInEventWrapper} from './utils' import {focus} from './focus' import {blur} from './blur' @@ -112,6 +112,7 @@ function tab({shift = false, focusTrap} = {}) { fireEvent.keyUp(keyUpTarget, {...shiftKeyInit, shiftKey: false}) } } +tab = wrapInEventWrapper(tab) export {tab} diff --git a/src/type.js b/src/type.js index b3ebb80d..0bee11ed 100644 --- a/src/type.js +++ b/src/type.js @@ -3,10 +3,12 @@ import { fireEvent, getConfig as getDOMTestingLibraryConfig, } from '@testing-library/dom' + import { getActiveElement, calculateNewValue, setSelectionRangeIfNecessary, + wrapInEventWrapper, } from './utils' import {click} from './click' @@ -528,6 +530,7 @@ function getEventCallbackMap({ } } } +type = wrapInEventWrapper(type) export {type} diff --git a/src/upload.js b/src/upload.js index 87bd447f..5c97466a 100644 --- a/src/upload.js +++ b/src/upload.js @@ -1,4 +1,5 @@ import {fireEvent, createEvent} from '@testing-library/dom' +import {wrapInEventWrapper} from './utils' import {click} from './click' import {blur} from './blur' import {focus} from './focus' @@ -47,5 +48,6 @@ function upload(element, fileOrFiles, init) { ...init, }) } +upload = wrapInEventWrapper(upload) export {upload} diff --git a/src/utils.js b/src/utils.js index 9057126a..932acbbf 100644 --- a/src/utils.js +++ b/src/utils.js @@ -1,3 +1,5 @@ +import {getConfig} from '@testing-library/dom' + function isMousePressEvent(event) { return ( event === 'mousedown' || @@ -169,6 +171,19 @@ function isFocusable(element) { ) } +function wrapInEventWrapper(fn) { + function wrapper(...args) { + let result + getConfig().eventWrapper(() => { + result = fn(...args) + }) + return result + } + // give it a helpful name for debugging + Object.defineProperty(wrapper, 'name', {value: `${fn.name}Wrapper`}) + return wrapper +} + export { FOCUSABLE_SELECTOR, isFocusable, @@ -177,4 +192,5 @@ export { getActiveElement, calculateNewValue, setSelectionRangeIfNecessary, + wrapInEventWrapper, }