Question

升级到Angular 4后，我遇到了错误 [在此输入图像说明] [1]

客户？afea：119 [at-loader] ./src/test/javascript/spec/app/account/settings/settings.component.spec.ts:49:13 TS2322：类型＆＃39;校长＆＃39;不能分配给＆＃39; MockPrincipal＆＃39;。物业＆＃39; identitySpy＆＃39;类型＆＃39;校长＆＃39;

中缺少

[at-loader] ./src/test/javascript/spec/app/account/settings/settings.component.spec.ts:48:13 TS2322：输入＆＃39; AccountService＆＃39;不能分配给＆＃39; MockAccountService＆＃39;。财产＆＃39; getSpy＆＃39;类型＆＃39; AccountService＆＃39;中缺少。

settings.component.spec.ts

import { ComponentFixture, TestBed, async } from '@angular/core/testing';
import { Observable } from 'rxjs/Rx';
import { JhiLanguageHelper } from '../../../../../../main/webapp/app/shared';
import { AgreeGatewayTestModule } from '../../../test.module';
import { Principal, AccountService } from '../../../../../../main/webapp/app/shared';
import { SettingsComponent } from '../../../../../../main/webapp/app/account/settings/settings.component';
import { MockAccountService } from '../../../helpers/mock-account.service';
import { MockPrincipal } from '../../../helpers/mock-principal.service';


describe('Component Tests', () => {

    describe('SettingsComponent', () => {

        let comp: SettingsComponent;
        let fixture: ComponentFixture<SettingsComponent>;
        let mockAuth: MockAccountService;
        let mockPrincipal: MockPrincipal;

        beforeEach(async(() => {
            TestBed.configureTestingModule({
                imports: [AgreeGatewayTestModule],
                declarations: [SettingsComponent],
                providers: [
                    {
                        provide: Principal,
                        useClass: MockPrincipal
                    },
                    {
                        provide: AccountService,
                        useClass: MockAccountService
                    },
                    {
                        provide: JhiLanguageHelper,
                        useValue: null
                    },
                ]
            }).overrideComponent(SettingsComponent, {
                set: {
                    template: ''
                }
            }).compileComponents();
        }));

        beforeEach(() => {
            fixture = TestBed.createComponent(SettingsComponent);
            comp = fixture.componentInstance;
            console.log(AccountService);
            mockAuth = fixture.debugElement.injector.get(AccountService);
            mockPrincipal = fixture.debugElement.injector.get(Principal);
        });

        it('should send the current identity upon save', function () {
            // GIVEN
            let accountValues = {
                firstName: 'John',
                lastName: 'Doe',

                activated: true,
                email: 'john.doe@mail.com',
                langKey: 'en',
                login: 'john'
            };
            mockPrincipal.setResponse(accountValues);

            // WHEN
            comp.settingsAccount = accountValues;
            comp.save();

            // THEN
            expect(mockPrincipal.identitySpy).toHaveBeenCalled();
            expect(mockAuth.saveSpy).toHaveBeenCalledWith(accountValues);
            expect(comp.settingsAccount).toEqual(accountValues);
        });

        it('should notify of success upon successful save', function () {
            // GIVEN
            let accountValues = {
                firstName: 'John',
                lastName: 'Doe'
            };
            mockPrincipal.setResponse(accountValues);

            // WHEN
            comp.save();

            // THEN
            expect(comp.error).toBeNull();
            expect(comp.success).toBe('OK');
        });

        it('should notify of error upon failed save', function () {
            // GIVEN
            mockAuth.saveSpy.and.returnValue(Observable.throw('ERROR'));

            // WHEN
            comp.save();

            // THEN
            expect(comp.error).toEqual('ERROR');
            expect(comp.success).toBeNull();
        });
    });
});

account.service.ts

import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import { Observable } from 'rxjs/Rx';

@Injectable()
export class AccountService  {
    constructor(private http: Http) { }

    get(): Observable<any> {
        return this.http.get('api/account').map((res: Response) => res.json());
    }

    save(account: any): Observable<Response> {
        return this.http.post('api/account', account);
    }
}

模拟account.service.ts

import { SpyObject } from './spyobject';
import { AccountService } from '../../../../main/webapp/app/shared/auth/account.service';
import Spy = jasmine.Spy;

export class MockAccountService extends SpyObject {

    getSpy: Spy;
    saveSpy: Spy;
    fakeResponse: any;

    constructor() {
        super(AccountService);

        this.fakeResponse = null;
        this.getSpy = this.spy('get').andReturn(this);
        this.saveSpy = this.spy('save').andReturn(this);
    }

    subscribe(callback: any) {
        callback(this.fakeResponse);
    }

    setResponse(json: any): void {
        this.fakeResponse = json;
    }
}

模拟principal.service.ts

import { SpyObject } from './spyobject';
import { Principal } from '../../../../main/webapp/app/shared/auth/principal.service';
import Spy = jasmine.Spy;

export class MockPrincipal extends SpyObject {

    identitySpy: Spy;
    fakeResponse: any;

    constructor() {
        super(Principal);

        this.fakeResponse = {};
        this.identitySpy = this.spy('identity').andReturn(Promise.resolve(this.fakeResponse));
    }

    setResponse(json: any): void {
        this.fakeResponse = json;
    }
}

Answer 1

我对测试并不熟悉，所以我真的不知道，但我认为你必须在你的测试平台上提供正确的服务。你嘲笑需要扩展提供者以避免类型冲突。

beforeEach(async(() => {
            TestBed.configureTestingModule({
                imports: [AgreeGatewayTestModule],
                declarations: [SettingsComponent],
                providers: [
                    {
                        provide: SpyObject, //changed this
                        useClass: MockPrincipal
                    },
                    {
                        provide: SpyObject, //changed this
                        useClass: MockAccountService
                    },
                    {
                        provide: JhiLanguageHelper,
                        useValue: null
                    },
                ]
            }).overrideComponent(SettingsComponent, {
                set: {
                    template: ''
                }
            }).compileComponents();
        }));

如果不有效，您可以尝试使用Principal和AccountService

export class MockPrincipal extends Principal {

    identitySpy: Spy;
    fakeResponse: any;

    constructor() {
        super(Principal);

        this.fakeResponse = {};
        this.identitySpy = this.spy('identity').andReturn(Promise.resolve(this.fakeResponse));
    }

    setResponse(json: any): void {
        this.fakeResponse = json;
    }
}

和

export class MockAccountService extends AccountService {

    getSpy: Spy;
    saveSpy: Spy;
    fakeResponse: any;

    constructor() {
        super(AccountService);

        this.fakeResponse = null;
        this.getSpy = this.spy('get').andReturn(this);
        this.saveSpy = this.spy('save').andReturn(this);
    }

    subscribe(callback: any) {
        callback(this.fakeResponse);
    }

    setResponse(json: any): void {
        this.fakeResponse = json;
    }
}

类型转换问题升级到Angular 4之后

1 个答案: