@@ -41,17 +41,21 @@ describe('Keyboard responder', () => {
41
41
} ) ;
42
42
43
43
function renderPropagationTest ( propagates ) {
44
+ const onClickInner = jest . fn ( ( ) => propagates ) ;
44
45
const onKeyDownInner = jest . fn ( ( ) => propagates ) ;
45
- const onKeyDownOuter = jest . fn ( ) ;
46
46
const onKeyUpInner = jest . fn ( ( ) => propagates ) ;
47
+ const onClickOuter = jest . fn ( ) ;
48
+ const onKeyDownOuter = jest . fn ( ) ;
47
49
const onKeyUpOuter = jest . fn ( ) ;
48
50
const ref = React . createRef ( ) ;
49
51
const Component = ( ) => {
50
52
const listenerInner = useKeyboard ( {
53
+ onClick : onClickInner ,
51
54
onKeyDown : onKeyDownInner ,
52
55
onKeyUp : onKeyUpInner ,
53
56
} ) ;
54
57
const listenerOuter = useKeyboard ( {
58
+ onClick : onClickOuter ,
55
59
onKeyDown : onKeyDownOuter ,
56
60
onKeyUp : onKeyUpOuter ,
57
61
} ) ;
@@ -63,19 +67,23 @@ describe('Keyboard responder', () => {
63
67
} ;
64
68
ReactDOM . render ( < Component /> , container ) ;
65
69
return {
70
+ onClickInner,
66
71
onKeyDownInner,
67
- onKeyDownOuter,
68
72
onKeyUpInner,
73
+ onClickOuter,
74
+ onKeyDownOuter,
69
75
onKeyUpOuter,
70
76
ref,
71
77
} ;
72
78
}
73
79
74
- test ( 'propagates event when a callback returns true' , ( ) => {
80
+ test ( 'propagates key event when a callback returns true' , ( ) => {
75
81
const {
82
+ onClickInner,
76
83
onKeyDownInner,
77
- onKeyDownOuter,
78
84
onKeyUpInner,
85
+ onClickOuter,
86
+ onKeyDownOuter,
79
87
onKeyUpOuter,
80
88
ref,
81
89
} = renderPropagationTest ( true ) ;
@@ -86,13 +94,18 @@ describe('Keyboard responder', () => {
86
94
target . keyup ( ) ;
87
95
expect ( onKeyUpInner ) . toBeCalled ( ) ;
88
96
expect ( onKeyUpOuter ) . toBeCalled ( ) ;
97
+ target . virtualclick ( ) ;
98
+ expect ( onClickInner ) . toBeCalled ( ) ;
99
+ expect ( onClickOuter ) . toBeCalled ( ) ;
89
100
} ) ;
90
101
91
- test ( 'does not propagate event when a callback returns false' , ( ) => {
102
+ test ( 'does not propagate key event when a callback returns false' , ( ) => {
92
103
const {
104
+ onClickInner,
93
105
onKeyDownInner,
94
- onKeyDownOuter,
95
106
onKeyUpInner,
107
+ onClickOuter,
108
+ onKeyDownOuter,
96
109
onKeyUpOuter,
97
110
ref,
98
111
} = renderPropagationTest ( false ) ;
@@ -103,6 +116,9 @@ describe('Keyboard responder', () => {
103
116
target . keyup ( ) ;
104
117
expect ( onKeyUpInner ) . toBeCalled ( ) ;
105
118
expect ( onKeyUpOuter ) . not . toBeCalled ( ) ;
119
+ target . virtualclick ( ) ;
120
+ expect ( onClickInner ) . toBeCalled ( ) ;
121
+ expect ( onClickOuter ) . not . toBeCalled ( ) ;
106
122
} ) ;
107
123
108
124
describe ( 'disabled' , ( ) => {
@@ -128,6 +144,64 @@ describe('Keyboard responder', () => {
128
144
} ) ;
129
145
} ) ;
130
146
147
+ describe ( 'onClick' , ( ) => {
148
+ let onClick , ref ;
149
+
150
+ beforeEach ( ( ) => {
151
+ onClick = jest . fn ( ) ;
152
+ ref = React . createRef ( ) ;
153
+ const Component = ( ) => {
154
+ const listener = useKeyboard ( { onClick} ) ;
155
+ return < div ref = { ref } listeners = { listener } /> ;
156
+ } ;
157
+ ReactDOM . render ( < Component /> , container ) ;
158
+ } ) ;
159
+
160
+ // e.g, "Enter" on link
161
+ test ( 'keyboard click is between key events' , ( ) => {
162
+ const target = createEventTarget ( ref . current ) ;
163
+ target . keydown ( { key : 'Enter' } ) ;
164
+ target . keyup ( { key : 'Enter' } ) ;
165
+ target . virtualclick ( ) ;
166
+ expect ( onClick ) . toHaveBeenCalledTimes ( 1 ) ;
167
+ expect ( onClick ) . toHaveBeenCalledWith (
168
+ expect . objectContaining ( {
169
+ altKey : false ,
170
+ ctrlKey : false ,
171
+ defaultPrevented : false ,
172
+ metaKey : false ,
173
+ pointerType : 'keyboard' ,
174
+ shiftKey : false ,
175
+ target : target . node ,
176
+ timeStamp : expect . any ( Number ) ,
177
+ type : 'keyboard:click' ,
178
+ } ) ,
179
+ ) ;
180
+ } ) ;
181
+
182
+ // e.g., "Spacebar" on button
183
+ test ( 'keyboard click is after key events' , ( ) => {
184
+ const target = createEventTarget ( ref . current ) ;
185
+ target . keydown ( { key : 'Enter' } ) ;
186
+ target . keyup ( { key : 'Enter' } ) ;
187
+ target . virtualclick ( ) ;
188
+ expect ( onClick ) . toHaveBeenCalledTimes ( 1 ) ;
189
+ expect ( onClick ) . toHaveBeenCalledWith (
190
+ expect . objectContaining ( {
191
+ altKey : false ,
192
+ ctrlKey : false ,
193
+ defaultPrevented : false ,
194
+ metaKey : false ,
195
+ pointerType : 'keyboard' ,
196
+ shiftKey : false ,
197
+ target : target . node ,
198
+ timeStamp : expect . any ( Number ) ,
199
+ type : 'keyboard:click' ,
200
+ } ) ,
201
+ ) ;
202
+ } ) ;
203
+ } ) ;
204
+
131
205
describe ( 'onKeyDown' , ( ) => {
132
206
let onKeyDown , ref ;
133
207
@@ -271,7 +345,7 @@ describe('Keyboard responder', () => {
271
345
272
346
const target = createEventTarget ( ref . current ) ;
273
347
target . keydown ( { key : 'Tab' , preventDefault} ) ;
274
- target . click ( { preventDefault : preventDefaultClick } ) ;
348
+ target . virtualclick ( { preventDefault : preventDefaultClick } ) ;
275
349
276
350
expect ( onKeyDown ) . toHaveBeenCalledTimes ( 1 ) ;
277
351
expect ( preventDefault ) . toBeCalled ( ) ;
@@ -293,7 +367,10 @@ describe('Keyboard responder', () => {
293
367
294
368
const target = createEventTarget ( ref . current ) ;
295
369
target . keydown ( { key : 'Tab' , preventDefault, shiftKey : true } ) ;
296
- target . click ( { preventDefault : preventDefaultClick , shiftKey : true } ) ;
370
+ target . virtualclick ( {
371
+ preventDefault : preventDefaultClick ,
372
+ shiftKey : true ,
373
+ } ) ;
297
374
298
375
expect ( onKeyDown ) . toHaveBeenCalledTimes ( 1 ) ;
299
376
expect ( preventDefault ) . toBeCalled ( ) ;
@@ -316,7 +393,10 @@ describe('Keyboard responder', () => {
316
393
317
394
const target = createEventTarget ( ref . current ) ;
318
395
target . keydown ( { key : 'Tab' , preventDefault, shiftKey : false } ) ;
319
- target . click ( { preventDefault : preventDefaultClick , shiftKey : false } ) ;
396
+ target . virtualclick ( {
397
+ preventDefault : preventDefaultClick ,
398
+ shiftKey : false ,
399
+ } ) ;
320
400
321
401
expect ( onKeyDown ) . toHaveBeenCalledTimes ( 1 ) ;
322
402
expect ( preventDefault ) . not . toBeCalled ( ) ;
0 commit comments