1
- /*
2
1
import {
3
2
DOWN_ARROW ,
4
3
END ,
@@ -33,6 +32,7 @@ import {MatCalendar} from './calendar';
33
32
import { MatCalendarBody } from './calendar-body' ;
34
33
import { MatDatepickerIntl } from './datepicker-intl' ;
35
34
import { MatMonthView } from './month-view' ;
35
+ import { MatMultiYearView } from './multi-year-view' ;
36
36
import { MatYearView } from './year-view' ;
37
37
38
38
@@ -48,6 +48,7 @@ describe('MatCalendar', () => {
48
48
MatCalendarBody ,
49
49
MatMonthView ,
50
50
MatYearView ,
51
+ MatMultiYearView ,
51
52
52
53
// Test components.
53
54
StandardCalendar ,
@@ -86,22 +87,22 @@ describe('MatCalendar', () => {
86
87
} ) ;
87
88
88
89
it ( 'should be in month view with specified month active' , ( ) => {
89
- expect(calendarInstance._monthView ).toBe(true, 'should be in month view ');
90
+ expect ( calendarInstance . _currentView ) . toBe ( ' month') ;
90
91
expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , JAN , 31 ) ) ;
91
92
} ) ;
92
93
93
94
it ( 'should toggle view when period clicked' , ( ) => {
94
- expect(calendarInstance._monthView ).toBe(true, 'should be in month view ');
95
+ expect ( calendarInstance . _currentView ) . toBe ( ' month') ;
95
96
96
97
periodButton . click ( ) ;
97
98
fixture . detectChanges ( ) ;
98
99
99
- expect(calendarInstance._monthView ).toBe(false, 'should be in year view ');
100
+ expect ( calendarInstance . _currentView ) . toBe ( 'multi- year') ;
100
101
101
102
periodButton . click ( ) ;
102
103
fixture . detectChanges ( ) ;
103
104
104
- expect(calendarInstance._monthView ).toBe(true, 'should be in month view ');
105
+ expect ( calendarInstance . _currentView ) . toBe ( ' month') ;
105
106
} ) ;
106
107
107
108
it ( 'should go to next and previous month' , ( ) => {
@@ -122,9 +123,14 @@ describe('MatCalendar', () => {
122
123
periodButton . click ( ) ;
123
124
fixture . detectChanges ( ) ;
124
125
125
- expect(calendarInstance._monthView ).toBe(false, 'should be in year view ');
126
+ expect ( calendarInstance . _currentView ) . toBe ( 'multi- year') ;
126
127
expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , JAN , 31 ) ) ;
127
128
129
+ ( < HTMLElement > calendarElement . querySelector ( '.mat-calendar-body-active' ) ) . click ( ) ;
130
+ fixture . detectChanges ( ) ;
131
+
132
+ expect ( calendarInstance . _currentView ) . toBe ( 'year' ) ;
133
+
128
134
nextButton . click ( ) ;
129
135
fixture . detectChanges ( ) ;
130
136
@@ -136,19 +142,26 @@ describe('MatCalendar', () => {
136
142
expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , JAN , 31 ) ) ;
137
143
} ) ;
138
144
139
- 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 ' , ( ) => {
140
146
periodButton . click ( ) ;
141
147
fixture . detectChanges ( ) ;
142
148
143
- expect(calendarInstance._monthView ).toBe(false, 'should be in year view ');
149
+ expect ( calendarInstance . _currentView ) . toBe ( 'multi- year') ;
144
150
expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , JAN , 31 ) ) ;
145
151
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
+
146
159
let monthCells = calendarElement . querySelectorAll ( '.mat-calendar-body-cell' ) ;
147
160
( monthCells [ monthCells . length - 1 ] as HTMLElement ) . click ( ) ;
148
161
fixture . detectChanges ( ) ;
149
162
150
- expect(calendarInstance._monthView ).toBe(true, 'should be in month view ');
151
- 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 ) ) ;
152
165
expect ( testComponent . selected ) . toBeFalsy ( 'no date should be selected yet' ) ;
153
166
} ) ;
154
167
@@ -157,7 +170,7 @@ describe('MatCalendar', () => {
157
170
( monthCells [ monthCells . length - 1 ] as HTMLElement ) . click ( ) ;
158
171
fixture . detectChanges ( ) ;
159
172
160
- expect(calendarInstance._monthView ).toBe(true, 'should be in month view ');
173
+ expect ( calendarInstance . _currentView ) . toBe ( ' month') ;
161
174
expect ( testComponent . selected ) . toEqual ( new Date ( 2017 , JAN , 31 ) ) ;
162
175
} ) ;
163
176
@@ -166,11 +179,11 @@ describe('MatCalendar', () => {
166
179
const button = fixture . debugElement . nativeElement
167
180
. querySelector ( '.mat-calendar-period-button' ) ;
168
181
169
- intl.switchToYearViewLabel = 'Go to year view?';
182
+ intl . switchToMultiYearViewLabel = 'Go to multi- year view?' ;
170
183
intl . changes . next ( ) ;
171
184
fixture . detectChanges ( ) ;
172
185
173
- expect(button.getAttribute('aria-label')).toBe('Go to year view?');
186
+ expect ( button . getAttribute ( 'aria-label' ) ) . toBe ( 'Go to multi- year view?' ) ;
174
187
} ) ) ;
175
188
176
189
describe ( 'a11y' , ( ) => {
@@ -312,7 +325,12 @@ describe('MatCalendar', () => {
312
325
dispatchMouseEvent ( periodButton , 'click' ) ;
313
326
fixture . detectChanges ( ) ;
314
327
315
- 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' ) ;
316
334
} ) ;
317
335
318
336
it ( 'should decrement month on left arrow press' , ( ) => {
@@ -449,7 +467,7 @@ describe('MatCalendar', () => {
449
467
dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , ENTER ) ;
450
468
fixture . detectChanges ( ) ;
451
469
452
- expect(calendarInstance._monthView ).toBe(true );
470
+ expect ( calendarInstance . _currentView ) . toBe ( 'month' ) ;
453
471
expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , FEB , 28 ) ) ;
454
472
expect ( testComponent . selected ) . toBeUndefined ( ) ;
455
473
} ) ;
@@ -558,6 +576,9 @@ describe('MatCalendar', () => {
558
576
periodButton . click ( ) ;
559
577
fixture . detectChanges ( ) ;
560
578
579
+ ( < HTMLElement > calendarElement . querySelector ( '.mat-calendar-body-active' ) ) . click ( ) ;
580
+ fixture . detectChanges ( ) ;
581
+
561
582
spyOn ( calendarInstance . yearView , '_init' ) . and . callThrough ( ) ;
562
583
563
584
testComponent . minDate = new Date ( 2017 , NOV , 1 ) ;
@@ -573,6 +594,9 @@ describe('MatCalendar', () => {
573
594
periodButton . click ( ) ;
574
595
fixture . detectChanges ( ) ;
575
596
597
+ ( < HTMLElement > calendarElement . querySelector ( '.mat-calendar-body-active' ) ) . click ( ) ;
598
+ fixture . detectChanges ( ) ;
599
+
576
600
spyOn ( calendarInstance . yearView , '_init' ) . and . callThrough ( ) ;
577
601
578
602
testComponent . maxDate = new Date ( 2017 , DEC , 1 ) ;
@@ -624,7 +648,7 @@ describe('MatCalendar', () => {
624
648
} ) ;
625
649
626
650
it ( 'should not allow selection of disabled date in month view' , ( ) => {
627
- expect(calendarInstance._monthView ).toBe(true );
651
+ expect ( calendarInstance . _currentView ) . toBe ( 'month' ) ;
628
652
expect ( calendarInstance . _activeDate ) . toEqual ( new Date ( 2017 , JAN , 1 ) ) ;
629
653
630
654
dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , ENTER ) ;
@@ -639,15 +663,18 @@ describe('MatCalendar', () => {
639
663
dispatchMouseEvent ( periodButton , 'click' ) ;
640
664
fixture . detectChanges ( ) ;
641
665
666
+ ( < HTMLElement > calendarElement . querySelector ( '.mat-calendar-body-active' ) ) . click ( ) ;
667
+ fixture . detectChanges ( ) ;
668
+
642
669
calendarInstance . _activeDate = new Date ( 2017 , NOV , 1 ) ;
643
670
fixture . detectChanges ( ) ;
644
671
645
- expect(calendarInstance._monthView ).toBe(false );
672
+ expect ( calendarInstance . _currentView ) . toBe ( 'year' ) ;
646
673
647
674
dispatchKeyboardEvent ( calendarBodyEl , 'keydown' , ENTER ) ;
648
675
fixture . detectChanges ( ) ;
649
676
650
- expect(calendarInstance._monthView ).toBe(true );
677
+ expect ( calendarInstance . _currentView ) . toBe ( 'month' ) ;
651
678
expect ( testComponent . selected ) . toBeUndefined ( ) ;
652
679
} ) ;
653
680
} ) ;
@@ -690,4 +717,3 @@ class CalendarWithDateFilter {
690
717
return date . getDate ( ) % 2 == 0 && date . getMonth ( ) != NOV ;
691
718
}
692
719
}
693
- */
0 commit comments