业力：类型错误：无法读取未定义的属性(读取"订阅")

Question

我正在尝试测试一个包含订阅的方法(refreshMemberList(((，但当我运行测试时，我从Karma那里得到了这个错误。有人能告诉我发生了什么事吗？提前非常感谢你，你是一个如此伟大的社区：D

Jasmine规范列表失败：

MemberListComponent > refreshMemberList refreshes members list
TypeError: Cannot read properties of undefined (reading 'subscribe')

member-list.component.ts:

describe('MemberListComponent', () => {
let component: MemberListComponent;
let fixture: ComponentFixture<MemberListComponent>;
let mockMemberListService: jasmine.SpyObj<MemberListService>;
let modalService: NgbModal;
beforeEach(async () => {
mockMemberListService = jasmine.createSpyObj(['getMembers']);
mockMemberListService.getMembers.and.returnValue(memberMockObject.fakeMemberListJSON);
await TestBed.configureTestingModule({
imports: [HttpClientTestingModule],
providers: [
{
provide: MemberListService,
useValue: mockMemberListService,
}
],
declarations: [MemberListComponent],
}).compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(MemberListComponent);
component = fixture.componentInstance;
modalService = TestBed.get(NgbModal);
});
it('refreshMemberList refreshes members list', () => {
component.refreshMemberList(memberMockObject.dataMemberMap);
fixture.detectChanges();
expect(component.members).toEqual(memberMockObject.fakeMembers);
});

});

member-list.component.ts:

export class MemberListComponent implements OnInit {
public title: String = "Members";
public showMemberDeletedAlert: Boolean;
private _memberListService: MemberListService;
public members: Member[] = []; 
private dataMemberMap: Map<string, string>;
public page: number = 0;
public pageSize: number = 10;
public collectionSize: number;
public isLoading: boolean = true;
constructor(
memberListService: MemberListService,
private _modalService: NgbModal
) {
this._memberListService = memberListService;
}
ngOnInit(): void {
if(history.state.type==="delete")
this.showDeletedAlert()
this.dataMemberMap =  new Map([
["name", ""],
["role", ""],
["skill", ""],
["skillLevel", ""],
["language", ""],
["languageLevel", ""]
]);
this.retrieveMemberList();
}
retrieveMemberList(): void {
this.isLoading = true;
this._memberListService.getMembers(this.dataMemberMap!, this.page, this.pageSize).subscribe((data) => {
this.members = data.memberList;
this.collectionSize = data.totalPages * this.pageSize;
this.isLoading = false;
});
}
refreshMemberList(dataMemberMap: Map<string, string>): void {
this.dataMemberMap = dataMemberMap;
this.retrieveMemberList();
}
}

Answer 1

为什么有MemberListService类型的类属性？只需将依赖项注入用作

constructor(private memberListService: MemberListService) {} 

然后将其用作：

...
this.memberListService.getMembers(...);

此外，在ngOnInit生命周期挂钩中，所有这些逻辑从一开始就被触发了，这很好；这个组件的第一个测试应该是：

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

这个测试(默认情况下是第一个测试(验证组件的成功创建，因此ngOnInit中的任何逻辑都将被测试，其中一些逻辑正在调用getMembers服务函数并发送3个参数，可能其中一些或全部是undefined？

此外，我不知道memberMockObject在您的测试文件中是什么，所以为了设置返回类型，我想说使用rxjs中的of来创建observable:

mockMemberListService.getMembers
.and.returnValue(of(yourDesiredValueHere));

Answer 2

它是未定义的，所以不能读取subscribe属性，因为你希望这个(_memberListService(是私有的，你可以在构造函数上使用(memberListService(作为私有的，而不使用_memberList Service，它有点像

constructor(
private memberListService: MemberListService,
private _modalService: NgbModal
) {}

当你调用getMembers时，你可以只使用this.memberListService.getMembers(...