chore: fixes ng test setup (#9)

Author: nwittstruck

.gitignore

@@ -30,3 +30,5 @@ npm-debug.log*
 /platforms
 /plugins
 /www
+
+.devcontainer/

package.json

@@ -12,8 +12,7 @@
     "test": "ng test",
     "lint": "ng lint",
     "e2e": "ng e2e",
-    "deploy:dev": "ionic build --prod && rsync -zrvh ./www/* node-development:/var/www/stop-motion-app/",
-    "update-ng": "ng update @angular/core@17 @angular/cli@17"
+    "deploy:dev": "ionic build --prod && rsync -zrvh ./www/* node-development:/var/www/stop-motion-app/"
   },
   "private": true,
   "dependencies": {
@@ -58,17 +57,16 @@
     "eslint-plugin-import": "2.22.1",
     "eslint-plugin-jsdoc": "30.7.6",
     "eslint-plugin-prefer-arrow": "1.2.2",
-    "jasmine-core": "3.8.0",
-    "jasmine-spec-reporter": "5.0.0",
-    "karma": "6.3.2",
-    "karma-chrome-launcher": "3.1.0",
-    "karma-coverage": "2.0.3",
-    "karma-coverage-istanbul-reporter": "3.0.2",
-    "karma-jasmine": "4.0.0",
-    "karma-jasmine-html-reporter": "1.5.0",
+    "jasmine-core": "5.1.2",
+    "jasmine-spec-reporter": "7.0.0",
+    "karma": "6.4.3",
+    "karma-chrome-launcher": "3.2.0",
+    "karma-coverage": "2.2.1",
+    "karma-jasmine": "5.1.0",
+    "karma-jasmine-html-reporter": "2.1.0",
     "protractor": "7.0.0",
     "ts-node": "8.3.0",
     "typescript": "5.4.5"
   },
   "description": "An Ionic project"
-}
+}

src/app/app.component.spec.ts

@@ -2,13 +2,16 @@ import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import { TestBed, waitForAsync } from '@angular/core/testing';
 
 import { AppComponent } from './app.component';
+import { TranslateModule } from '@ngx-translate/core';
+import { ServiceWorkerModule } from '@angular/service-worker';
 
 describe('AppComponent', () => {
 
   beforeEach(waitForAsync(() => {
 
     TestBed.configureTestingModule({
       declarations: [AppComponent],
+      imports: [TranslateModule.forRoot(), ServiceWorkerModule.register('', {enabled: false})],
       schemas: [CUSTOM_ELEMENTS_SCHEMA],
     }).compileComponents();
   }));

src/app/components/countdown/countdown.component.spec.ts

@@ -1,14 +1,16 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { CountdownComponent } from './countdown.component';
+import { TranslateModule } from '@ngx-translate/core';
 
 describe('CountdownComponent', () => {
   let component: CountdownComponent;
   let fixture: ComponentFixture<CountdownComponent>;
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ CountdownComponent ]
+      declarations: [ CountdownComponent ],
+      imports: [TranslateModule.forRoot()]
     })
     .compileComponents();
   }));

src/app/components/header/header.component.spec.ts

@@ -4,6 +4,7 @@ import { IonicModule } from '@ionic/angular';
 import { BaseService } from '@services/base/base.service';
 
 import { HeaderComponent } from './header.component';
