Skip to content

Commit 9aa178c

Browse files
author
Jess
committed
fix: use the keyCodes provided in options from wrapper.trigger
Previously wrapper.trigger('keydown', { keyCode: 65 }) would trigger a keydown event with a keyCode of 0. This commit fixes that bug. PR closes #1285 PR closes #1295
1 parent a05b499 commit 9aa178c

File tree

3 files changed

+58
-26
lines changed

3 files changed

+58
-26
lines changed

Diff for: packages/test-utils/src/create-dom-event.js

+34-22
Original file line numberDiff line numberDiff line change
@@ -24,36 +24,46 @@ const modifiers = {
2424
pagedown: 34
2525
}
2626

27-
function createEvent(
28-
type,
29-
modifier,
30-
{ eventInterface, bubbles, cancelable },
31-
options
32-
) {
27+
function getOptions(eventParams) {
28+
const { modifier, meta, options } = eventParams
29+
const keyCode = modifiers[modifier] || options.keyCode || options.code
30+
31+
return {
32+
...options, // What the user passed in as the second argument to #trigger
33+
34+
bubbles: meta.bubbles,
35+
meta: meta.cancelable,
36+
37+
// Any derived options should go here
38+
keyCode,
39+
code: keyCode
40+
}
41+
}
42+
43+
function createEvent(eventParams) {
44+
const { eventType, meta = {} } = eventParams
45+
3346
const SupportedEventInterface =
34-
typeof window[eventInterface] === 'function'
35-
? window[eventInterface]
47+
typeof window[meta.eventInterface] === 'function'
48+
? window[meta.eventInterface]
3649
: window.Event
3750

38-
const event = new SupportedEventInterface(type, {
51+
const event = new SupportedEventInterface(
52+
eventType,
3953
// event properties can only be added when the event is instantiated
4054
// custom properties must be added after the event has been instantiated
41-
...options,
42-
bubbles,
43-
cancelable,
44-
keyCode: modifiers[modifier]
45-
})
55+
getOptions(eventParams)
56+
)
4657

4758
return event
4859
}
4960

50-
function createOldEvent(
51-
type,
52-
modifier,
53-
{ eventInterface, bubbles, cancelable }
54-
) {
61+
function createOldEvent(eventParams) {
62+
const { eventType, modifier, meta } = eventParams
63+
const { bubbles, cancelable } = meta
64+
5565
const event = document.createEvent('Event')
56-
event.initEvent(type, bubbles, cancelable)
66+
event.initEvent(eventType, bubbles, cancelable)
5767
event.keyCode = modifiers[modifier]
5868
return event
5969
}
@@ -62,11 +72,13 @@ export default function createDOMEvent(type, options) {
6272
const [eventType, modifier] = type.split('.')
6373
const meta = eventTypes[eventType] || defaultEventType
6474

75+
const eventParams = { eventType, modifier, meta, options }
76+
6577
// Fallback for IE10,11 - https://stackoverflow.com/questions/26596123
6678
const event =
6779
typeof window.Event === 'function'
68-
? createEvent(eventType, modifier, meta, options)
69-
: createOldEvent(eventType, modifier, meta)
80+
? createEvent(eventParams)
81+
: createOldEvent(eventParams)
7082

7183
const eventPrototype = Object.getPrototypeOf(event)
7284
Object.keys(options || {}).forEach(key => {

Diff for: test/specs/wrapper/trigger.spec.js

+20
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,26 @@ describeWithShallowAndMount('trigger', mountingMethod => {
3737
expect(keydownHandler.calledOnce).to.equal(true)
3838
})
3939

40+
describe('causes keydown handler to fire with the appropriate keyCode when wrapper.trigger("keydown", { keyCode: 65 }) is fired on a Component', () => {
41+
const keydownHandler = sandbox.stub()
42+
const wrapper = mountingMethod(ComponentWithEvents, {
43+
propsData: { keydownHandler }
44+
})
45+
46+
wrapper.find('.keydown').trigger('keydown', { keyCode: 65 })
47+
48+
const keyboardEvent = keydownHandler.getCall(0).args[0]
49+
50+
// Unfortunately, JSDom will give different types than PhantomJS for keyCodes (string vs number), so we have to use parseInt to normalize the types.
51+
it('contains the keyCode', () => {
52+
expect(parseInt(keyboardEvent.keyCode, 10)).to.equal(65)
53+
})
54+
55+
itDoNotRunIf(isRunningPhantomJS, 'contains the code', () => {
56+
expect(parseInt(keyboardEvent.code, 10)).to.equal(65)
57+
})
58+
})
59+
4060
it('causes keydown handler to fire when wrapper.trigger("keydown.enter") is fired on a Component', () => {
4161
const keydownHandler = sandbox.stub()
4262
const wrapper = mountingMethod(ComponentWithEvents, {

Diff for: yarn.lock

+4-4
Original file line numberDiff line numberDiff line change
@@ -4498,10 +4498,10 @@ flatten@^1.0.2:
44984498
version "1.0.2"
44994499
resolved "https://registry.yarnpkg.com/flatten/-/flatten-1.0.2.tgz#dae46a9d78fbe25292258cc1e780a41d95c03782"
45004500

4501-
flow-bin@^0.111.0:
4502-
version "0.111.3"
4503-
resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.111.3.tgz#8653a413400ebc966097a47c81fb4e6b722a5921"
4504-
integrity sha512-Gn27aRTjSFicukZ/pq3raRERmSk9UWszhIK9eNtj6843L54YtK+jk2OkQWV70+VKi9LmWyfItCkhwoIVy7L2lA==
4501+
flow-bin@^0.66.0:
4502+
version "0.66.0"
4503+
resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.66.0.tgz#a96dde7015dc3343fd552a7b4963c02be705ca26"
4504+
integrity sha1-qW3ecBXcM0P9VSp7SWPAK+cFyiY=
45054505

45064506
flow-remove-types-no-whitespace@^1.0.3:
45074507
version "1.0.5"

0 commit comments

Comments
 (0)