茉莉花测试用例依赖于角度2与存根

时间:2017-03-25 19:52:14

标签: unit-testing angular karma-jasmine angular2-routing stubs

在这里,我对使用jasmine + karma的角度2测试用例不熟悉并且我正在关注此testing guide我尝试编写测试用例但无法正确编写并且因为测试用例将转到服务器而出现路由错误在跑步时,虽然不应该。 有一个类似this的问题,但没有帮助我解决问题。请指导我。

这是我的组件

import { Component, OnInit, ViewChild } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { Checklist } from './checklist';
import { Job } from '../+job/job'; 
import { OriginalService } from './original.service';
import { UserService } from '../core/user/user.service';
import { ModalDirective } from 'ng2-bootstrap/ng2-bootstrap';

@Component({
    selector: 'app-selector',
    templateUrl: './original.component.html',
    providers: [OriginalService]
})
export class OriginalComponent implements OnInit {
  items = []
  job: Job;
  checklist: Checklist;
  user: any;
  shopId: any;
  jobId: any;

  constructor ( private orgService: OriginalService, private route: ActivatedRoute, private router: Router, userService: UserService) {
     this.user = userService.user();
  }

  ngOnInit() {
    this.route.params
      .map(params => params['job_id'])
      .subscribe(
         job_id => this.jobId = job_id
      );
      this.getChecklist();
      this.getJob();
  }

  getChecklist() {
    this.orgService.getChecklists({
      jobId: this.jobId
    })
    .then(checklist=> {
       this.gotJobdata = true;
       this.checklist = checklist.response})
    .catch(error => this.error = error);
  }

  getJob(){
    this.orgService.getJob({
     jobId: this.jobId
    })
    .then(job => this.job = job.response)
    .catch(error => this.error = error);
  }
}

这是我的服务

import { Injectable, ViewChildren }    from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import { environment } from '../../environments/environment'
import 'rxjs/add/operator/toPromise';
import { Checklist } from './checklist'; 
import { Job } from '../+job/job';
import { UserService } from '../core/user/user.service';

@Injectable()

export class OriginalService {
 shopId: any;

 constructor(private http: Http, private userService: UserService ) {
   this.shopId = userService.shopId();
 }

  getChecklists(svc): Promise<Checklist> {
    return this.http.get(environment.apiUrl + this.shopId + '/jobs/' + svc.jobId + '/checklists_path/' + 'check_item.json')
     .toPromise()
     .then(response => response.json())
     .catch(this.handleError);
  } 

  getJob(svc): Promise<Job> {
    return this.http.get(return environment.apiUrl + this.shopId + '/jobs/' + svc.jobId + '.json')
    .toPromise()
    .then(response => response.json())
    .catch(this.handleError);
  }
}

这是我尝试过的规范:

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { SharedModule } from '../shared/shared.module';
import { ModalModule } from 'ng2-bootstrap/ng2-bootstrap'; 
import { HttpModule } from '@angular/http';
import { Router, ActivatedRoute, Params } from '@angular/router';
import { ComponentLoaderFactory } from 'ng2-bootstrap/component-loader';
import { Subject } from 'rxjs/Subject';
import { UserService } from '../core/user/user.service';
import { OriginalService } from './original.service';
import { OriginalComponent } from './original.component';

describe('OriginalComponent', () => {

  let component: OriginalComponent;
  let fixture: ComponentFixture<OriginalComponent>;
  let params: Subject<Params>;
  let userService, orgService;

  let userServiceStub = {
   isLoggedIn: true,
   user: { name: 'Test User'}
  };

  beforeEach(async(() => {
   params = new Subject<Params>();
   TestBed.configureTestingModule({

   imports: [ ModalModule.forRoot(), SharedModule, HttpModule ],  
   declarations: [ OriginalComponent ],
   providers: [ OriginalService, UserService, ComponentLoaderFactory,
    { provide: Router, useValue: userServiceStub }, {provide: ActivatedRoute, useValue: { params: params }} ]
   })
   .compileComponents();
 })
);


beforeEach(() => {

  fixture = TestBed.createComponent(ChecklistComponent);
  component = fixture.componentInstance;
  fixture.detectChanges();

  it('should create', () => {
   expect(component).toBeTruthy();
  });
});
  

请纠正我如何在我做错的测试用例或存根中正确使用路由。

0 个答案:

没有答案