fix(calendar): handled case when viewDate and value are set and adjusted test

Author: MonikaKirkova

projects/igniteui-angular/src/lib/calendar/calendar-base.ts

@@ -175,7 +175,11 @@ export class IgxCalendarBaseDirective implements ControlValueAccessor {
      * Sets the date that will be presented in the default view when the component renders.
      */
     public set viewDate(value: Date) {
-        this._viewDate = this.getDateOnly(value);
+        if (this._viewDate) {
+            this.selectedDatesWithoutFocus = value;
+        }
+        const date = this.getDateOnly(value).setDate(1);
+        this._viewDate = new Date(date);
     }
 
     /**

projects/igniteui-angular/src/lib/calendar/calendar.component.spec.ts

@@ -172,7 +172,8 @@ describe('IgxCalendar - ', () => {
         configureTestSuite();
         beforeAll(async(() => {
             TestBed.configureTestingModule({
-                declarations: [IgxCalendarSampleComponent, IgxCalendarRangeComponent, IgxCalendarDisabledSpecialDatesComponent],
+                declarations: [IgxCalendarSampleComponent, IgxCalendarRangeComponent, IgxCalendarDisabledSpecialDatesComponent,
+                IgxCalendarValueComponent],
                 imports: [IgxCalendarModule, FormsModule, NoopAnimationsModule]
             }).compileComponents();
         }));
@@ -290,18 +291,23 @@ describe('IgxCalendar - ', () => {
             });
 
             it('Should show right month when value is set', () => {
+                fixture = TestBed.createComponent(IgxCalendarValueComponent);
+                fixture.detectChanges();
+                calendar = fixture.componentInstance.calendar;
+
                 expect(calendar.weekStart).toEqual(WEEKDAYS.SUNDAY);
                 expect(calendar.selection).toEqual('single');
+                expect(calendar.viewDate.getMonth()).toEqual(calendar.value.getMonth());
 
                 const date = new Date(2020, 8, 28);
-                calendar.value = date;
+                calendar.viewDate = date;
                 fixture.detectChanges();
-                expect(
-                    (fixture.componentInstance.model as Date).toDateString()
-                ).toMatch(date.toDateString());
-                expect((calendar.value as Date).toDateString()).toMatch(
-                    date.toDateString()
-                );
+
+                expect(calendar.viewDate.getMonth()).toEqual(date.getMonth());
+
+                calendar.value = new Date(2020, 9, 15);
+                fixture.detectChanges();
+
                 expect(calendar.viewDate.getMonth()).toEqual(date.getMonth());
             });
 
@@ -1948,6 +1954,16 @@ export class IgxCalendarDisabledSpecialDatesComponent {
     @ViewChild(IgxCalendarComponent, { static: true }) public calendar: IgxCalendarComponent;
 }
 
+@Component({
+    template: `
+        <igx-calendar [value]="value"></igx-calendar>
+    `
+})
+export class IgxCalendarValueComponent {
+    public value = new Date(2020, 7, 13);
+    @ViewChild(IgxCalendarComponent, { static: true }) public calendar: IgxCalendarComponent;
+}
+
 class DateTester {
     // tests whether a date is disabled or not
     static testDatesAvailability(dates: IgxDayItemComponent[], disabled: boolean) {