Angular中有关条件数据的茉莉花测试用例的问题

问题描述

我正在学习用茉莉花编写用于角度应用程序的测试用例，我的html中有如下组件

<app-image [imgData]="pageData['configData']['image']"></app-image>

我的测试用例如下

import { async,ComponentFixture,Testbed } from '@angular/core/testing';
import { PlainTextPipe } from '@pipes/plain-text.pipe';
import { DataService } from '@services/data.service';

import { BasicComponent } from './basic.component';

fdescribe('BasicComponent',() => {
  let component: BasicComponent;
  let fixture: ComponentFixture<BasicComponent>;
  let pageData;

  beforeEach(async(() => {
    Testbed.configureTestingModule({
      declarations: [BasicComponent],providers: [PlainTextPipe]
    })
      .compileComponents();
  }));

  beforeEach(() => {
    fixture = Testbed.createComponent(BasicComponent);
    component = fixture.componentInstance;
    spyOn(component,'renderPage');

    fixture.detectChanges();
  });


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





  it('should initialize',() => {
    component.ngOnInit();
    fixture.detectChanges();
  });

});

当我运行此测试用例时，我得到无法读取未定义的属性'image'，因为在某些情况下我没有图像，在特殊情况下我将如何在测试用例中处理它有图像，在其他情况下，我不会，因为这是常见的组成部分

解决方法

问题是pageData.configData未定义。

尝试：

it('should create',() => {
    component.pageData.configData.image = 'hello'; // not sure if it's a string but you know how to mock it
    expect(component).toBeTruthy();
  });