Forwards compatibility for TS2.7 through to TS3.0 (#66)

* Forward compat for TS3.0

* Compatibility from 2.6 to 3.0

* Put typescript verion back to 2.6.2

* formatting

* Remove types for web animations

* Remove web animation types from tsconfig for esm

* package-lock.json

* package-lock.json

package.json

@@ -47,7 +47,6 @@
   "dependencies": {
     "@types/cldrjs": "0.4.20",
     "@types/globalize": "0.0.34",
-    "@types/web-animations-js": "2.2.5",
     "@webcomponents/webcomponentsjs": "1.1.0",
     "cldrjs": "0.4.8",
     "css-select-umd": "1.3.0-rc0",

src/i18n/i18n.ts

@@ -2,7 +2,7 @@
 import global from '../shim/global';
 import { isArrayLike, isIterable } from '../shim/iterator';
 import Map from '../shim/Map';
-import Evented from '../core/Evented';
+import Evented, { EventObject } from '../core/Evented';
 import has from '../has/preset';
 import { uuid } from '../core/util';
 import * as Globalize from 'globalize/dist/globalize/message';
@@ -98,10 +98,14 @@ export interface Messages {
 	[key: string]: string;
 }
 
+export interface I18nEventObject extends EventObject<string> {
+	target: any;
+}
+
 const TOKEN_PATTERN = /\{([a-z0-9_]+)\}/gi;
 const bundleMap = new Map<string, Map<string, Messages>>();
 const formatterMap = new Map<string, MessageFormatter>();
-const localeProducer = new Evented();
+const localeProducer = new Evented<{}, string, I18nEventObject>();
 let rootLocale: string;
 
 /**
@@ -282,7 +286,7 @@ export function formatMessage<T extends Messages>(
  *
  * @return The cached messages object, if it exists.
  */
-export function getCachedMessages<T extends Messages>(bundle: Bundle<T>, locale: string): T | void {
+export function getCachedMessages<T extends Messages>(bundle: Bundle<T>, locale: string): T | undefined {
 	const { id = getBundleId(bundle), locales, messages } = bundle;
 	const cached = bundleMap.get(id);
 

src/shim/AbortController.ts

@@ -4,7 +4,7 @@ import { findIndex } from './array';
 
 export interface AbortSignal extends EventTarget {
 	aborted: boolean;
-	onabort: (ev: Event) => any;
+	onabort: undefined | ((ev: Event) => any);
 }
 
 export interface AbortSignalConstructor {
@@ -18,7 +18,7 @@ export let ShimAbortSignal: AbortSignalConstructor = global.AbortSignal;
 if (!has('abort-signal')) {
 	global.AbortSignal = ShimAbortSignal = class implements AbortSignal {
 		private _aborted = false;
-		onabort: (ev: Event) => any;
+		onabort: undefined | ((ev: Event) => any);
 
 		listeners: { [type: string]: ((event: Event) => void)[] } = {};
 

src/shim/object.ts

@@ -149,10 +149,7 @@ if (has('es6-object')) {
 		return to;
 	};
 
-	getOwnPropertyDescriptor = function getOwnPropertyDescriptor(
-		o: any,
-		prop: string | symbol
-	): PropertyDescriptor | undefined {
+	getOwnPropertyDescriptor = function<T, K extends keyof T>(o: T, prop: K): PropertyDescriptor | undefined {
 		if (isSymbol(prop)) {
 			return (<any>Object).getOwnPropertyDescriptor(o, prop);
 		} else {

src/widget-core/Registry.ts

@@ -28,7 +28,7 @@ export const WIDGET_BASE_TYPE = Symbol('Widget Base');
 
 export interface RegistryEventObject extends EventObject<RegistryLabel> {
 	action: string;
-	item: WidgetBaseConstructor | InjectorFactory;
+	item: WidgetBaseConstructor | InjectorItem;
 }
 /**
  * Widget Registry Interface

src/widget-core/meta/WebAnimation.ts

@@ -32,6 +32,13 @@ export interface AnimationTimingProperties {
 	iterationStart?: number;
 }
 
+export interface AnimationKeyFrame {
+	easing?: string | string[];
+	offset?: number | Array<number | null> | null;
+	opacity?: number | number[];
+	transform?: string | string[];
+}
+
 /**
  * Animation propertiues that can be passed as vdom property `animate`
  */
@@ -55,24 +62,24 @@ export interface AnimationInfo {
 }
 
 export interface AnimationPlayer {
-	player: Animation;
+	player: any;
 	used: boolean;
 }
 
 export class WebAnimations extends Base {
 	private _animationMap = new Map<string, AnimationPlayer>();
 
-	private _createPlayer(node: HTMLElement, properties: AnimationProperties): Animation {
+	private _createPlayer(node: HTMLElement, properties: AnimationProperties): any {
 		const { effects, timing = {} } = properties;
 
 		const fx = typeof effects === 'function' ? effects() : effects;
 
-		const keyframeEffect = new KeyframeEffect(node, fx, timing as AnimationEffectTiming);
+		const keyframeEffect = new global.KeyframeEffect(node, fx, timing);
 
-		return new Animation(keyframeEffect, global.document.timeline);
+		return new global.Animation(keyframeEffect, global.document.timeline);
 	}
 
-	private _updatePlayer(player: Animation, controls: AnimationControls) {
+	private _updatePlayer(player: any, controls: AnimationControls) {
 		const { play, reverse, cancel, finish, onFinish, onCancel, playbackRate, startTime, currentTime } = controls;
 
 		if (playbackRate !== undefined) {
@@ -161,10 +168,10 @@ export class WebAnimations extends Base {
 			const { currentTime, playState, playbackRate, startTime } = animation.player;
 
 			return {
-				currentTime,
+				currentTime: currentTime || 0,
 				playState,
 				playbackRate,
-				startTime
+				startTime: startTime || 0
 			};
 		}
 	}

tests/core/unit/Evented.ts

@@ -39,8 +39,8 @@ registerSuite('Evented', {
 		'on() with Symbol type'() {
 			const foo = Symbol();
 			const bar = Symbol();
-			const eventStack: symbol[] = [];
-			const evented = new Evented<{}, symbol>();
+			const eventStack: (symbol | string)[] = [];
+			const evented = new Evented<{}, symbol | string>();
 			const handle = evented.on(foo, (event) => {
 				eventStack.push(event.type);
 			});
@@ -173,10 +173,10 @@ registerSuite('Evented', {
 			const eventStack: string[] = [];
 			const evented = new Evented();
 			evented.on('foo', (event) => {
-				eventStack.push(`foo->${event.type}`);
+				eventStack.push(`foo->${event.type.toString()}`);
 			});
 			evented.on('*foo', (event) => {
-				eventStack.push(`*foo->${event.type}`);
+				eventStack.push(`*foo->${event.type.toString()}`);
 			});
 
 			evented.emit({ type: 'foo' });

tests/core/unit/QueuingEvented.ts

@@ -6,7 +6,7 @@ import { EventObject } from '../../../src/core/Evented';
 
 interface CustomEvent extends EventObject {
 	type: 'test';
-	target: any;
+	target?: any;
 	value: number;
 }
 
@@ -16,7 +16,7 @@ function isCustomEvent(object: any): object is CustomEvent {
 
 registerSuite('QueuingEvented', {
 	'events are queued for the first subscriber': function() {
-		const evented = new QueuingEvented();
+		const evented = new QueuingEvented<{}, string, CustomEvent>();
 		let listenerCallCount = 0;
 
 		evented.emit({
@@ -32,7 +32,7 @@ registerSuite('QueuingEvented', {
 	},
 
 	'events do not get queued over maximum'() {
-		const evented = new QueuingEvented();
+		const evented = new QueuingEvented<{}, string, CustomEvent>();
 		evented.maxEvents = 5;
 		let expectedValues: number[] = [];
 

tests/i18n/unit/i18n.ts

@@ -409,7 +409,7 @@ registerSuite('i18n', {
 					const cached = getCachedMessages(bundle, 'ar-JO');
 
 					assert.throws(() => {
-						cached!['hello'] = 'Hello';
+						cached!.hello = 'Hello';
 					});
 				});
 			}

tests/routing/unit/history/StateHistory.ts

@@ -26,43 +26,43 @@ describe('StateHistory', () => {
 	});
 
 	it('initializes current path to current location', () => {
-		sandbox.contentWindow.history.pushState({}, '', '/foo?bar');
-		assert.equal(new StateHistory({ onChange, window: sandbox.contentWindow }).current, '/foo?bar');
+		sandbox.contentWindow!.history.pushState({}, '', '/foo?bar');
+		assert.equal(new StateHistory({ onChange, window: sandbox.contentWindow! }).current, '/foo?bar');
 	});
 
 	it('location defers to the global object', () => {
 		assert.equal(new StateHistory({ onChange }).current, window.location.pathname + window.location.search);
 	});
 
 	it('prefixes path with leading slash if necessary', () => {
-		const history = new StateHistory({ onChange, window: sandbox.contentWindow });
+		const history = new StateHistory({ onChange, window: sandbox.contentWindow! });
 		assert.equal(history.prefix('/foo'), '/foo');
 		assert.equal(history.prefix('foo'), '/foo');
 	});
 
 	it('update path', () => {
-		const history = new StateHistory({ onChange, window: sandbox.contentWindow });
+		const history = new StateHistory({ onChange, window: sandbox.contentWindow! });
 		history.set('/foo');
 		assert.equal(history.current, '/foo');
-		assert.equal(sandbox.contentWindow.location.pathname, '/foo');
+		assert.equal(sandbox.contentWindow!.location.pathname, '/foo');
 	});
 
 	it('update path, adds leading slash if necessary', () => {
-		const history = new StateHistory({ onChange, window: sandbox.contentWindow });
+		const history = new StateHistory({ onChange, window: sandbox.contentWindow! });
 		history.set('foo');
 		assert.equal(history.current, '/foo');
-		assert.equal(sandbox.contentWindow.location.pathname, '/foo');
+		assert.equal(sandbox.contentWindow!.location.pathname, '/foo');
 	});
 
 	it('emits change when path is updated', () => {
-		const history = new StateHistory({ onChange, window: sandbox.contentWindow });
+		const history = new StateHistory({ onChange, window: sandbox.contentWindow! });
 		history.set('/foo');
 		assert.deepEqual(onChange.firstCall.args, ['/foo']);
 	});
 
 	it('does not emit change if path is set to the current value', () => {
-		sandbox.contentWindow.history.pushState({}, '', '/foo');
-		const history = new StateHistory({ onChange, window: sandbox.contentWindow });
+		sandbox.contentWindow!.history.pushState({}, '', '/foo');
+		const history = new StateHistory({ onChange, window: sandbox.contentWindow! });
 		history.set('/foo');
 		assert.isTrue(onChange.notCalled);
 	});
@@ -89,58 +89,58 @@ describe('StateHistory', () => {
 		});
 
 		it('initializes current path, taking out the base, with trailing slash', () => {
-			sandbox.contentWindow.history.pushState({}, '', '/foo/bar?baz');
+			sandbox.contentWindow!.history.pushState({}, '', '/foo/bar?baz');
 			assert.equal(
-				new StateHistory({ onChange, base: '/foo/', window: sandbox.contentWindow }).current,
+				new StateHistory({ onChange, base: '/foo/', window: sandbox.contentWindow! }).current,
 				'/bar?baz'
 			);
 		});
 
 		it('initializes current path, taking out the base, without trailing slash', () => {
-			sandbox.contentWindow.history.pushState({}, '', '/foo/bar?baz');
+			sandbox.contentWindow!.history.pushState({}, '', '/foo/bar?baz');
 			assert.equal(
-				new StateHistory({ onChange, base: '/foo', window: sandbox.contentWindow }).current,
+				new StateHistory({ onChange, base: '/foo', window: sandbox.contentWindow! }).current,
 				'/bar?baz'
 			);
 		});
 
 		it("initializes current path to / if it's not a base suffix", () => {
-			sandbox.contentWindow.history.pushState({}, '', '/foo/bar?baz');
-			assert.equal(new StateHistory({ onChange, base: '/thud/', window: sandbox.contentWindow }).current, '/');
+			sandbox.contentWindow!.history.pushState({}, '', '/foo/bar?baz');
+			assert.equal(new StateHistory({ onChange, base: '/thud/', window: sandbox.contentWindow! }).current, '/');
 		});
 
 		it('#prefix prefixes path with the base (with trailing slash)', () => {
-			const history = new StateHistory({ onChange, base: '/foo/', window: sandbox.contentWindow });
+			const history = new StateHistory({ onChange, base: '/foo/', window: sandbox.contentWindow! });
 			assert.equal(history.prefix('/bar'), '/foo/bar');
 			assert.equal(history.prefix('bar'), '/foo/bar');
 		});
 
 		it('#prefix prefixes path with the base (without trailing slash)', () => {
-			const history = new StateHistory({ onChange, base: '/foo', window: sandbox.contentWindow });
+			const history = new StateHistory({ onChange, base: '/foo', window: sandbox.contentWindow! });
 			assert.equal(history.prefix('/bar'), '/foo/bar');
 			assert.equal(history.prefix('bar'), '/foo/bar');
 		});
 
 		it('#set expands the path with the base when pushing state, with trailing slash', () => {
-			const history = new StateHistory({ onChange, base: '/foo/', window: sandbox.contentWindow });
+			const history = new StateHistory({ onChange, base: '/foo/', window: sandbox.contentWindow! });
 			history.set('/bar');
 			assert.equal(history.current, '/bar');
-			assert.equal(sandbox.contentWindow.location.pathname, '/foo/bar');
+			assert.equal(sandbox.contentWindow!.location.pathname, '/foo/bar');
 
 			history.set('baz');
 			assert.equal(history.current, '/baz');
-			assert.equal(sandbox.contentWindow.location.pathname, '/foo/baz');
+			assert.equal(sandbox.contentWindow!.location.pathname, '/foo/baz');
 		});
 
 		it('#set expands the path with the base when pushing state, without trailing slash', () => {
-			const history = new StateHistory({ onChange, base: '/foo', window: sandbox.contentWindow });
+			const history = new StateHistory({ onChange, base: '/foo', window: sandbox.contentWindow! });
 			history.set('/bar');
 			assert.equal(history.current, '/bar');
-			assert.equal(sandbox.contentWindow.location.pathname, '/foo/bar');
+			assert.equal(sandbox.contentWindow!.location.pathname, '/foo/bar');
 
 			history.set('baz');
 			assert.equal(history.current, '/baz');
-			assert.equal(sandbox.contentWindow.location.pathname, '/foo/baz');
+			assert.equal(sandbox.contentWindow!.location.pathname, '/foo/baz');
 		});
 	});
 });