1
- import { ESCAPE } from '@angular/cdk/keycodes' ;
1
+ import { ENTER , ESCAPE , RIGHT_ARROW } from '@angular/cdk/keycodes' ;
2
2
import { OverlayContainer } from '@angular/cdk/overlay' ;
3
3
import {
4
4
createKeyboardEvent ,
5
5
dispatchEvent ,
6
6
dispatchFakeEvent ,
7
+ dispatchKeyboardEvent ,
7
8
dispatchMouseEvent ,
8
9
} from '@angular/cdk/testing' ;
9
10
import { Component , ViewChild } from '@angular/core' ;
@@ -183,7 +184,7 @@ describe('MatDatepicker', () => {
183
184
} ) ;
184
185
} ) ;
185
186
186
- it ( 'setting selected should update input and close calendar' , ( ) => {
187
+ it ( 'setting selected via click should update input and close calendar' , ( ) => {
187
188
testComponent . touch = true ;
188
189
fixture . detectChanges ( ) ;
189
190
@@ -203,8 +204,31 @@ describe('MatDatepicker', () => {
203
204
} ) ;
204
205
} ) ;
205
206
207
+ it ( 'setting selected via enter press should update input and close calendar' , ( ) => {
208
+ testComponent . touch = true ;
209
+ fixture . detectChanges ( ) ;
210
+
211
+ testComponent . datepicker . open ( ) ;
212
+ fixture . detectChanges ( ) ;
213
+
214
+ expect ( document . querySelector ( 'mat-dialog-container' ) ) . not . toBeNull ( ) ;
215
+ expect ( testComponent . datepickerInput . value ) . toEqual ( new Date ( 2020 , JAN , 1 ) ) ;
216
+
217
+ let calendarBodyEl = document . querySelector ( '.mat-calendar-content' ) as HTMLElement ;
218
+
219
+ dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , RIGHT_ARROW ) ;
220
+ fixture . detectChanges ( ) ;
221
+ dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , ENTER ) ;
222
+ fixture . detectChanges ( ) ;
223
+
224
+ fixture . whenStable ( ) . then ( ( ) => {
225
+ expect ( document . querySelector ( 'mat-dialog-container' ) ) . toBeNull ( ) ;
226
+ expect ( testComponent . datepickerInput . value ) . toEqual ( new Date ( 2020 , JAN , 2 ) ) ;
227
+ } ) ;
228
+ } ) ;
229
+
206
230
it ( 'clicking the currently selected date should close the calendar ' +
207
- 'without firing selectedChanged' , ( ) => {
231
+ 'without firing selectedChanged' , ( ) => {
208
232
const selectedChangedSpy =
209
233
spyOn ( testComponent . datepicker . selectedChanged , 'emit' ) . and . callThrough ( ) ;
210
234
for ( let changeCount = 1 ; changeCount < 3 ; changeCount ++ ) {
@@ -227,6 +251,28 @@ describe('MatDatepicker', () => {
227
251
} ) ;
228
252
} ) ;
229
253
254
+ it ( 'pressing enter on the currently selected date should close the calendar without ' +
255
+ 'firing selectedChanged' , ( ) => {
256
+ const selectedChangedSpy =
257
+ spyOn ( testComponent . datepicker . selectedChanged , 'emit' ) . and . callThrough ( ) ;
258
+
259
+ testComponent . datepicker . open ( ) ;
260
+ fixture . detectChanges ( ) ;
261
+
262
+ let calendarBodyEl = document . querySelector ( '.mat-calendar-content' ) as HTMLElement ;
263
+ expect ( calendarBodyEl ) . not . toBeNull ( ) ;
264
+ expect ( testComponent . datepickerInput . value ) . toEqual ( new Date ( 2020 , JAN , 1 ) ) ;
265
+
266
+ dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , ENTER ) ;
267
+ fixture . detectChanges ( ) ;
268
+
269
+ fixture . whenStable ( ) . then ( ( ) => {
270
+ expect ( selectedChangedSpy . calls . count ( ) ) . toEqual ( 0 ) ;
271
+ expect ( document . querySelector ( 'mat-dialog-container' ) ) . toBeNull ( ) ;
272
+ expect ( testComponent . datepickerInput . value ) . toEqual ( new Date ( 2020 , JAN , 1 ) ) ;
273
+ } ) ;
274
+ } ) ;
275
+
230
276
it ( 'startAt should fallback to input value' , ( ) => {
231
277
expect ( testComponent . datepicker . startAt ) . toEqual ( new Date ( 2020 , JAN , 1 ) ) ;
232
278
} ) ;
0 commit comments