angular - 如何使用 ActivatedRoute 测试我的组件?
问题描述
我正在尝试使用 2 个解析器(pagesResolver 和 UploadResolver)测试一个组件:
我的组件:
export class AdminPagesComponent implements OnInit {
fileUploads$: Observable<FileUpload[]>;
pagesList$: Observable<Page[]>;
constructor(
private route: ActivatedRoute
) { }
ngOnInit(): void {
this.pagesSub = this.route.parent.data
.pipe(
map((data: { pages: Observable<Page[]> }) => {
this.pagesList$ = data.pages
return data.pages
}),
mergeMap(res => res.pipe(
map(pages => {
this.pagesService.setPages(pages);
console.log(pages)
})
))
)
.subscribe();
this.uploadSub = this.route.parent.data
.pipe(
map((data: { upload: Observable<FileUpload[]> }) => {
this.fileUploads$ = data.upload
return data.upload
})
)
.subscribe();
}
}
这是我的测试文件:
describe('AdminPagesComponent', () => {
let component: AdminPagesComponent;
let fixture: ComponentFixture<AdminPagesComponent>;
const initialState = {};
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [AdminPagesComponent],
imports: [],
providers: [
{
provide: ActivatedRoute,
useValue: {
parent: {
data: {
}
}
}
}
]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(AdminPagesComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
如果我像这样运行测试,我有这个业力错误:
TypeError: this.route.parent.data.pipe is not a function
我的组件工作正常,数据通过异步管道很好地传递给模板。请问我怎样才能使我的测试成功?
解决方案
你几乎拥有它。你需要在你的情况下data
返回一个Observable
。
import { of } from 'rxjs';
....
providers: [
{
provide: ActivatedRoute,
useValue: {
parent: {
data: of({
pages: undefined,
upload: undefined // mock these two properties however you wish.
}),
}
}
}
]
推荐阅读
- java - 如何使用 Volley 向 Java 中的 JSON 发出带有参数的 GET 请求?
- sql - 如何在 postgres 中创建函数
- django - Heroku 似乎没有将我的管理静态文件添加到 static_root
- c# - 如何检查 XAML 中的复选框?
- hyperledger-fabric - 在 Hyperledger Composer 中,是否有可能拥有一组可以在多个业务网络中使用的参与者?
- javascript - 获取已附加段落的行数
- angular6 - 如何更新 ng2-smart-table 中列的属性值?
- c++ - 在opengl中,如何使用鼠标点击获取帧缓冲区中绘制的图形的像素信息
- r - rmarkdown 1.11 版在现有的预呈现文件上引发错误
- sql - 向 SQL 发送布尔值并将表更新为 1 或 -1 以及如何“更新”初始值的空行