Angular 6-承诺注入测试

Angular 6-承诺注入测试,angular,testing,promise,Angular,Testing,Promise,我试图做一个角度的测试,但我有一些问题。 我的代码如下: //LojasService code: import { Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http'; import { Lojas } from './lojas'; @Injectable() export class LojasServices{ constructor(private http :

我试图做一个角度的测试,但我有一些问题。 我的代码如下:

//LojasService code:

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http'; 
import { Lojas } from './lojas';

@Injectable()
export class LojasServices{

constructor(private http : HttpClient){

}

todasLojas(): Promise<Lojas[]>{

    return new Promise((resolve,reject) => {

        this.http.get<Lojas[]>('http://localhost:3000/todasLojas')
        .subscribe(
            (s: Lojas[]) => resolve(s),
            (err) =>  reject(err)
        );

    });

}}
  //here is the test class
describe('Lojas Services', () => {

  beforeEach(() => {

    TestBed.configureTestingModule({
        imports: [HttpClientTestingModule],
        providers: [LojasServices]
    });

});

it('should return a the correct value', inject([LojasServices], (service: LojasServices)=>{

 service.todasLojas().then(a => {
    console.log('loggin');
    expect(a.length).toBe(3);
  }).catch(s => {
    expect(true).toBe(false);
  });

 }));
//Lojas服务代码:
从“@angular/core”导入{Injectable};
从'@angular/common/http'导入{HttpClient};
从“/Lojas”导入{Lojas};
@可注射()
出口类服务{
构造函数(专用http:HttpClient){
}
托达斯洛哈斯():承诺{
返回新承诺((解决、拒绝)=>{
this.http.get('http://localhost:3000/todasLojas')
.订阅(
(s:Lojas[])=>解析,
(错误)=>拒绝(错误)
);
});
}}
//这是考试班
描述('Lojas服务',()=>{
在每个之前(()=>{
TestBed.configureTestingModule({
导入:[HttpClientTestingModule],
提供者:[服务]
});
});
它('应该返回正确的值',注入([LojasServices],(服务:LojasServices)=>{
service.todasLojas().then(a=>{
console.log('loggin');
期望(a.length)toBe(3);
}).catch(s=>{
期望(真),期望(假);
});
}));
我在internet上看到了其他解决方案,但找不到有帮助的解决方案。尝试在注入之前使用“async”,但仍然没有帮助。

您可以尝试以下方法:

import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
import { TestBed } from '@angular/core/testing';

import { LojasServices } from './test.service';

describe('Lojas Services', () => {
    let service: LojasServices;
    let httpTestingController: HttpTestingController;


    beforeEach(() => {

        TestBed.configureTestingModule({
            imports: [HttpClientTestingModule],
            providers: [LojasServices]
        });

        service = TestBed.get(LojasServices);
        httpTestingController= TestBed.get(HttpTestingController);

    });

    afterEach(() => {
        // After every test, assert that there are no more pending requests.
        httpTestingController.verify();
    });

    it('should be created', () => {
        expect(service).toBeTruthy();
    });

    it('should return a the correct value',() => {
        service.todasLojas().then( a => {
            expect(a.length).toBe(3);
        }, err => {
            expect(err).toBeTruthy();
        });
    });

});

我认为您的代码存在两个主要问题:

  • 虽然您在导入
    HttpClientTestingModule
    后没有调用后端服务,但实际上并没有在任何地方进行设置。这里有大量的文档可用于此目的:。但是,要测试这样一个简单的服务,我不必费那么大的劲,
    get()
    方法很容易模拟
  • 第二个主要问题是,您没有等待在规范中解决承诺(“it”函数)。这可以通过使用
    async
    包装回调来解决
我给你准备了这个

下面是.spec的
descripe()

description('Lojas服务',()=>{
const mockReturnValue:Lojas[]=[1,2,3];//更改此值!
const httpSpy=jasmine.createSpyObj('HttpClient',['get']);
httpSpy.get.and.returnValue(of(mockReturnValue));
在每个之前(()=>{
TestBed.configureTestingModule({
//导入:[HttpClientTestingModule]{
console.log('loggin');
期望(a.length)toBe(3);
})
.catch(s=>{
期望(真),期望(假);
});
})));
});

是的,我更改了您的缩进-这纯粹是个人偏好。

您也应该共享您的服务代码片段,这将有助于其他人了解将要测试的内容。还可以共享您得到的错误我下面的答案是否有助于解决您遇到的问题?我尝试了这一点,但当我将httpTestingContr由于无法识别,因此我创建了一个HttpTestingController类型的变量,但该变量也不起作用。更新的代码,您需要从
@angular/common/http/testing';
导入HttpTestingController,如果可能,还需要共享您尝试测试的服务更新代码,并且我使用该服务编辑了代码。错误:预期没有打开的请求sts,发现1:有可能说承诺还没有回应吗?@nkuma_12-我发现最好在Stackblitz之类的东西中编写一个答案作为例子,这样在你试图纠正错误时就不会有太多的来回了。:)
describe('Lojas Services', () => {
    const mockReturnValue: Lojas[] = [1, 2, 3]; // change this!
    const httpSpy = jasmine.createSpyObj('HttpClient', ['get']);
    httpSpy.get.and.returnValue(of(mockReturnValue));

    beforeEach(() => {
        TestBed.configureTestingModule({
            // imports: [ HttpClientTestingModule ], <-- this is commented out
            providers: [ LojasServices, 
                {provide: HttpClient, useValue: httpSpy} // <-- this uses the spy instead of HttpClient
            ]
        });
    });

    it('should return the correct value', async(inject([LojasServices], (service: LojasServices)=>{
        service.todasLojas()
            .then(a => {
                console.log('loggin');
                expect(a.length).toBe(3);
            })
            .catch(s => {
                expect(true).toBe(false);
            });
    })));
});