test: fix tests after angular update

src/app/home/url-upload/url-upload.component.spec.ts

@@ -2,7 +2,7 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 
 import { UrlUploadComponent } from './url-upload.component';
-import { MockModule } from 'ng-mocks';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { MatInputModule } from '@angular/material/input';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 
@@ -10,16 +10,19 @@ describe('UrlUploadComponent', () => {
     let component: UrlUploadComponent;
     let fixture: ComponentFixture<UrlUploadComponent>;
 
-    beforeEach(waitForAsync(() => {
-        TestBed.configureTestingModule({
-            declarations: [UrlUploadComponent],
-            imports: [
-                MockModule(MatInputModule),
-                FormsModule,
-                ReactiveFormsModule,
-            ],
-        }).compileComponents();
-    }));
+    beforeEach(
+        waitForAsync(() => {
+            TestBed.configureTestingModule({
+                declarations: [UrlUploadComponent],
+                imports: [
+                    MatInputModule,
+                    FormsModule,
+                    ReactiveFormsModule,
+                    NoopAnimationsModule,
+                ],
+            }).compileComponents();
+        })
+    );
 
     beforeEach(() => {
         fixture = TestBed.createComponent(UrlUploadComponent);
@@ -31,29 +34,32 @@ describe('UrlUploadComponent', () => {
         expect(component).toBeTruthy();
     });
 
-    it('submit form with playlist url', waitForAsync(() => {
-        spyOn(component.urlAdded, 'emit');
-        const TEST_URL = 'http://example.org/playlist.m3u';
-        const submitButton = fixture.debugElement.nativeElement.querySelector(
-            'button'
-        );
+    it(
+        'submit form with playlist url',
+        waitForAsync(() => {
+            spyOn(component.urlAdded, 'emit');
+            const TEST_URL = 'http://example.org/playlist.m3u';
+            const submitButton = fixture.debugElement.nativeElement.querySelector(
+                'button'
+            );
 
-        // test input field validation
-        expect(submitButton.disabled).toBeTruthy();
-        component.form.setValue({ playlistUrl: 'wrong url here' });
-        fixture.detectChanges();
-        expect(submitButton.disabled).toBeTruthy();
-        component.form.setValue({ playlistUrl: TEST_URL + '8' });
-        fixture.detectChanges();
-        expect(submitButton.disabled).toBeFalsy();
-        component.form.setValue({ playlistUrl: TEST_URL });
-        fixture.detectChanges();
-        expect(submitButton.disabled).toBeFalsy();
+            // test input field validation
+            expect(submitButton.disabled).toBeTruthy();
+            component.form.setValue({ playlistUrl: 'wrong url here' });
+            fixture.detectChanges();
+            expect(submitButton.disabled).toBeTruthy();
+            component.form.setValue({ playlistUrl: TEST_URL + '8' });
+            fixture.detectChanges();
+            expect(submitButton.disabled).toBeFalsy();
+            component.form.setValue({ playlistUrl: TEST_URL });
+            fixture.detectChanges();
+            expect(submitButton.disabled).toBeFalsy();
 
-        const form = fixture.debugElement.query(By.css('form'));
-        form.triggerEventHandler('ngSubmit', null);
+            const form = fixture.debugElement.query(By.css('form'));
+            form.triggerEventHandler('ngSubmit', null);
 
-        // eslint-disable-next-line @typescript-eslint/unbound-method
-        expect(component.urlAdded.emit).toHaveBeenCalledWith(TEST_URL);
-    }));
+            // eslint-disable-next-line @typescript-eslint/unbound-method
+            expect(component.urlAdded.emit).toHaveBeenCalledWith(TEST_URL);
+        })
+    );
 });

src/app/home/url-upload/url-upload.component.ts

@@ -1,4 +1,4 @@
-import { Component, Output, EventEmitter } from '@angular/core';
+import { Component, Output, EventEmitter, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 
 @Component({
@@ -6,7 +6,7 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
     templateUrl: './url-upload.component.html',
     styleUrls: ['./url-upload.component.scss'],
 })
-export class UrlUploadComponent {
+export class UrlUploadComponent implements OnInit {
     /** Emits url string to the parent component on form submit */
     @Output() urlAdded: EventEmitter<string> = new EventEmitter();
 
@@ -17,7 +17,9 @@ export class UrlUploadComponent {
      * Creates an instance of component
      * @param fb angulars form builder
      */
-    constructor(private fb: FormBuilder) {
+    constructor(private fb: FormBuilder) {}
+
+    ngOnInit(): void {
         const urlRegex = '(https?://.*?.(m3u|m3u8))';
         this.form = this.fb.group({
             playlistUrl: [

src/app/player/components/channel-list-container/channel-list-container.component.spec.ts

@@ -18,6 +18,7 @@ import { createChannel } from '../../../state';
 import * as MOCKED_PLAYLIST from '../../../../mocks/playlist.json';
 import { ElectronService } from '../../../services/electron.service';
 import { ElectronServiceStub } from '../../../home/home.component.spec';
+import { ScrollingModule } from '@angular/cdk/scrolling';
 
 class MatSnackBarStub {
     open(): void {}
@@ -41,6 +42,7 @@ describe('ChannelListContainerComponent', () => {
                 MockModule(MatInputModule),
                 MockModule(MatIconModule),
                 MockModule(MatListModule),
+                MockModule(ScrollingModule),
                 MockModule(MatTabsModule),
                 MockModule(MatExpansionModule),
                 FormsModule,