Jasmine Angular 模拟组件属性

Question

运行命令：

ng test --codeCoverage=true --progress=false --watch=false

错误信息：

TypeError: Cannot read property 'substring' of undefined

组件的 NgOnInit

private serv: ExtratosMensaisService,
ngOnInit(): void {
  const serventia: Serventia = this.serv.getServentiaSelecionada();
  const competencia: Competencia = this.serv.getCompetenciaSelecionada();
  const titularidade = serventia.titularidade.substring(0, 1).toUpperCase();
}

服务文件方法：

getServentiaSelecionada(): Serventia {
   return JSON.parse(sessionStorage.getItem('serventia'));
}

我知道该属性未定义，但我做不到 'defined'。我已经尝试使用 jasmine.createSpyObj() 中的第三个数组来监视属性，但错误仍然存在。并尝试在 mockExtratosMensaisService returnValue(of({ object })) 上传递一个 JSON 对象，并尝试这样做：

 mockExtratosMensaisService.getServentiaSelecionada.and.returnValue(of({ titularidade: 123 }));

我是不是用错了方法？我需要通过这个测试。

spec.component 文件:

describe('PrestacaoContasTitularComponent', () => {
let component: PrestacaoContasTitularComponent;
let fixture: ComponentFixture<PrestacaoContasTitularComponent>;
const mockExtratosMensaisService = jasmine.createSpyObj('Obj',
['getServentiaSelecionada', 'getCompetenciaSelecionada'],
['titularidade']);

beforeEach(async(() => {
TestBed.configureTestingModule({
  imports: [ RouterTestingModule, HttpClientTestingModule ],
  declarations: [ PrestacaoContasTitularComponent ],
  providers: [ MatDialog, Overlay, MatSnackBar,
    { provide: ActivatedRoute, useValue: {} },
    { provide: InjectionToken, useValue: {} },
    { provide: MAT_DIALOG_SCROLL_STRATEGY, useValue: {} },
    { provide: ExtratosMensaisService, useValue: mockExtratosMensaisService }
  ]
})
.compileComponents();
}));

beforeEach(() => {
  fixture = TestBed.createComponent(PrestacaoContasTitularComponent);
  component = fixture.componentInstance;
  mockExtratosMensaisService.getServentiaSelecionada.and.returnValue(of({ titularidade: 123 }));
  mockExtratosMensaisService.getCompetenciaSelecionada.and.returnValue(of({ data: 'competencia'        }));
  fixture.detectChanges();
});

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

});

Answer 1

您的方法：mockExtratosMensaisService.getServentiaSelecionada.and.returnValue(of({ titularidade: 123 })); 非常好。但是你需要一个可以调用的间谍对象 .and.returnValue() 要得到这个，你可以这样做：spyOn(mockExtratosMensaisService, 'getServentiaSelectionada').and.returnvalue(of({titularidade: 123}))

这应该是一条路。

Answer 2

尝试将模拟更改为：

const mockExtratosMensaisService = jasmine.createSpyObj('Obj', ['getServentiaSelecionada', 'getCompetenciaSelecionada']);

然后做

mockExtratosMensaisService.getServentiaSelecionada.and.returnValue({ titularidade: 'abc' });.

我将 123 更改为 'abc'，因为我不确定子字符串是否适用于数字。之前，您仍然返回，这是不正确的，因为它不是可观察的，它是一个常规的 JavaScript 对象。

Jasmine Angular 模拟组件属性

Jasmine Angular Mock component attribute

testing

mocking

jasmine

angular