+import { TranslateModule } from '@ngx-translate/core';
 
 describe('HeaderComponent', () => {
   let component: HeaderComponent;
@@ -12,7 +13,7 @@ describe('HeaderComponent', () => {
   beforeEach((() => {
     TestBed.configureTestingModule({
       declarations: [ HeaderComponent ],
-      imports: [IonicModule.forRoot(), RouterTestingModule],
+      imports: [IonicModule.forRoot(), RouterTestingModule, TranslateModule.forRoot()],
       providers: [BaseService]
     })
     .compileComponents();
@@ -21,6 +22,7 @@ describe('HeaderComponent', () => {
   beforeEach(() => {
     fixture = TestBed.createComponent(HeaderComponent);
     component = fixture.componentInstance;
+    component.options = {backButton: false, backHref: "", title: "", leftButton: false, leftHref: "", leftIcon: "", rightButton: false, rightHref: "", rightIcon: ""};
     fixture.detectChanges();
   });
 

src/app/components/spinner/spinner.component.spec.ts

@@ -4,6 +4,7 @@ import { IonicModule } from '@ionic/angular';
 import { BaseService } from '@services/base/base.service';
 
 import { SpinnerComponent } from './spinner.component';
+import { TranslateModule } from '@ngx-translate/core';
 
 describe('SpinnerComponent', () => {
   let component: SpinnerComponent;
@@ -12,7 +13,7 @@ describe('SpinnerComponent', () => {
   beforeEach((() => {
     TestBed.configureTestingModule({
       declarations: [ SpinnerComponent ],
-      imports: [IonicModule.forRoot(), RouterTestingModule],
+      imports: [IonicModule.forRoot(), RouterTestingModule, TranslateModule.forRoot()],
       providers: [BaseService]
     })
     .compileComponents();
@@ -21,6 +22,7 @@ describe('SpinnerComponent', () => {
   beforeEach(() => {
     fixture = TestBed.createComponent(SpinnerComponent);
     component = fixture.componentInstance;
+    component.spinnerOptions = {type: "slide"};
     fixture.detectChanges();
   });
 

src/app/directives/open-url/open-url.directive.spec.ts

@@ -1,16 +1,37 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
-
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { AnimatorPage } from './animator.page';
+import { TranslateModule } from '@ngx-translate/core';
+import { ToolbarComponent } from './components/toolbar/toolbar.component';
+import { ThumbnailsComponent } from './components/thumbnails/thumbnails.component';
+import { SettingsPage } from '@pages/settings/settings.page';
+import { SettingsButtonComponent } from './components/settings-button/settings-button.component';
+import { ClearButtonComponent } from './components/clear-button/clear-button.component';
+import { LoadButtonComponent } from './components/load-button/load-button.component';
+import { SaveButtonComponent } from './components/save-button/save-button.component';
+import { SnapshotCanvasComponent } from './components/snapshot-canvas/snapshot-canvas.component';
+import { TimerComponent } from './components/timer/timer.component';
+import { FramerateSliderComponent } from './components/framerate-slider/framerate-slider.component';
+import { VideoComponent } from './components/video/video.component';
+import { TabbarComponent } from './components/tabbar/tabbar.component';
+import { CaptureButtonComponent } from './components/capture-button/capture-button.component';
+import { PlayerCanvasComponent } from './components/player-canvas/player-canvas.component';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { RouterModule } from '@angular/router';
+import { UndoButtonComponent } from './components/undo-button/undo-button.component';
+import { RecordAudioButtonComponent } from './components/record-audio-button/record-audio-button.component';
+import { CameraSelectButtonComponent } from './components/camera-select-button/camera-select-button.component';
+import { PlayButtonComponent } from './components/play-button/play-button.component';
 
 describe('AnimatorPage', () => {
   let component: AnimatorPage;
   let fixture: ComponentFixture<AnimatorPage>;
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [ AnimatorPage ],
-      imports: [IonicModule.forRoot()]
+      declarations: [ AnimatorPage, ToolbarComponent, ThumbnailsComponent, SettingsPage, SettingsButtonComponent, ClearButtonComponent, LoadButtonComponent, SaveButtonComponent, SnapshotCanvasComponent, TimerComponent, CaptureButtonComponent, PlayerCanvasComponent, FramerateSliderComponent, VideoComponent, TabbarComponent, UndoButtonComponent, RecordAudioButtonComponent, CameraSelectButtonComponent, PlayButtonComponent],
+      imports: [IonicModule.forRoot(), TranslateModule.forRoot(), HttpClientTestingModule, NoopAnimationsModule, RouterModule.forRoot([])]
     }).compileComponents();
 
     fixture = TestBed.createComponent(AnimatorPage);

src/app/pages/animator/animator.page.spec.ts

@@ -1,7 +1,8 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
-
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { CameraSelectButtonComponent } from './camera-select-button.component';
+import { TranslateModule } from '@ngx-translate/core';
 
 describe('CameraSelectButtonComponent', () => {
   let component: CameraSelectButtonComponent;
@@ -10,7 +11,7 @@ describe('CameraSelectButtonComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ CameraSelectButtonComponent ],
-      imports: [IonicModule.forRoot()]
+      imports: [IonicModule.forRoot(), TranslateModule.forRoot(), HttpClientTestingModule]
     }).compileComponents();
 
     fixture = TestBed.createComponent(CameraSelectButtonComponent);

src/app/pages/animator/components/camera-select-button/camera-select-button.component.spec.ts

@@ -1,7 +1,8 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
-
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { CaptureButtonComponent } from './capture-button.component';
+import { TranslateModule } from '@ngx-translate/core';
 
 describe('CaptureButtonComponent', () => {
   let component: CaptureButtonComponent;
@@ -10,7 +11,7 @@ describe('CaptureButtonComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ CaptureButtonComponent ],
-      imports: [IonicModule.forRoot()]
+      imports: [IonicModule.forRoot(), TranslateModule.forRoot(), HttpClientTestingModule]
     }).compileComponents();
 
     fixture = TestBed.createComponent(CaptureButtonComponent);

src/app/pages/animator/components/capture-button/capture-button.component.spec.ts

@@ -1,7 +1,8 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
-
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { ClearButtonComponent } from './clear-button.component';
+import { TranslateModule } from '@ngx-translate/core';
 
 describe('ClearButtonComponent', () => {
   let component: ClearButtonComponent;
@@ -10,7 +11,7 @@ describe('ClearButtonComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ ClearButtonComponent ],
-      imports: [IonicModule.forRoot()]
+      imports: [IonicModule.forRoot(), TranslateModule.forRoot(), HttpClientTestingModule]
     }).compileComponents();
 
     fixture = TestBed.createComponent(ClearButtonComponent);

src/app/pages/animator/components/clear-button/clear-button.component.spec.ts

@@ -1,7 +1,8 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
-
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { FramerateSliderComponent } from './framerate-slider.component';
+import { TranslateModule } from '@ngx-translate/core';
 
 describe('FramerateSliderComponent', () => {
   let component: FramerateSliderComponent;
@@ -10,7 +11,7 @@ describe('FramerateSliderComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ FramerateSliderComponent ],
-      imports: [IonicModule.forRoot()]
+      imports: [IonicModule.forRoot(), TranslateModule.forRoot(), HttpClientTestingModule]
     }).compileComponents();
 
     fixture = TestBed.createComponent(FramerateSliderComponent);

src/app/pages/animator/components/framerate-slider/framerate-slider.component.spec.ts

@@ -1,7 +1,8 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
-
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { LoadButtonComponent } from './load-button.component';
+import { TranslateModule } from '@ngx-translate/core';
 
 describe('LoadButtonComponent', () => {
   let component: LoadButtonComponent;
@@ -10,7 +11,7 @@ describe('LoadButtonComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ LoadButtonComponent ],
-      imports: [IonicModule.forRoot()]
+      imports: [IonicModule.forRoot(), TranslateModule.forRoot(), HttpClientTestingModule]
     }).compileComponents();
 
     fixture = TestBed.createComponent(LoadButtonComponent);

src/app/pages/animator/components/load-button/load-button.component.spec.ts

@@ -1,7 +1,8 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
-
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { PlayButtonComponent } from './play-button.component';
+import { TranslateModule } from '@ngx-translate/core';
 
 describe('PlayButtonComponent', () => {
   let component: PlayButtonComponent;
@@ -10,7 +11,7 @@ describe('PlayButtonComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ PlayButtonComponent ],
-      imports: [IonicModule.forRoot()]
+      imports: [IonicModule.forRoot(), TranslateModule.forRoot(), HttpClientTestingModule]
     }).compileComponents();
 
     fixture = TestBed.createComponent(PlayButtonComponent);

src/app/pages/animator/components/play-button/play-button.component.spec.ts

@@ -1,7 +1,8 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
-
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { PlayerCanvasComponent } from './player-canvas.component';
+import { TranslateModule } from '@ngx-translate/core';
 
 describe('PlayerCanvasComponent', () => {
   let component: PlayerCanvasComponent;
@@ -10,7 +11,7 @@ describe('PlayerCanvasComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ PlayerCanvasComponent ],
-      imports: [IonicModule.forRoot()]
+      imports: [IonicModule.forRoot(), TranslateModule.forRoot(), HttpClientTestingModule]
     }).compileComponents();
 
     fixture = TestBed.createComponent(PlayerCanvasComponent);

src/app/pages/animator/components/player-canvas/player-canvas.component.spec.ts

@@ -1,7 +1,8 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
-
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { RecordAudioButtonComponent } from './record-audio-button.component';
+import { TranslateModule } from '@ngx-translate/core';
 
 describe('RecordAudioButtonComponent', () => {
   let component: RecordAudioButtonComponent;
@@ -10,7 +11,7 @@ describe('RecordAudioButtonComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ RecordAudioButtonComponent ],
-      imports: [IonicModule.forRoot()]
+      imports: [IonicModule.forRoot(), TranslateModule.forRoot(), HttpClientTestingModule]
     }).compileComponents();
 
     fixture = TestBed.createComponent(RecordAudioButtonComponent);

src/app/pages/animator/components/record-audio-button/record-audio-button.component.spec.ts

@@ -1,7 +1,8 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
-
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { SaveButtonComponent } from './save-button.component';
+import { TranslateModule } from '@ngx-translate/core';
 
 describe('SaveButtonComponent', () => {
   let component: SaveButtonComponent;
@@ -10,7 +11,7 @@ describe('SaveButtonComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ SaveButtonComponent ],
-      imports: [IonicModule.forRoot()]
+      imports: [IonicModule.forRoot(), TranslateModule.forRoot(), HttpClientTestingModule]
     }).compileComponents();
 
     fixture = TestBed.createComponent(SaveButtonComponent);

src/app/pages/animator/components/save-button/save-button.component.spec.ts

@@ -2,6 +2,7 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
 
 import { SettingsButtonComponent } from './settings-button.component';
+import { TranslateModule } from '@ngx-translate/core';
 
 describe('SettingsButtonComponent', () => {
   let component: SettingsButtonComponent;
@@ -10,7 +11,7 @@ describe('SettingsButtonComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [ SettingsButtonComponent ],
-      imports: [IonicModule.forRoot()]
+      imports: [IonicModule.forRoot(), TranslateModule.forRoot()]
     }).compileComponents();
 
     fixture = TestBed.createComponent(SettingsButtonComponent);

src/app/pages/animator/components/settings-button/settings-button.component.spec.ts

@@ -2,17 +2,23 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { RouterTestingModule } from '@angular/router/testing';
 import { IonicModule } from '@ionic/angular';
 import { BaseService } from '@services/base/base.service';
-
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { TabbarComponent } from './tabbar.component';
+import { PlayButtonComponent } from '../play-button/play-button.component';
+import { UndoButtonComponent } from '../undo-button/undo-button.component';
+import { CaptureButtonComponent } from '../capture-button/capture-button.component';
+import { RecordAudioButtonComponent } from '../record-audio-button/record-audio-button.component';
+import { TranslateModule } from '@ngx-translate/core';
+import { CameraSelectButtonComponent } from '../camera-select-button/camera-select-button.component';
 
 describe('HeaderComponent', () => {
   let component: TabbarComponent;
   let fixture: ComponentFixture<TabbarComponent>;
 
   beforeEach((() => {
     TestBed.configureTestingModule({
-      declarations: [ TabbarComponent ],
-      imports: [IonicModule.forRoot(), RouterTestingModule],
+      declarations: [ TabbarComponent, PlayButtonComponent, UndoButtonComponent, CaptureButtonComponent, RecordAudioButtonComponent, CameraSelectButtonComponent ],
+      imports: [IonicModule.forRoot(), RouterTestingModule, TranslateModule.forRoot(), HttpClientTestingModule],
       providers: [BaseService]
     })
     .compileComponents();