Angular 卡玛测试注入服务

我正在尝试使用包含http post方法的注入服务测试一个组件。但当我运行测试时，karma向我显示了以下信息：

TypeError:无法读取未定义的属性“response”

这是我的代码：

这是按钮调用的save方法和调用SignupService addUser方法的addUser方法：

save() {
this.addUser();
this.onShowModal();


 }

  private addUser(){
  // Copy the form values over the product object values
  let user = Object.assign({}, this.customer, this.signUpForm.value);
  this.signUpService.addUser(user).subscribe((result) =>         this.onSaveComplete(result),
    (error: any) => this.errorMessage = <any>error);
   this.modalMessage = this.errorMessage


}

addUser (user : Customer){
let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });
return this.http.post(this.url,user,options)
  .map(this.extractResponseData)
  .do(data => console.log('Add user : ' + JSON.stringify(data)))
  .catch(this.handleError);

private handleError(error: Response) {
return Observable.throw(error.json().error || 'Server error');}



 private extractResponseData(response: Response){
let body = response.json();
console.log(body.data);
return body.data || {};

   it('should save the user submetted',() => {
   component.save();
   let signup = component.signUpForm;
   signup.get('firstName').setValue('BEN');
   signup.get('secondName').setValue('wis');
   signup.get('username').setValue('wiss013');
   signup.get('email').setValue('xz@gmail.com');
   signup.get('passwordMatch').get('password').setValue('wis');
   signup.get('passwordMatch').get('confirmPassword').setValue('wis');
   let show = component.showModal;
   expect(show).toBeTruthy();
 });
});

}

最后，这是我处理错误的规范：

save() {
this.addUser();
this.onShowModal();


 }

  private addUser(){
  // Copy the form values over the product object values
  let user = Object.assign({}, this.customer, this.signUpForm.value);
  this.signUpService.addUser(user).subscribe((result) =>         this.onSaveComplete(result),
    (error: any) => this.errorMessage = <any>error);
   this.modalMessage = this.errorMessage


}

addUser (user : Customer){
let headers = new Headers({ 'Content-Type': 'application/json' });
let options = new RequestOptions({ headers: headers });
return this.http.post(this.url,user,options)
  .map(this.extractResponseData)
  .do(data => console.log('Add user : ' + JSON.stringify(data)))
  .catch(this.handleError);

private handleError(error: Response) {
return Observable.throw(error.json().error || 'Server error');}



 private extractResponseData(response: Response){
let body = response.json();
console.log(body.data);
return body.data || {};

   it('should save the user submetted',() => {
   component.save();
   let signup = component.signUpForm;
   signup.get('firstName').setValue('BEN');
   signup.get('secondName').setValue('wis');
   signup.get('username').setValue('wiss013');
   signup.get('email').setValue('xz@gmail.com');
   signup.get('passwordMatch').get('password').setValue('wis');
   signup.get('passwordMatch').get('confirmPassword').setValue('wis');
   let show = component.showModal;
   expect(show).toBeTruthy();
 });
});

---

有人能帮我吗

如果您测试一个组件，那么就模拟一个服务。如果测试服务，请模拟http请求。一次只能测试一个单元。感谢您的回复，但它仍然不工作，并给出相同的错误，我认为我的规范无法识别ExtractResponseData函数中的响应模块。这些是规范文件中导入的模块：

beforeach（异步（（）=>{TestBed.configureTestingModule（{声明：[SignUpComponent]，导入：[FormsModule，BrowserModule，ReactiveFormsModule，ModalModule.forRoot（），HttpModule]，提供程序：[SignUpService，Http，ConnectionBackend]}）.compileComponents（）；}））
describe('Test you service', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [YOUR_SERVICE]
    });
  });

  it('hashCode should return correct hash code', inject([YOUR_SERVICE], (service: YOUR_SERVICE) => {
    ....
  }));
});