@@ -28,7 +28,6 @@ import {MatDatepickerInput} from './datepicker-input';
28
28
import { MatDatepickerToggle } from './datepicker-toggle' ;
29
29
import { MatDatepickerIntl , MatDatepickerModule } from './index' ;
30
30
31
-
32
31
describe ( 'MatDatepicker' , ( ) => {
33
32
const SUPPORTS_INTL = typeof Intl != 'undefined' ;
34
33
@@ -113,7 +112,7 @@ describe('MatDatepicker', () => {
113
112
. not . toBeNull ( ) ;
114
113
} ) ;
115
114
116
- it ( 'should open datepicker if opened input is set to true' , async ( ( ) => {
115
+ it ( 'should open datepicker if opened input is set to true' , ( ) => {
117
116
testComponent . opened = true ;
118
117
fixture . detectChanges ( ) ;
119
118
@@ -122,10 +121,8 @@ describe('MatDatepicker', () => {
122
121
testComponent . opened = false ;
123
122
fixture . detectChanges ( ) ;
124
123
125
- fixture . whenStable ( ) . then ( ( ) => {
126
- expect ( document . querySelector ( '.mat-datepicker-content' ) ) . toBeNull ( ) ;
127
- } ) ;
128
- } ) ) ;
124
+ expect ( document . querySelector ( '.mat-datepicker-content' ) ) . toBeNull ( ) ;
125
+ } ) ;
129
126
130
127
it ( 'open in disabled mode should not open the calendar' , ( ) => {
131
128
testComponent . disabled = true ;
@@ -165,9 +162,7 @@ describe('MatDatepicker', () => {
165
162
testComponent . datepicker . close ( ) ;
166
163
fixture . detectChanges ( ) ;
167
164
168
- fixture . whenStable ( ) . then ( ( ) => {
169
- expect ( parseInt ( getComputedStyle ( popup ) . height as string ) ) . toBe ( 0 ) ;
170
- } ) ;
165
+ expect ( parseInt ( getComputedStyle ( popup ) . height as string ) ) . toBe ( 0 ) ;
171
166
} ) ;
172
167
173
168
it ( 'should close the popup when pressing ESCAPE' , ( ) => {
@@ -191,7 +186,7 @@ describe('MatDatepicker', () => {
191
186
. toBe ( true , 'Expected default ESCAPE action to be prevented.' ) ;
192
187
} ) ;
193
188
194
- it ( 'close should close dialog' , ( ) => {
189
+ it ( 'close should close dialog' , async ( ( ) => {
195
190
testComponent . touch = true ;
196
191
fixture . detectChanges ( ) ;
197
192
@@ -206,9 +201,9 @@ describe('MatDatepicker', () => {
206
201
fixture . whenStable ( ) . then ( ( ) => {
207
202
expect ( document . querySelector ( 'mat-dialog-container' ) ) . toBeNull ( ) ;
208
203
} ) ;
209
- } ) ;
204
+ } ) ) ;
210
205
211
- it ( 'setting selected should update input and close calendar' , ( ) => {
206
+ it ( 'setting selected should update input and close calendar' , async ( ( ) => {
212
207
testComponent . touch = true ;
213
208
fixture . detectChanges ( ) ;
214
209
@@ -226,12 +221,13 @@ describe('MatDatepicker', () => {
226
221
expect ( document . querySelector ( 'mat-dialog-container' ) ) . toBeNull ( ) ;
227
222
expect ( testComponent . datepickerInput . value ) . toEqual ( new Date ( 2020 , JAN , 2 ) ) ;
228
223
} ) ;
229
- } ) ;
224
+ } ) ) ;
230
225
231
226
it ( 'clicking the currently selected date should close the calendar ' +
232
227
'without firing selectedChanged' , ( ) => {
233
228
const selectedChangedSpy =
234
229
spyOn ( testComponent . datepicker . selectedChanged , 'emit' ) . and . callThrough ( ) ;
230
+
235
231
for ( let changeCount = 1 ; changeCount < 3 ; changeCount ++ ) {
236
232
const currentDay = changeCount ;
237
233
testComponent . datepicker . open ( ) ;
@@ -245,11 +241,9 @@ describe('MatDatepicker', () => {
245
241
fixture . detectChanges ( ) ;
246
242
}
247
243
248
- fixture . whenStable ( ) . then ( ( ) => {
249
- expect ( selectedChangedSpy . calls . count ( ) ) . toEqual ( 1 ) ;
250
- expect ( document . querySelector ( 'mat-dialog-container' ) ) . toBeNull ( ) ;
251
- expect ( testComponent . datepickerInput . value ) . toEqual ( new Date ( 2020 , JAN , 2 ) ) ;
252
- } ) ;
244
+ expect ( selectedChangedSpy . calls . count ( ) ) . toEqual ( 1 ) ;
245
+ expect ( document . querySelector ( 'mat-dialog-container' ) ) . toBeNull ( ) ;
246
+ expect ( testComponent . datepickerInput . value ) . toEqual ( new Date ( 2020 , JAN , 2 ) ) ;
253
247
} ) ;
254
248
255
249
it ( 'startAt should fallback to input value' , ( ) => {
@@ -493,7 +487,7 @@ describe('MatDatepicker', () => {
493
487
expect ( inputEl . classList ) . toContain ( 'ng-touched' ) ;
494
488
} ) ;
495
489
496
- it ( 'should mark input touched on calendar selection' , ( ) => {
490
+ it ( 'should mark input touched on calendar selection' , async ( ( ) => {
497
491
let inputEl = fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement ;
498
492
499
493
expect ( inputEl . classList ) . toContain ( 'ng-untouched' ) ;
@@ -506,7 +500,7 @@ describe('MatDatepicker', () => {
506
500
507
501
expect ( inputEl . classList ) . toContain ( 'ng-touched' ) ;
508
502
} ) ;
509
- } ) ;
503
+ } ) ) ;
510
504
} ) ;
511
505
512
506
describe ( 'datepicker with formControl' , ( ) => {
@@ -716,7 +710,7 @@ describe('MatDatepicker', () => {
716
710
expect ( testComponent . datepicker . _maxDate ) . toEqual ( new Date ( 2020 , JAN , 1 ) ) ;
717
711
} ) ;
718
712
719
- it ( 'should mark invalid when value is before min' , ( ) => {
713
+ it ( 'should mark invalid when value is before min' , async ( ( ) => {
720
714
testComponent . date = new Date ( 2009 , DEC , 31 ) ;
721
715
fixture . detectChanges ( ) ;
722
716
@@ -726,9 +720,9 @@ describe('MatDatepicker', () => {
726
720
expect ( fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement . classList )
727
721
. toContain ( 'ng-invalid' ) ;
728
722
} ) ;
729
- } ) ;
723
+ } ) ) ;
730
724
731
- it ( 'should mark invalid when value is after max' , ( ) => {
725
+ it ( 'should mark invalid when value is after max' , async ( ( ) => {
732
726
testComponent . date = new Date ( 2020 , JAN , 2 ) ;
733
727
fixture . detectChanges ( ) ;
734
728
@@ -738,9 +732,9 @@ describe('MatDatepicker', () => {
738
732
expect ( fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement . classList )
739
733
. toContain ( 'ng-invalid' ) ;
740
734
} ) ;
741
- } ) ;
735
+ } ) ) ;
742
736
743
- it ( 'should not mark invalid when value equals min' , ( ) => {
737
+ it ( 'should not mark invalid when value equals min' , async ( ( ) => {
744
738
testComponent . date = testComponent . datepicker . _minDate ;
745
739
fixture . detectChanges ( ) ;
746
740
@@ -750,9 +744,9 @@ describe('MatDatepicker', () => {
750
744
expect ( fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement . classList )
751
745
. not . toContain ( 'ng-invalid' ) ;
752
746
} ) ;
753
- } ) ;
747
+ } ) ) ;
754
748
755
- it ( 'should not mark invalid when value equals max' , ( ) => {
749
+ it ( 'should not mark invalid when value equals max' , async ( ( ) => {
756
750
testComponent . date = testComponent . datepicker . _maxDate ;
757
751
fixture . detectChanges ( ) ;
758
752
@@ -762,9 +756,9 @@ describe('MatDatepicker', () => {
762
756
expect ( fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement . classList )
763
757
. not . toContain ( 'ng-invalid' ) ;
764
758
} ) ;
765
- } ) ;
759
+ } ) ) ;
766
760
767
- it ( 'should not mark invalid when value is between min and max' , ( ) => {
761
+ it ( 'should not mark invalid when value is between min and max' , async ( ( ) => {
768
762
testComponent . date = new Date ( 2010 , JAN , 2 ) ;
769
763
fixture . detectChanges ( ) ;
770
764
@@ -774,7 +768,7 @@ describe('MatDatepicker', () => {
774
768
expect ( fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement . classList )
775
769
. not . toContain ( 'ng-invalid' ) ;
776
770
} ) ;
777
- } ) ;
771
+ } ) ) ;
778
772
} ) ;
779
773
780
774
describe ( 'datepicker with filter and validation' , ( ) => {
@@ -1092,17 +1086,23 @@ describe('MatDatepicker', () => {
1092
1086
input = fixture . nativeElement . querySelector ( 'input' ) as HTMLInputElement ;
1093
1087
} ) ) ;
1094
1088
1095
- it ( 'should have the correct input value even when inverted date format' , ( ) => {
1089
+ it ( 'should have the correct input value even when inverted date format' , async ( ( ) => {
1090
+ if ( typeof Intl === 'undefined' ) {
1091
+ // Skip this test if the internationalization API is not supported in the current
1092
+ // browser. Browsers like Safari 9 do not support the "Intl" API.
1093
+ return ;
1094
+ }
1095
+
1096
1096
let selected = new Date ( 2017 , SEP , 1 ) ;
1097
1097
testComponent . date = selected ;
1098
1098
fixture . detectChanges ( ) ;
1099
1099
1100
1100
fixture . whenStable ( ) . then ( ( ) => {
1101
1101
fixture . detectChanges ( ) ;
1102
- expect ( input . value ) . toBe ( '01.09 .2017' ) ;
1102
+ expect ( input . value ) . toBe ( '1.9 .2017' ) ;
1103
1103
expect ( testComponent . datepickerInput . value ) . toBe ( selected ) ;
1104
1104
} ) ;
1105
- } ) ;
1105
+ } ) ) ;
1106
1106
} ) ;
1107
1107
} ) ;
1108
1108
0 commit comments