1- /*
21import {
32 DOWN_ARROW ,
43 END ,
@@ -21,9 +20,10 @@ import {
2120 JUL ,
2221 JUN ,
2322 MAR ,
24- MAY,
2523 MatNativeDateModule ,
24+ MAY ,
2625 NOV ,
26+ OCT ,
2727 SEP ,
2828} from '@angular/material/core' ;
2929import { By } from '@angular/platform-browser' ;
@@ -32,6 +32,7 @@ import {MatCalendar} from './calendar';
3232import { MatCalendarBody } from './calendar-body' ;
3333import { MatDatepickerIntl } from './datepicker-intl' ;
3434import { MatMonthView } from './month-view' ;
35+ import { MatMultiYearView } from './multi-year-view' ;
3536import { MatYearView } from './year-view' ;
3637
3738
@@ -47,6 +48,7 @@ describe('MatCalendar', () => {
4748 MatCalendarBody ,
4849 MatMonthView ,
4950 MatYearView ,
51+ MatMultiYearView ,
5052
5153 // Test components.
5254 StandardCalendar ,
@@ -85,22 +87,22 @@ describe('MatCalendar', () => {
8587 } ) ;
8688
8789 it ( 'should be in month view with specified month active' , ( ) => {
88- expect(calendarInstance._monthView ).toBe(true, 'should be in month view ');
90+ expect ( calendarInstance . _currentView ) . toBe ( ' month') ;
8991 expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , JAN , 31 ) ) ;
9092 } ) ;
9193
9294 it ( 'should toggle view when period clicked' , ( ) => {
93- expect(calendarInstance._monthView ).toBe(true, 'should be in month view ');
95+ expect ( calendarInstance . _currentView ) . toBe ( ' month') ;
9496
9597 periodButton . click ( ) ;
9698 fixture . detectChanges ( ) ;
9799
98- expect(calendarInstance._monthView ).toBe(false, 'should be in year view ');
100+ expect ( calendarInstance . _currentView ) . toBe ( 'multi- year') ;
99101
100102 periodButton . click ( ) ;
101103 fixture . detectChanges ( ) ;
102104
103- expect(calendarInstance._monthView ).toBe(true, 'should be in month view ');
105+ expect ( calendarInstance . _currentView ) . toBe ( ' month') ;
104106 } ) ;
105107
106108 it ( 'should go to next and previous month' , ( ) => {
@@ -121,9 +123,14 @@ describe('MatCalendar', () => {
121123 periodButton . click ( ) ;
122124 fixture . detectChanges ( ) ;
123125
124- expect(calendarInstance._monthView ).toBe(false, 'should be in year view ');
126+ expect ( calendarInstance . _currentView ) . toBe ( 'multi- year') ;
125127 expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , JAN , 31 ) ) ;
126128
129+ ( < HTMLElement > calendarElement . querySelector ( '.mat-calendar-body-active' ) ) . click ( ) ;
130+ fixture . detectChanges ( ) ;
131+
132+ expect ( calendarInstance . _currentView ) . toBe ( 'year' ) ;
133+
127134 nextButton . click ( ) ;
128135 fixture . detectChanges ( ) ;
129136
@@ -135,19 +142,26 @@ describe('MatCalendar', () => {
135142 expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , JAN , 31 ) ) ;
136143 } ) ;
137144
138- it('should go back to month view after selecting month in year view ', () => {
145+ it ( 'should go back to month view after selecting year and month ' , ( ) => {
139146 periodButton . click ( ) ;
140147 fixture . detectChanges ( ) ;
141148
142- expect(calendarInstance._monthView ).toBe(false, 'should be in year view ');
149+ expect ( calendarInstance . _currentView ) . toBe ( 'multi- year') ;
143150 expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , JAN , 31 ) ) ;
144151
152+ let yearCells = calendarElement . querySelectorAll ( '.mat-calendar-body-cell' ) ;
153+ ( < HTMLElement > yearCells [ 0 ] ) . click ( ) ;
154+ fixture . detectChanges ( ) ;
155+
156+ expect ( calendarInstance . _currentView ) . toBe ( 'year' ) ;
157+ expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2016 , JAN , 31 ) ) ;
158+
145159 let monthCells = calendarElement . querySelectorAll ( '.mat-calendar-body-cell' ) ;
146160 ( monthCells [ monthCells . length - 1 ] as HTMLElement ) . click ( ) ;
147161 fixture . detectChanges ( ) ;
148162
149- expect(calendarInstance._monthView ).toBe(true, 'should be in month view ');
150- expect(calendarInstance._activeDate).toEqual(new Date(2017 , DEC, 31));
163+ expect ( calendarInstance . _currentView ) . toBe ( ' month') ;
164+ expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2016 , DEC , 31 ) ) ;
151165 expect ( testComponent . selected ) . toBeFalsy ( 'no date should be selected yet' ) ;
152166 } ) ;
153167
@@ -156,7 +170,7 @@ describe('MatCalendar', () => {
156170 ( monthCells [ monthCells . length - 1 ] as HTMLElement ) . click ( ) ;
157171 fixture . detectChanges ( ) ;
158172
159- expect(calendarInstance._monthView ).toBe(true, 'should be in month view ');
173+ expect ( calendarInstance . _currentView ) . toBe ( ' month') ;
160174 expect ( testComponent . selected ) . toEqual ( new Date ( 2017 , JAN , 31 ) ) ;
161175 } ) ;
162176
@@ -165,11 +179,11 @@ describe('MatCalendar', () => {
165179 const button = fixture . debugElement . nativeElement
166180 . querySelector ( '.mat-calendar-period-button' ) ;
167181
168- intl.switchToYearViewLabel = 'Go to year view?';
182+ intl . switchToMultiYearViewLabel = 'Go to multi- year view?' ;
169183 intl . changes . next ( ) ;
170184 fixture . detectChanges ( ) ;
171185
172- expect(button.getAttribute('aria-label')).toBe('Go to year view?');
186+ expect ( button . getAttribute ( 'aria-label' ) ) . toBe ( 'Go to multi- year view?' ) ;
173187 } ) ) ;
174188
175189 describe ( 'a11y' , ( ) => {
@@ -311,7 +325,12 @@ describe('MatCalendar', () => {
311325 dispatchMouseEvent ( periodButton , 'click' ) ;
312326 fixture . detectChanges ( ) ;
313327
314- expect(calendarInstance._monthView).toBe(false);
328+ expect ( calendarInstance . _currentView ) . toBe ( 'multi-year' ) ;
329+
330+ ( < HTMLElement > calendarBodyEl . querySelector ( '.mat-calendar-body-active' ) ) . click ( ) ;
331+ fixture . detectChanges ( ) ;
332+
333+ expect ( calendarInstance . _currentView ) . toBe ( 'year' ) ;
315334 } ) ;
316335
317336 it ( 'should decrement month on left arrow press' , ( ) => {
@@ -342,46 +361,46 @@ describe('MatCalendar', () => {
342361 dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , UP_ARROW ) ;
343362 fixture . detectChanges ( ) ;
344363
345- expect(calendarInstance._activeDate).toEqual(new Date(2016, AUG, 31 ));
364+ expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2016 , SEP , 30 ) ) ;
346365
347366 calendarInstance . _activeDate = new Date ( 2017 , JUL , 1 ) ;
348367 fixture . detectChanges ( ) ;
349368
350369 dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , UP_ARROW ) ;
351370 fixture . detectChanges ( ) ;
352371
353- expect(calendarInstance._activeDate).toEqual(new Date(2016, JUL , 1));
372+ expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , MAR , 1 ) ) ;
354373
355374 calendarInstance . _activeDate = new Date ( 2017 , DEC , 10 ) ;
356375 fixture . detectChanges ( ) ;
357376
358377 dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , UP_ARROW ) ;
359378 fixture . detectChanges ( ) ;
360379
361- expect(calendarInstance._activeDate).toEqual(new Date(2017, MAY , 10));
380+ expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , AUG , 10 ) ) ;
362381 } ) ;
363382
364383 it ( 'should go down a row on down arrow press' , ( ) => {
365384 dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , DOWN_ARROW ) ;
366385 fixture . detectChanges ( ) ;
367386
368- expect(calendarInstance._activeDate).toEqual(new Date(2017, AUG , 31));
387+ expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , MAY , 31 ) ) ;
369388
370389 calendarInstance . _activeDate = new Date ( 2017 , JUN , 1 ) ;
371390 fixture . detectChanges ( ) ;
372391
373392 dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , DOWN_ARROW ) ;
374393 fixture . detectChanges ( ) ;
375394
376- expect(calendarInstance._activeDate).toEqual(new Date(2018, JUN , 1));
395+ expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , OCT , 1 ) ) ;
377396
378397 calendarInstance . _activeDate = new Date ( 2017 , SEP , 30 ) ;
379398 fixture . detectChanges ( ) ;
380399
381400 dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , DOWN_ARROW ) ;
382401 fixture . detectChanges ( ) ;
383402
384- expect(calendarInstance._activeDate).toEqual(new Date(2018, FEB, 28 ));
403+ expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2018 , JAN , 30 ) ) ;
385404 } ) ;
386405
387406 it ( 'should go to first month of the year on home press' , ( ) => {
@@ -448,7 +467,7 @@ describe('MatCalendar', () => {
448467 dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , ENTER ) ;
449468 fixture . detectChanges ( ) ;
450469
451- expect(calendarInstance._monthView ).toBe(true );
470+ expect ( calendarInstance . _currentView ) . toBe ( 'month' ) ;
452471 expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , FEB , 28 ) ) ;
453472 expect ( testComponent . selected ) . toBeUndefined ( ) ;
454473 } ) ;
@@ -557,6 +576,9 @@ describe('MatCalendar', () => {
557576 periodButton . click ( ) ;
558577 fixture . detectChanges ( ) ;
559578
579+ ( < HTMLElement > calendarElement . querySelector ( '.mat-calendar-body-active' ) ) . click ( ) ;
580+ fixture . detectChanges ( ) ;
581+
560582 spyOn ( calendarInstance . yearView , '_init' ) . and . callThrough ( ) ;
561583
562584 testComponent . minDate = new Date ( 2017 , NOV , 1 ) ;
@@ -572,6 +594,9 @@ describe('MatCalendar', () => {
572594 periodButton . click ( ) ;
573595 fixture . detectChanges ( ) ;
574596
597+ ( < HTMLElement > calendarElement . querySelector ( '.mat-calendar-body-active' ) ) . click ( ) ;
598+ fixture . detectChanges ( ) ;
599+
575600 spyOn ( calendarInstance . yearView , '_init' ) . and . callThrough ( ) ;
576601
577602 testComponent . maxDate = new Date ( 2017 , DEC , 1 ) ;
@@ -623,7 +648,7 @@ describe('MatCalendar', () => {
623648 } ) ;
624649
625650 it ( 'should not allow selection of disabled date in month view' , ( ) => {
626- expect(calendarInstance._monthView ).toBe(true );
651+ expect ( calendarInstance . _currentView ) . toBe ( 'month' ) ;
627652 expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , JAN , 1 ) ) ;
628653
629654 dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , ENTER ) ;
@@ -638,15 +663,18 @@ describe('MatCalendar', () => {
638663 dispatchMouseEvent ( periodButton , 'click' ) ;
639664 fixture . detectChanges ( ) ;
640665
666+ ( < HTMLElement > calendarElement . querySelector ( '.mat-calendar-body-active' ) ) . click ( ) ;
667+ fixture . detectChanges ( ) ;
668+
641669 calendarInstance . _activeDate = new Date ( 2017 , NOV , 1 ) ;
642670 fixture . detectChanges ( ) ;
643671
644- expect(calendarInstance._monthView ).toBe(false );
672+ expect ( calendarInstance . _currentView ) . toBe ( 'year' ) ;
645673
646674 dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , ENTER ) ;
647675 fixture . detectChanges ( ) ;
648676
649- expect(calendarInstance._monthView ).toBe(true );
677+ expect ( calendarInstance . _currentView ) . toBe ( 'month' ) ;
650678 expect ( testComponent . selected ) . toBeUndefined ( ) ;
651679 } ) ;
652680 } ) ;
@@ -689,4 +717,3 @@ class CalendarWithDateFilter {
689717 return date . getDate ( ) % 2 == 0 && date . getMonth ( ) != NOV ;
690718 }
691719}
692- */
0 commit comments