From a5d5936b9fa4b5f2355f4994dc3e4497336316b6 Mon Sep 17 00:00:00 2001 From: Ronan Connolly Date: Mon, 29 Apr 2024 19:35:23 +0200 Subject: [PATCH] Update tests to pass --- package-lock.json | 16 ++++++++++ package.json | 3 +- src/app/app.component.spec.ts | 15 --------- ...huck-norris-joke-generator.service.spec.ts | 5 ++- src/app/home/home.component.spec.ts | 10 +++--- src/app/joke-store/joke-store.service.spec.ts | 5 ++- src/app/jokes/jokes.component.spec.ts | 32 ++++++++++++++++--- src/app/jokes/jokes.component.ts | 4 +-- 8 files changed, 61 insertions(+), 29 deletions(-) diff --git a/package-lock.json b/package-lock.json index a7f9781..2ca2281 100644 --- a/package-lock.json +++ b/package-lock.json @@ -33,6 +33,7 @@ "karma-coverage": "~2.2.0", "karma-jasmine": "~5.1.0", "karma-jasmine-html-reporter": "~2.1.0", + "ng-mocks": "^14.12.2", "typescript": "~5.4.2" } }, @@ -9340,6 +9341,21 @@ "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==", "dev": true }, + "node_modules/ng-mocks": { + "version": "14.12.2", + "resolved": "https://registry.npmjs.org/ng-mocks/-/ng-mocks-14.12.2.tgz", + "integrity": "sha512-7HFb1G4I9885ipqdm0o+kPhFvy5EfEooIfl1DqxA84rvig6FhugZ8UDgV6YPYlwnGQyfwmAOexoPTuSVs36bhw==", + "dev": true, + "funding": { + "url": "https://github.com/sponsors/help-me-mom" + }, + "peerDependencies": { + "@angular/common": "5.0.0-alpha - 5 || 6.0.0-alpha - 6 || 7.0.0-alpha - 7 || 8.0.0-alpha - 8 || 9.0.0-alpha - 9 || 10.0.0-alpha - 10 || 11.0.0-alpha - 11 || 12.0.0-alpha - 12 || 13.0.0-alpha - 13 || 14.0.0-alpha - 14 || 15.0.0-alpha - 15 || 16.0.0-alpha - 16 || 17.0.0-alpha - 17", + "@angular/core": "5.0.0-alpha - 5 || 6.0.0-alpha - 6 || 7.0.0-alpha - 7 || 8.0.0-alpha - 8 || 9.0.0-alpha - 9 || 10.0.0-alpha - 10 || 11.0.0-alpha - 11 || 12.0.0-alpha - 12 || 13.0.0-alpha - 13 || 14.0.0-alpha - 14 || 15.0.0-alpha - 15 || 16.0.0-alpha - 16 || 17.0.0-alpha - 17", + "@angular/forms": "5.0.0-alpha - 5 || 6.0.0-alpha - 6 || 7.0.0-alpha - 7 || 8.0.0-alpha - 8 || 9.0.0-alpha - 9 || 10.0.0-alpha - 10 || 11.0.0-alpha - 11 || 12.0.0-alpha - 12 || 13.0.0-alpha - 13 || 14.0.0-alpha - 14 || 15.0.0-alpha - 15 || 16.0.0-alpha - 16 || 17.0.0-alpha - 17", + "@angular/platform-browser": "5.0.0-alpha - 5 || 6.0.0-alpha - 6 || 7.0.0-alpha - 7 || 8.0.0-alpha - 8 || 9.0.0-alpha - 9 || 10.0.0-alpha - 10 || 11.0.0-alpha - 11 || 12.0.0-alpha - 12 || 13.0.0-alpha - 13 || 14.0.0-alpha - 14 || 15.0.0-alpha - 15 || 16.0.0-alpha - 16 || 17.0.0-alpha - 17" + } + }, "node_modules/nice-napi": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/nice-napi/-/nice-napi-1.0.2.tgz", diff --git a/package.json b/package.json index 3ab58f3..506d5ac 100644 --- a/package.json +++ b/package.json @@ -37,6 +37,7 @@ "karma-coverage": "~2.2.0", "karma-jasmine": "~5.1.0", "karma-jasmine-html-reporter": "~2.1.0", + "ng-mocks": "^14.12.2", "typescript": "~5.4.2" } -} \ No newline at end of file +} diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts index 202ec06..7cd488c 100644 --- a/src/app/app.component.spec.ts +++ b/src/app/app.component.spec.ts @@ -13,19 +13,4 @@ describe('AppComponent', () => { const app = fixture.componentInstance; expect(app).toBeTruthy(); }); - - it(`should have the 'chuck-norris-joke-generator' title`, () => { - const fixture = TestBed.createComponent(AppComponent); - const app = fixture.componentInstance; - expect(app.title).toEqual('chuck-norris-joke-generator'); - }); - - it('should render title', () => { - const fixture = TestBed.createComponent(AppComponent); - fixture.detectChanges(); - const compiled = fixture.nativeElement as HTMLElement; - expect(compiled.querySelector('h1')?.textContent).toContain( - 'Hello, chuck-norris-joke-generator', - ); - }); }); diff --git a/src/app/chuck-norris-joke-generator/chuck-norris-joke-generator.service.spec.ts b/src/app/chuck-norris-joke-generator/chuck-norris-joke-generator.service.spec.ts index 245aa8d..8522209 100644 --- a/src/app/chuck-norris-joke-generator/chuck-norris-joke-generator.service.spec.ts +++ b/src/app/chuck-norris-joke-generator/chuck-norris-joke-generator.service.spec.ts @@ -1,12 +1,15 @@ import { TestBed } from '@angular/core/testing'; import { ChuckNorrisJokeGeneratorService } from './chuck-norris-joke-generator.service'; +import { provideHttpClient } from '@angular/common/http'; describe('ChuckNorrisJokeGeneratorService', () => { let service: ChuckNorrisJokeGeneratorService; beforeEach(() => { - TestBed.configureTestingModule({}); + TestBed.configureTestingModule({ + providers: [provideHttpClient()], + }); service = TestBed.inject(ChuckNorrisJokeGeneratorService); }); diff --git a/src/app/home/home.component.spec.ts b/src/app/home/home.component.spec.ts index 60c47c4..f150452 100644 --- a/src/app/home/home.component.spec.ts +++ b/src/app/home/home.component.spec.ts @@ -1,6 +1,9 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { HomeComponent } from './home.component'; +import { JokesComponent } from '../jokes/jokes.component'; + +import { MockComponent } from 'ng-mocks'; describe('HomeComponent', () => { let component: HomeComponent; @@ -8,10 +11,9 @@ describe('HomeComponent', () => { beforeEach(async () => { await TestBed.configureTestingModule({ - imports: [HomeComponent] - }) - .compileComponents(); - + imports: [HomeComponent, MockComponent(JokesComponent)], + }).compileComponents(); + fixture = TestBed.createComponent(HomeComponent); component = fixture.componentInstance; fixture.detectChanges(); diff --git a/src/app/joke-store/joke-store.service.spec.ts b/src/app/joke-store/joke-store.service.spec.ts index e860e0f..70a7a9d 100644 --- a/src/app/joke-store/joke-store.service.spec.ts +++ b/src/app/joke-store/joke-store.service.spec.ts @@ -1,12 +1,15 @@ import { TestBed } from '@angular/core/testing'; import { JokeStoreService } from './joke-store.service'; +import { ChuckNorrisJokeGeneratorService } from '../chuck-norris-joke-generator/chuck-norris-joke-generator.service'; describe('JokeStoreService', () => { let service: JokeStoreService; beforeEach(() => { - TestBed.configureTestingModule({}); + TestBed.configureTestingModule({ + providers: [{ provide: ChuckNorrisJokeGeneratorService, useValue: {} }], + }); service = TestBed.inject(JokeStoreService); }); diff --git a/src/app/jokes/jokes.component.spec.ts b/src/app/jokes/jokes.component.spec.ts index 0416927..0aa29d3 100644 --- a/src/app/jokes/jokes.component.spec.ts +++ b/src/app/jokes/jokes.component.spec.ts @@ -1,17 +1,32 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { JokesComponent } from './jokes.component'; +import { JokeStoreService } from '../joke-store/joke-store.service'; +import { of } from 'rxjs'; +import { CommonModule } from '@angular/common'; describe('JokesComponent', () => { let component: JokesComponent; let fixture: ComponentFixture; beforeEach(async () => { + const jokesStoreService = jasmine.createSpyObj('JokeStoreService', [ + 'getJokes', + ]); + jokesStoreService.getJokes.and.returnValue( + of(['Chuck Norris can divide by zero.']) + ); + await TestBed.configureTestingModule({ - imports: [JokesComponent] - }) - .compileComponents(); - + imports: [JokesComponent, CommonModule], + providers: [ + { + provide: JokeStoreService, + useValue: jokesStoreService, + }, + ], + }).compileComponents(); + fixture = TestBed.createComponent(JokesComponent); component = fixture.componentInstance; fixture.detectChanges(); @@ -20,4 +35,13 @@ describe('JokesComponent', () => { it('should create', () => { expect(component).toBeTruthy(); }); + + it('should render title', () => { + const fixture = TestBed.createComponent(JokesComponent); + fixture.detectChanges(); + const compiled = fixture.nativeElement as HTMLElement; + expect(compiled.querySelector('li')?.textContent).toContain( + 'Chuck Norris can divide by zero.' + ); + }); }); diff --git a/src/app/jokes/jokes.component.ts b/src/app/jokes/jokes.component.ts index fe7f56f..3e795bc 100644 --- a/src/app/jokes/jokes.component.ts +++ b/src/app/jokes/jokes.component.ts @@ -15,8 +15,6 @@ export class JokesComponent { constructor(private jokeStoreService: JokeStoreService) { // TODO: Look into using async pipe? - this.jokeStoreService.getJokes().subscribe((jokes) => { - this.jokes = jokes; - }); + this.jokeStoreService.getJokes().subscribe((jokes) => (this.jokes = jokes)); } }