@@ -32,7 +32,7 @@ describe('MdDatepicker', () => {
32
32
declarations : [
33
33
DatepickerWithFilterAndValidation ,
34
34
DatepickerWithFormControl ,
35
- DatepickerWithMinAndMax ,
35
+ DatepickerWithMinAndMaxValidation ,
36
36
DatepickerWithNgModel ,
37
37
DatepickerWithStartAt ,
38
38
DatepickerWithToggle ,
@@ -413,12 +413,12 @@ describe('MdDatepicker', () => {
413
413
} ) ;
414
414
} ) ;
415
415
416
- describe ( 'datepicker with min and max dates' , ( ) => {
417
- let fixture : ComponentFixture < DatepickerWithMinAndMax > ;
418
- let testComponent : DatepickerWithMinAndMax ;
416
+ describe ( 'datepicker with min and max dates and validation ' , ( ) => {
417
+ let fixture : ComponentFixture < DatepickerWithMinAndMaxValidation > ;
418
+ let testComponent : DatepickerWithMinAndMaxValidation ;
419
419
420
420
beforeEach ( async ( ( ) => {
421
- fixture = TestBed . createComponent ( DatepickerWithMinAndMax ) ;
421
+ fixture = TestBed . createComponent ( DatepickerWithMinAndMaxValidation ) ;
422
422
fixture . detectChanges ( ) ;
423
423
424
424
testComponent = fixture . componentInstance ;
@@ -433,6 +433,66 @@ describe('MdDatepicker', () => {
433
433
expect ( testComponent . datepicker . _minDate ) . toEqual ( new Date ( 2010 , JAN , 1 ) ) ;
434
434
expect ( testComponent . datepicker . _maxDate ) . toEqual ( new Date ( 2020 , JAN , 1 ) ) ;
435
435
} ) ;
436
+
437
+ it ( 'should mark invalid when value is before min' , ( ) => {
438
+ testComponent . date = new Date ( 2009 , DEC , 31 ) ;
439
+ fixture . detectChanges ( ) ;
440
+
441
+ fixture . whenStable ( ) . then ( ( ) => {
442
+ fixture . detectChanges ( ) ;
443
+
444
+ expect ( fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement . classList )
445
+ . toContain ( 'ng-invalid' ) ;
446
+ } ) ;
447
+ } ) ;
448
+
449
+ it ( 'should mark invalid when value is after max' , ( ) => {
450
+ testComponent . date = new Date ( 2020 , JAN , 2 ) ;
451
+ fixture . detectChanges ( ) ;
452
+
453
+ fixture . whenStable ( ) . then ( ( ) => {
454
+ fixture . detectChanges ( ) ;
455
+
456
+ expect ( fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement . classList )
457
+ . toContain ( 'ng-invalid' ) ;
458
+ } ) ;
459
+ } ) ;
460
+
461
+ it ( 'should not mark invalid when value equals min' , ( ) => {
462
+ testComponent . date = testComponent . datepicker . _minDate ;
463
+ fixture . detectChanges ( ) ;
464
+
465
+ fixture . whenStable ( ) . then ( ( ) => {
466
+ fixture . detectChanges ( ) ;
467
+
468
+ expect ( fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement . classList )
469
+ . not . toContain ( 'ng-invalid' ) ;
470
+ } ) ;
471
+ } ) ;
472
+
473
+ it ( 'should not mark invalid when value equals max' , ( ) => {
474
+ testComponent . date = testComponent . datepicker . _maxDate ;
475
+ fixture . detectChanges ( ) ;
476
+
477
+ fixture . whenStable ( ) . then ( ( ) => {
478
+ fixture . detectChanges ( ) ;
479
+
480
+ expect ( fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement . classList )
481
+ . not . toContain ( 'ng-invalid' ) ;
482
+ } ) ;
483
+ } ) ;
484
+
485
+ it ( 'should not mark invalid when value is between min and max' , ( ) => {
486
+ testComponent . date = new Date ( 2010 , JAN , 2 ) ;
487
+ fixture . detectChanges ( ) ;
488
+
489
+ fixture . whenStable ( ) . then ( ( ) => {
490
+ fixture . detectChanges ( ) ;
491
+
492
+ expect ( fixture . debugElement . query ( By . css ( 'input' ) ) . nativeElement . classList )
493
+ . not . toContain ( 'ng-invalid' ) ;
494
+ } ) ;
495
+ } ) ;
436
496
} ) ;
437
497
438
498
describe ( 'datepicker with filter and validation' , ( ) => {
@@ -606,14 +666,16 @@ class InputContainerDatepicker {
606
666
607
667
@Component ( {
608
668
template : `
609
- <input [mdDatepicker]="d" [min]="minDate" [max]="maxDate">
669
+ <input [mdDatepicker]="d" [(ngModel)]="date" [min]="minDate" [max]="maxDate">
670
+ <button [mdDatepickerToggle]="d"></button>
610
671
<md-datepicker #d></md-datepicker>
611
672
` ,
612
673
} )
613
- class DatepickerWithMinAndMax {
674
+ class DatepickerWithMinAndMaxValidation {
675
+ @ViewChild ( 'd' ) datepicker : MdDatepicker < Date > ;
676
+ date : Date ;
614
677
minDate = new Date ( 2010 , JAN , 1 ) ;
615
678
maxDate = new Date ( 2020 , JAN , 1 ) ;
616
- @ViewChild ( 'd' ) datepicker : MdDatepicker < Date > ;
617
679
}
618
680
619
681
0 commit comments