BETTERZON-83: Writing unit tests for angular to improve code coverage

This commit is contained in:
Patrick Müller 2021-05-02 15:38:28 +02:00
parent cab6000233
commit 7bf8b73fb7
11 changed files with 232 additions and 145 deletions

View File

@ -88,6 +88,7 @@
"tsConfig": "tsconfig.spec.json", "tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js", "karmaConfig": "karma.conf.js",
"codeCoverage": true, "codeCoverage": true,
"codeCoverageExclude": ["src/app/mocks/mock.service.ts"],
"assets": [ "assets": [
"src/favicon.ico", "src/favicon.ico",
"src/assets" "src/assets"
@ -128,6 +129,7 @@
} }
} }
} }
}}, }
},
"defaultProject": "Betterzon" "defaultProject": "Betterzon"
} }

View File

@ -28,6 +28,7 @@ describe('AppComponent', () => {
it('should create the app', () => { it('should create the app', () => {
const fixture = TestBed.createComponent(AppComponent); const fixture = TestBed.createComponent(AppComponent);
const app = fixture.componentInstance; const app = fixture.componentInstance;
app.ngOnInit();
expect(app).toBeTruthy(); expect(app).toBeTruthy();
}); });

View File

@ -11,7 +11,7 @@ import {ImprintComponent} from './pages/imprint/imprint.component';
import {PrivacyComponent} from './pages/privacy/privacy.component'; import {PrivacyComponent} from './pages/privacy/privacy.component';
const routes: Routes = [ const routes: Routes = [
{path: '', component: LandingpageComponent}, {path: '', component: LandingpageComponent, pathMatch: 'full'},
{path: 'search', component: ProductSearchPageComponent}, {path: 'search', component: ProductSearchPageComponent},
{path: 'product/:id', component: ProductDetailPageComponent}, {path: 'product/:id', component: ProductDetailPageComponent},
{path: 'impressum', component: ImprintComponent}, {path: 'impressum', component: ImprintComponent},

View File

@ -2,13 +2,21 @@ import {ComponentFixture, TestBed} from '@angular/core/testing';
import {FooterComponent} from './footer.component'; import {FooterComponent} from './footer.component';
import {RouterTestingModule} from "@angular/router/testing"; import {RouterTestingModule} from "@angular/router/testing";
import {AppComponent} from "../../app.component";
import {ImprintComponent} from "../../pages/imprint/imprint.component";
import {ActivatedRoute, Router} from "@angular/router";
describe('FooterComponent', () => { describe('FooterComponent', () => {
let component: FooterComponent; let component: FooterComponent;
let fixture: ComponentFixture<FooterComponent>; let fixture: ComponentFixture<FooterComponent>;
let router = {
navigate: jasmine.createSpy('navigate'),
routerState: jasmine.createSpy('routerState')
}
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
providers: [{provide: Router, useValue: router}],
declarations: [FooterComponent], declarations: [FooterComponent],
imports: [ imports: [
RouterTestingModule RouterTestingModule
@ -26,4 +34,9 @@ describe('FooterComponent', () => {
it('should create', () => { it('should create', () => {
expect(component).toBeTruthy(); expect(component).toBeTruthy();
}); });
it('should navigate to /impressum when navigateImprint() is called', () => {
component.navigateImprint();
expect(router.navigate).toHaveBeenCalledWith(['/impressum']);
});
}); });

View File

@ -17,7 +17,7 @@ export class FooterComponent implements OnInit {
} }
navigateImprint(): void { navigateImprint(): void {
this.router.navigate([('/impressum/')]); this.router.navigate([('/impressum')]);
} }
} }

View File

@ -3,13 +3,23 @@ import {ComponentFixture, TestBed} from '@angular/core/testing';
import {HeaderComponent} from './header.component'; import {HeaderComponent} from './header.component';
import {RouterTestingModule} from "@angular/router/testing"; import {RouterTestingModule} from "@angular/router/testing";
import {MatMenuModule} from "@angular/material/menu"; import {MatMenuModule} from "@angular/material/menu";
import {Router} from "@angular/router";
describe('HeaderComponent', () => { describe('HeaderComponent', () => {
let component: HeaderComponent; let component: HeaderComponent;
let fixture: ComponentFixture<HeaderComponent>; let fixture: ComponentFixture<HeaderComponent>;
let router = {
navigate: jasmine.createSpy('navigate'),
navigateByUrl: (url: string) => {
return {
then: () => {}
}
}
}
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
providers: [{provide: Router, useValue: router}],
declarations: [HeaderComponent], declarations: [HeaderComponent],
imports: [ imports: [
RouterTestingModule, RouterTestingModule,

View File

@ -8,10 +8,22 @@ import {ApiService} from "../../services/api.service";
class MockApiService extends AbstractMockObservableService { class MockApiService extends AbstractMockObservableService {
getCurrentPricePerVendor() { getCurrentPricePerVendor() {
this.content = [];
return this; return this;
} }
getVendors() { getVendors() {
const vendor = {
vendor_id: 1,
name: 'Max Mustermann',
streetname: 'Musterstraße 69',
zip_code: '12345',
city: 'Musterhausen',
country_code: 'DE',
phone: '+49 123 4567890',
website: 'https://www.amazon.de',
};
this.content = [vendor];
return this; return this;
} }
} }

View File

@ -30,7 +30,17 @@ class MockApiService extends AbstractMockObservableService {
} }
getVendors() { getVendors() {
this.content = []; const vendor = {
vendor_id: 1,
name: 'Max Mustermann',
streetname: 'Musterstraße 69',
zip_code: '12345',
city: 'Musterhausen',
country_code: 'DE',
phone: '+49 123 4567890',
website: 'https://www.amazon.de',
}
this.content = [vendor];
return this; return this;
} }
} }

View File

@ -6,13 +6,16 @@ import {HeaderComponent} from "../header/header.component";
import {RouterTestingModule} from "@angular/router/testing"; import {RouterTestingModule} from "@angular/router/testing";
import {ApiService} from "../../services/api.service"; import {ApiService} from "../../services/api.service";
import {AbstractMockObservableService} from "../../mocks/mock.service"; import {AbstractMockObservableService} from "../../mocks/mock.service";
import {Router} from "@angular/router";
class MockApiService extends AbstractMockObservableService { class MockApiService extends AbstractMockObservableService {
getProducts() { getProducts() {
this.content = [];
return this; return this;
} }
getProductsByQuery() { getProductsByQuery() {
this.content = [];
return this; return this;
} }
} }
@ -21,11 +24,15 @@ describe('ProductListComponent', () => {
let component: ProductListComponent; let component: ProductListComponent;
let fixture: ComponentFixture<ProductListComponent>; let fixture: ComponentFixture<ProductListComponent>;
let mockService; let mockService;
let router = {
navigate: jasmine.createSpy('navigate'),
routerState: jasmine.createSpy('routerState')
}
beforeEach(async () => { beforeEach(async () => {
mockService = new MockApiService(); mockService = new MockApiService();
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
providers: [{provide: ApiService, useValue: mockService}], providers: [{provide: ApiService, useValue: mockService}, {provide: Router, useValue: router}],
declarations: [ProductListComponent], declarations: [ProductListComponent],
imports: [ imports: [
RouterTestingModule RouterTestingModule
@ -43,4 +50,30 @@ describe('ProductListComponent', () => {
it('should create', () => { it('should create', () => {
expect(component).toBeTruthy(); expect(component).toBeTruthy();
}); });
it('should load products by search query when type is search', () => {
component.type = 'search';
component.loadParams();
expect(component.products).toBeTruthy();
});
it('should navigate to /product/xyz when navigateImprint() is called', () => {
const product = {
product_id: 1,
asin: 'ASIN',
is_active: true,
name: 'Super tolles Produkt',
short_description: 'Descr',
long_description: 'Descr',
image_guid: '123',
date_added: new Date(),
last_modified: new Date(),
manufacturer_id: 1,
selling_rank: '1',
category_id: 1
}
component.clickedProduct(product);
expect(router.navigate).toHaveBeenCalledWith(['/product/1']);
});
}); });

View File

@ -2,13 +2,19 @@ import {ComponentFixture, TestBed} from '@angular/core/testing';
import {LandingpageComponent} from './landingpage.component'; import {LandingpageComponent} from './landingpage.component';
import {RouterTestingModule} from "@angular/router/testing"; import {RouterTestingModule} from "@angular/router/testing";
import {Router} from "@angular/router";
describe('LandingpageComponent', () => { describe('LandingpageComponent', () => {
let component: LandingpageComponent; let component: LandingpageComponent;
let fixture: ComponentFixture<LandingpageComponent>; let fixture: ComponentFixture<LandingpageComponent>;
let router = {
navigate: jasmine.createSpy('navigate'),
routerState: jasmine.createSpy('routerState')
}
beforeEach(async () => { beforeEach(async () => {
await TestBed.configureTestingModule({ await TestBed.configureTestingModule({
providers: [{provide: Router, useValue: router}],
declarations: [LandingpageComponent], declarations: [LandingpageComponent],
imports: [ imports: [
RouterTestingModule RouterTestingModule