2016-06-28 21 views
5

Tôi đang sử dụng RC3. Tôi đang triển khai bộ định tuyến Angular2 mới như được ghi ở đây: https://angular.io/docs/ts/latest/guide/router.htmlLàm thế nào để bạn tiêm một dịch vụ angular2 vào một thử nghiệm đơn vị? (RC3)

Mọi thứ đều hoạt động tốt nhưng tôi gặp sự cố khi thử nghiệm đơn vị. Cụ thể, tôi không thể tiêm các dịch vụ Angular2 vào các bài kiểm tra đơn vị của mình.

mã thành phần có liên quan của tôi là:

import {Component} from '@angular/core'; 
import {ActivatedRoute} from '@angular/router'; 

@Component({ 
    templateUrl: ... 
    styleUrls: ... 
}) 

export class Route1DetailComponent { 

    constructor(private route:ActivatedRoute) { 
    console.log(route); 
    } 
} 

kiểm tra đơn vị của tôi trông giống như:

import { 
    expect, it, iit, xit, 
    describe, ddescribe, xdescribe, 
    beforeEach, beforeEachProviders, withProviders, 
    async, inject 
} from '@angular/core/testing'; 

import {ActivatedRoute} from '@angular/router'; 
import {Route1DetailComponent} from './route1-detail.component'; 
import {TestComponentBuilder} from '@angular/compiler/testing'; 

describe('route1-detail.component.ts',() => { 

    beforeEachProviders(() => [ 
    {provide: ActivatedRoute, useClass: ActivatedRoute} 
    ]); 

    it('should instantiate component', 
    async(inject([TestComponentBuilder, ActivatedRoute], (tcb:TestComponentBuilder, ar: ActivatedRoute) => { 
     tcb.createAsync(Route1DetailComponent).then((fixture) => { 
     expect(fixture.componentInstance instanceof Route1DetailComponent).toBe(true, 'should create Route1DetailComponent'); 
     console.log(ar); 
    }); 
    }))); 

});

Kiểm tra đơn vị 'thành phần nhanh chóng' sẽ không thành công. Lỗi là:

Không thể giải quyết tất cả các tham số cho 'ActivatedRoute' (?,?,?,?,?). Đảm bảo rằng tất cả thông số được trang trí bằng Tiêm hoặc có chú thích loại hợp lệ và 'ActivatedRoute' được trang trí với Tiêm.

Làm cách nào để làm việc này?

Khi tôi không tiêm ActivatedRoute mọi thứ hoạt động tốt.

Cảm ơn.

+2

https://github.com/angular/angular/blob/fcfddbf79cfbdca45771bb31c0a2c1f55cff5801/modules/%40angular/router/test/router.spec.ts có thể giúp –

+0

nhiều đánh giá cao vẫn làm việc trên thx này rất hữu ích - nhiều ý tưởng chào đón:) – danday74

Trả lời

9

Khi kiểm tra đơn vị, đôi khi một dịch vụ nhất định gây ra sự cố chỉ vì nó không được sử dụng trong môi trường bình thường. Bạn có thể kiểm tra xem nó có được gọi hay không, mà không cần chạy thử nghiệm đơn vị thông qua toàn bộ dịch vụ. Làm điều này bằng cách tạo một lớp giả.

describe('route1-detail.component.ts',() => { 

class MockActivatedRoute {} 

beforeEachProviders(() => [ 
    {provide: ActivatedRoute, useClass: MockActivatedRoute} 
    ]); 

it('should instantiate component', 
    async(inject([TestComponentBuilder, ActivatedRoute], (tcb:TestComponentBuilder, ar: MockActivatedRoute) => { 
    tcb.createAsync(Route1DetailComponent).then((fixture) => { 
    expect(fixture.componentInstance instanceof Route1DetailComponent).toBe(true, 'should create Route1DetailComponent'); 
    console.log(ar); 
    }); 
}))); 

Lưu ý phần này: inject([TestComponentBuilder, ActivatedRoute], (tcb:TestComponentBuilder, ar: MockActivatedRoute. Khi mã đang tìm ActivatedRoute, bạn đang chuyển cho nó dịch vụ giả lập. Tất nhiên, nếu bạn đang cố gắng để kiểm tra đơn vị ActivatedRoute chính nó, sau đó tạo ra một dịch vụ giả đánh bại mục đích đó. Bạn có thể phải thêm các phương thức hoặc các biến vào lớp mô phỏng nếu nó cố gắng gọi các phương thức từ dịch vụ đó.

+0

cảm ơn rất hữu ích - vẫn đang làm việc với điều này – danday74

+0

hóa ra là một câu trả lời tuyệt vời - cảm ơn bạn rất nhiều – danday74

+0

Vui mừng được giúp đỡ @ danday74 – jhhoff02

Các vấn đề liên quan