feat: upgrade to Angular 15

.gitignore

@@ -43,6 +43,7 @@ testem.log
 .DS_Store
 Thumbs.db
 
+migrations.json
 apps/demo/routesFile.txt
 .ssl
 .angular

apps/demo/src/app/app.routes.ts

@@ -121,7 +121,6 @@ export const appRoutes: Routes = [
     imports: [
         RouterModule.forRoot(appRoutes, {
             initialNavigation: 'enabledBlocking',
-            relativeLinkResolution: 'corrected',
             scrollPositionRestoration: `enabled`,
         }),
     ],

apps/demo/src/app/pages/canvas/canvas-page.component.ts

@@ -23,7 +23,7 @@ export class CanvasPageComponent {
     dWidth = 100;
     dHeight = 100;
 
-    globalCompositeOperation = 'source-over';
+    globalCompositeOperation: GlobalCompositeOperation = 'source-over';
 
     mouth = 30;
     blur = 0;

libs/audio/karma.conf.js

@@ -9,8 +9,8 @@ module.exports = function (config) {
             require('karma-jasmine'),
             require('karma-chrome-launcher'),
             require('karma-jasmine-html-reporter'),
-            require('karma-coverage-istanbul-reporter'),
             require('@angular-devkit/build-angular/plugins/karma'),
+            require('karma-coverage'),
         ],
         files: [
             {
@@ -31,10 +31,12 @@ module.exports = function (config) {
         client: {
             clearContext: false, // leave Jasmine Spec Runner output visible in browser
         },
-        coverageIstanbulReporter: {
-            dir: require('path').join(__dirname, '../../coverage/audio'),
-            reports: ['html', 'lcovonly'],
-            fixWebpackSourcePaths: true,
+        preprocessors: {
+            'src/**/*.js': ['coverage'],
+        },
+        coverageReporter: {
+            type: 'html',
+            dir: require('path').join(__dirname, '../../coverage/payment-request'),
         },
         reporters: ['progress', 'kjhtml'],
         port: 9876,

libs/audio/src/decorators/audio-param.ts

@@ -13,6 +13,7 @@ export function audioParam<K extends string>(
 ): AudioParamDecorator<K> | AudioParamWorkletDecorator {
     const decorator: AudioParamDecorator<K> = (target, propertyKey) => {
         Object.defineProperty(target, propertyKey, {
+            configurable: true,
             set(this: AudioNodeWithParams<K> | AudioWorkletNode, value: AudioParamInput) {
                 value = typeof value === 'string' ? Number.parseFloat(value) : value;
 
@@ -27,7 +28,10 @@ export function audioParam<K extends string>(
                     processAudioParam(audioParam, value, this.context.currentTime);
                 } else {
                     // Fallback for older browsers
-                    Object.defineProperty(target, propertyKey, {value});
+                    Object.defineProperty(target, propertyKey, {
+                        value,
+                        configurable: true,
+                    });
                 }
             },
         });

libs/audio/test.ts

@@ -1,24 +1,13 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
-import './src/polyfill.js';
+import 'zone.js';
+import 'zone.js/testing';
 
 import {getTestBed} from '@angular/core/testing';
 import {
     BrowserDynamicTestingModule,
     platformBrowserDynamicTesting,
 } from '@angular/platform-browser-dynamic/testing';
 
-declare const require: any;
-
-// First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(
     BrowserDynamicTestingModule,
     platformBrowserDynamicTesting(),
 );
-
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-
-// And load the modules.
-context.keys().map(context);

libs/audio/tests/audio-buffer.service.spec.ts

@@ -9,7 +9,7 @@ describe('AudioBufferService', () => {
     });
 
     beforeEach(() => {
-        service = TestBed.get(AudioBufferService);
+        service = TestBed.inject(AudioBufferService);
     });
 
     it('turns audio file to AudioBuffer', done => {

libs/audio/tests/audio-worklet-processors-ready.spec.ts

@@ -19,7 +19,7 @@ describe('AUDIO_WORKLET_PROCESSORS_READY', () => {
     xit('rejects Promise if worklets are not supported', done => {
         let rejected = false;
 
-        TestBed.get(AUDIO_WORKLET_PROCESSORS_READY).catch(() => {
+        TestBed.inject(AUDIO_WORKLET_PROCESSORS_READY).catch(() => {
             rejected = true;
         });
 

libs/canvas/karma.conf.js

@@ -9,16 +9,18 @@ module.exports = function (config) {
             require('karma-jasmine'),
             require('karma-chrome-launcher'),
             require('karma-jasmine-html-reporter'),
-            require('karma-coverage-istanbul-reporter'),
             require('@angular-devkit/build-angular/plugins/karma'),
+            require('karma-coverage'),
         ],
         client: {
             clearContext: false, // leave Jasmine Spec Runner output visible in browser
         },
-        coverageIstanbulReporter: {
-            dir: require('path').join(__dirname, '../../coverage/canvas'),
-            reports: ['html', 'lcovonly'],
-            fixWebpackSourcePaths: true,
+        preprocessors: {
+            'src/**/*.js': ['coverage'],
+        },
+        coverageReporter: {
+            type: 'html',
+            dir: require('path').join(__dirname, '../../coverage/payment-request'),
         },
         reporters: ['progress', 'kjhtml'],
         port: 9876,

libs/canvas/src/properties/compositing.ts

@@ -14,7 +14,7 @@ export class CompositingDirective implements CanvasMethod, CanvasCompositing {
     globalAlpha = 1;
 
     @Input()
-    globalCompositeOperation = 'source-over';
+    globalCompositeOperation: GlobalCompositeOperation = 'source-over';
 
     call(context: CanvasRenderingContext2D) {
         context.globalAlpha = this.globalAlpha;

libs/canvas/src/properties/text-drawing-styles.ts

@@ -17,6 +17,9 @@ export class TextDrawingStylesDirective implements CanvasMethod, CanvasTextDrawi
     @Input()
     textAlign: CanvasTextAlign = 'start';
 
+    @Input()
+    fontKerning: CanvasFontKerning = 'auto';
+
     @Input()
     textBaseline: CanvasTextBaseline = 'alphabetic';
 

libs/canvas/test.ts

@@ -1,23 +1,13 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
+import 'zone.js';
+import 'zone.js/testing';
 
 import {getTestBed} from '@angular/core/testing';
 import {
     BrowserDynamicTestingModule,
     platformBrowserDynamicTesting,
 } from '@angular/platform-browser-dynamic/testing';
 
-declare const require: any;
-
-// First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(
     BrowserDynamicTestingModule,
     platformBrowserDynamicTesting(),
 );
-
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-
-// And load the modules.
-context.keys().map(context);

libs/canvas/tests/canvas-properties.spec.ts

@@ -3,6 +3,6 @@ import {CANVAS_PROPERTIES} from '../src/tokens/canvas-properties';
 
 describe('CANVAS_PROPERTIES', () => {
     it('is empty by default', () => {
-        expect(TestBed.get(CANVAS_PROPERTIES)).toEqual([]);
+        expect(TestBed.inject(CANVAS_PROPERTIES)).toEqual([]);
     });
 });

libs/common/karma.conf.js

@@ -9,16 +9,18 @@ module.exports = function (config) {
             require('karma-jasmine'),
             require('karma-chrome-launcher'),
             require('karma-jasmine-html-reporter'),
-            require('karma-coverage-istanbul-reporter'),
             require('@angular-devkit/build-angular/plugins/karma'),
+            require('karma-coverage'),
         ],
         client: {
             clearContext: false, // leave Jasmine Spec Runner output visible in browser
         },
-        coverageIstanbulReporter: {
-            dir: require('path').join(__dirname, '../../coverage/common'),
-            reports: ['html', 'lcovonly'],
-            fixWebpackSourcePaths: true,
+        preprocessors: {
+            'src/**/*.js': ['coverage'],
+        },
+        coverageReporter: {
+            type: 'html',
+            dir: require('path').join(__dirname, '../../coverage/payment-request'),
         },
         reporters: ['progress', 'kjhtml'],
         port: 9876,

libs/common/test.ts

@@ -1,23 +1,13 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-import 'zone.js/dist/zone';
-import 'zone.js/dist/zone-testing';
+import 'zone.js';
+import 'zone.js/testing';
 
 import {getTestBed} from '@angular/core/testing';
 import {
     BrowserDynamicTestingModule,
     platformBrowserDynamicTesting,
 } from '@angular/platform-browser-dynamic/testing';
 
-declare const require: any;
-
-// First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(
     BrowserDynamicTestingModule,
     platformBrowserDynamicTesting(),
 );
-
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-
-// And load the modules.
-context.keys().map(context);

libs/common/tests/animation-frame.spec.ts

@@ -9,7 +9,7 @@ describe('ANIMATION_FRAME', () => {
         TestBed.configureTestingModule({});
 
         const animationFrame$: Observable<DOMHighResTimeStamp> =
-            TestBed.get(ANIMATION_FRAME);
+            TestBed.inject(ANIMATION_FRAME);
 
         animationFrame$.pipe(first()).subscribe(timestamp => {
             expect(typeof timestamp).toBe('number');

libs/common/tests/caches.spec.ts

@@ -6,6 +6,6 @@ describe('CACHES', () => {
     it('injects window.caches object', () => {
         TestBed.configureTestingModule({});
 
-        expect(TestBed.get(CACHES)).toBe(window.caches);
+        expect(TestBed.inject(CACHES)).toBe(window.caches);
     });
 });

libs/common/tests/crypto.spec.ts

@@ -6,6 +6,6 @@ describe('CRYPTO', () => {
     it('injects window.crypto object', () => {
         TestBed.configureTestingModule({});
 
-        expect(TestBed.get(CRYPTO)).toBe(window.crypto);
+        expect(TestBed.inject(CRYPTO)).toBe(window.crypto);
     });
 });

libs/common/tests/css.spec.ts

@@ -7,16 +7,15 @@ describe('CSS', () => {
     it('injects window.CSS object', () => {
         TestBed.configureTestingModule({});
 
-        // @ts-ignore
-        expect(TestBed.get(CSS)).toBe(window.CSS);
+        expect(TestBed.inject(CSS)).toBe(window.CSS);
     });
 
     it('injects mock when CSS is not available', () => {
         TestBed.configureTestingModule({
             providers: [{provide: WINDOW, useValue: {}}],
         });
 
-        const css = TestBed.get(CSS);
+        const css = TestBed.inject(CSS);
 
         expect(css.supports('display', 'block')).toBe(false);
         expect(css.escape('<&>hapica$')).toBe('<&>hapica$');

libs/common/tests/history.spec.ts

@@ -6,6 +6,6 @@ describe('HISTORY', () => {
     it('injects window.history object', () => {
         TestBed.configureTestingModule({});
 
-        expect(TestBed.get(HISTORY)).toBe(window.history);
+        expect(TestBed.inject(HISTORY)).toBe(window.history);
     });
 });

libs/common/tests/local-storage.spec.ts

@@ -6,6 +6,6 @@ describe('LOCAL_STORAGE', () => {
     it('injects window.localStorage object', () => {
         TestBed.configureTestingModule({});
 
-        expect(TestBed.get(LOCAL_STORAGE)).toBe(window.localStorage);
+        expect(TestBed.inject(LOCAL_STORAGE)).toBe(window.localStorage);
     });
 });

libs/common/tests/location.spec.ts

@@ -6,6 +6,6 @@ describe('LOCATION', () => {
     it('injects window.location object', () => {
         TestBed.configureTestingModule({});
 
-        expect(TestBed.get(LOCATION)).toBe(window.location);
+        expect(TestBed.inject(LOCATION)).toBe(window.location);
     });
 });

libs/common/tests/media-devices.spec.ts

@@ -6,6 +6,6 @@ describe('MEDIA_DEVICES', () => {
     it('injects window.navigator object', () => {
         TestBed.configureTestingModule({});
 
-        expect(TestBed.get(MEDIA_DEVICES)).toBe(window.navigator.mediaDevices);
+        expect(TestBed.inject(MEDIA_DEVICES)).toBe(window.navigator.mediaDevices);
     });
 });

libs/common/tests/navigator.spec.ts

@@ -6,6 +6,6 @@ describe('WINDOW', () => {
     it('injects window.navigator object', () => {
         TestBed.configureTestingModule({});
 
-        expect(TestBed.get(NAVIGATOR)).toBe(window.navigator);
+        expect(TestBed.inject(NAVIGATOR)).toBe(window.navigator);
     });
 });

libs/common/tests/network-information.spec.ts

@@ -7,7 +7,7 @@ describe('NETWORK_INFORMATION', () => {
     it('injects window.navigator.connection object', () => {
         TestBed.configureTestingModule({});
 
-        expect(TestBed.get(NETWORK_INFORMATION)).toBe(
+        expect(TestBed.inject(NETWORK_INFORMATION)).toBe(
             (window.navigator as any).connection,
         );
     });
@@ -17,6 +17,6 @@ describe('NETWORK_INFORMATION', () => {
             providers: [{provide: NAVIGATOR, useValue: {}}],
         });
 
-        expect(TestBed.get(NETWORK_INFORMATION)).toBe(null);
+        expect(TestBed.inject(NETWORK_INFORMATION)).toBe(null);
     });
 });

libs/common/tests/page-visibility.spec.ts

@@ -8,7 +8,7 @@ describe('PAGE_VISIBILITY', () => {
     it('watching for page visibility state', done => {
         TestBed.configureTestingModule({});
 
-        const pageVisibility$: Observable<boolean> = TestBed.get(PAGE_VISIBILITY);
+        const pageVisibility$: Observable<boolean> = TestBed.inject(PAGE_VISIBILITY);
 
         pageVisibility$.pipe(first()).subscribe(state => {
             expect(typeof state).toBe('boolean');

libs/common/tests/performance.spec.ts

@@ -6,6 +6,6 @@ describe('PERFORMANCE', () => {
     it('injects window.performance object', () => {
         TestBed.configureTestingModule({});
 
-        expect(TestBed.get(PERFORMANCE)).toBe(window.performance);
+        expect(TestBed.inject(PERFORMANCE)).toBe(window.performance);
     });
 });

libs/common/tests/screen.spec.ts

@@ -6,6 +6,6 @@ describe('SCREEN', () => {
     it('injects window.screen object', () => {
         TestBed.configureTestingModule({});
 
-        expect(TestBed.get(SCREEN)).toBe(window.screen);
+        expect(TestBed.inject(SCREEN)).toBe(window.screen);
     });
 });

libs/common/tests/session-storage.spec.ts

@@ -6,6 +6,6 @@ describe('SESSION_STORAGE', () => {
     it('injects window.sessionStorage object', () => {
         TestBed.configureTestingModule({});
 
-        expect(TestBed.get(SESSION_STORAGE)).toBe(window.sessionStorage);
+        expect(TestBed.inject(SESSION_STORAGE)).toBe(window.sessionStorage);
     });
 });

libs/common/tests/speech-recognition.spec.ts

@@ -6,7 +6,7 @@ describe('SPEECH_RECOGNITION', () => {
     it('injects webkitSpeechRecognition class', () => {
         TestBed.configureTestingModule({});
 
-        expect(TestBed.get(SPEECH_RECOGNITION)).toBe(
+        expect(TestBed.inject(SPEECH_RECOGNITION)).toBe(
             (window as any).webkitSpeechRecognition,
         );
     });
@@ -18,7 +18,7 @@ describe('SPEECH_RECOGNITION', () => {
 
         (window as any).webkitSpeechRecognition = undefined;
 
-        expect(TestBed.get(SPEECH_RECOGNITION)).toBeNull();
+        expect(TestBed.inject(SPEECH_RECOGNITION)).toBeNull();
 
         (window as any).webkitSpeechRecognition = speechRecognition;
     });