feat: add runtime validation of event properties

Closes #362

Author: Matt Lewis

package-lock.json

@@ -167,7 +167,7 @@
   "dependencies": {
     "angular-draggable-droppable": "^1.1.1",
     "angular-resizable-element": "^1.2.4",
-    "calendar-utils": "0.0.57",
+    "calendar-utils": "0.0.58",
     "date-fns": "^1.28.5",
     "positioning": "^1.3.1"
   }

package.json

@@ -0,0 +1,9 @@
+import {
+  CalendarEvent,
+  validateEvents as validateEventsWithoutLog
+} from 'calendar-utils';
+
+export const validateEvents = (events: CalendarEvent[]) => {
+  const warn = (...args) => console.warn('angular-calendar', ...args);
+  return validateEventsWithoutLog(events, warn);
+};

src/components/common/util.ts

@@ -26,6 +26,7 @@ import { CalendarDragHelper } from '../../providers/calendarDragHelper.provider'
 import { CalendarResizeHelper } from '../../providers/calendarResizeHelper.provider';
 import { CalendarEventTimesChangedEvent } from '../../interfaces/calendarEventTimesChangedEvent.interface';
 import { CalendarUtils } from '../../providers/calendarUtils.provider';
+import { validateEvents } from '../common/util';
 
 /**
  * @hidden
@@ -327,6 +328,10 @@ export class CalendarDayViewComponent implements OnChanges, OnInit, OnDestroy {
       this.refreshHourGrid();
     }
 
+    if (changes.events) {
+      validateEvents(this.events);
+    }
+
     if (
       changes.viewDate ||
       changes.events ||

src/components/day/calendarDayView.component.ts

@@ -30,6 +30,7 @@ import differenceInSeconds from 'date-fns/difference_in_seconds';
 import addSeconds from 'date-fns/add_seconds';
 import { CalendarEventTimesChangedEvent } from '../../interfaces/calendarEventTimesChangedEvent.interface';
 import { CalendarUtils } from '../../providers/calendarUtils.provider';
+import { validateEvents } from '../common/util';
 
 /**
  * Shows all events on a given month. Example usage:
@@ -254,6 +255,10 @@ export class CalendarMonthViewComponent
       this.refreshHeader();
     }
 
+    if (changes.events) {
+      validateEvents(this.events);
+    }
+
     if (
       changes.viewDate ||
       changes.events ||

src/components/month/calendarMonthView.component.ts

@@ -25,6 +25,7 @@ import { CalendarDragHelper } from '../../providers/calendarDragHelper.provider'
 import { CalendarResizeHelper } from '../../providers/calendarResizeHelper.provider';
 import { CalendarEventTimesChangedEvent } from '../../interfaces/calendarEventTimesChangedEvent.interface';
 import { CalendarUtils } from '../../providers/calendarUtils.provider';
+import { validateEvents } from '../common/util';
 
 export interface WeekViewEventResize {
   originalOffset: number;
@@ -261,6 +262,10 @@ export class CalendarWeekViewComponent implements OnChanges, OnInit, OnDestroy {
       this.refreshHeader();
     }
 
+    if (changes.events) {
+      validateEvents(this.events);
+    }
+
     if (changes.events || changes.viewDate || changes.excludeDays) {
       this.refreshBody();
     }

src/components/week/calendarWeekView.component.ts

@@ -981,4 +981,18 @@ describe('CalendarDayViewComponent component', () => {
         .toDate()
     });
   });
+
+  it('should log on invalid events', () => {
+    const stub = sinon.stub(console, 'warn');
+    const fixture: ComponentFixture<
+      CalendarDayViewComponent
+    > = TestBed.createComponent(CalendarDayViewComponent);
+    fixture.componentInstance.events = [
+      { start: '2017-01-01', title: '', color: { primary: '', secondary: '' } }
+    ] as any;
+    fixture.componentInstance.ngOnChanges({ events: {} });
+    fixture.detectChanges();
+    stub.restore();
+    expect(stub).to.have.been.calledOnce; // tslint:disable-line
+  });
 });

test/calendarDayView.component.spec.ts

@@ -741,4 +741,18 @@ describe('calendarMonthView component', () => {
     subscription.unsubscribe();
     fixture.destroy();
   });
+
+  it('should log on invalid events', () => {
+    const stub = sinon.stub(console, 'warn');
+    const fixture: ComponentFixture<
+      CalendarMonthViewComponent
+    > = TestBed.createComponent(CalendarMonthViewComponent);
+    fixture.componentInstance.events = [
+      { start: '2017-01-01', title: '', color: { primary: '', secondary: '' } }
+    ] as any;
+    fixture.componentInstance.ngOnChanges({ events: {} });
+    fixture.detectChanges();
+    stub.restore();
+    expect(stub).to.have.been.calledOnce; // tslint:disable-line
+  });
 });

test/calendarMonthView.component.spec.ts

@@ -823,4 +823,18 @@ describe('calendarWeekView component', () => {
     ).to.equal(true);
     fixture.destroy();
   });
+
+  it('should log on invalid events', () => {
+    const stub = sinon.stub(console, 'warn');
+    const fixture: ComponentFixture<
+      CalendarWeekViewComponent
+    > = TestBed.createComponent(CalendarWeekViewComponent);
+    fixture.componentInstance.events = [
+      { start: '2017-01-01', title: '', color: { primary: '', secondary: '' } }
+    ] as any;
+    fixture.componentInstance.ngOnChanges({ events: {} });
+    fixture.detectChanges();
+    stub.restore();
+    expect(stub).to.have.been.calledOnce; // tslint:disable-line
+  });
 });