Angular 带激活路由的角度测试组件

我在测试使用ActivatedRoute的组件时遇到了一个大问题-我只想通过默认测试“component.toBeTruthy”

组件类别：

@Component({
  selector: 'app-room',
  templateUrl: './room.component.html',
  styleUrls: ['./room.component.css']
})
export class RoomComponent implements OnInit {

  roomId:string;

  constructor(private route: ActivatedRoute) { }

  ngOnInit() {
    this.roomId = this.route.snapshot.params.id;
  }

}

测试：

description（'RoomComponent'，（）=>{
let组件：RoomComponent；
let夹具：组件夹具；
beforeach（异步（（）=>{
设temp=new ActivatedRouteStub（）；
TestBed.configureTestingModule({
声明：[RoomComponent]，
导入：[MaterialModule，FormsModule，RouterModule，BrowserModule，BrowserAnimationsModule]，
提供者：[MatDialog、MatToolbar、RoomService、，
{
提供：ActivatedRoute，useValue:{}
}
],
模式：[自定义元素模式，无错误模式]
})
.compileComponents（）；
}));
在每个之前（（）=>{
fixture=TestBed.createComponent（RoomComponent）；
组件=fixture.componentInstance；
fixture.detectChanges（）；
});
它（'应该创建'，（）=>{
expect（component.toBeTruthy（）；
});
});

问题是，当我开始测试时，它会以奇怪的错误失败：

Chrome 65.0.3325（Mac OS X 10.13.4）错误 { “消息”：“未捕获的网络错误：未能在“XMLHttpRequest”上执行“发送”：未能加载“ng:///DynamicTestModule/RoomComponent\u Host.ngfactory.js”。\n\n错误：未能在“XMLHttpRequest”上执行“发送”：未能加载“ng:///DynamicTestModule/RoomComponent\u Host.ngfactory.js”。\n在\n在XMLHttpRequest.proto上。（匿名函数）[作为发送]（）\n在数组中。（节点\模块/源地图支持/浏览器源地图支持.js:107:134）\n在节点\模块/源地图支持/浏览器源地图支持.js:101:106\n

如果我从ngOnInit中删除此行

this.roomId=this.route.snapshot.params.id；

，一切正常

---

发生了什么事？

我的直觉说错误信息可能与实际问题无关

问题是您正在使用

{}

作为

ActivatedRoute

的提供程序。然后，在您的组件中，您试图访问

ActivatedRoute

，在测试用例中，它是

{}

您能否尝试将您的

提供商

替换为：

providers: [MatDialog, MatToolbar, RoomService,
{
  provide: ActivatedRoute, useValue: {
    snapshot: { params: { id: 123 } }
  }
}];

---

有两件事：试着在运行测试时将SoReMaCAP关闭以获得对失败的更多反馈；并且考虑使用<代码> RouterTestingModule <代码>来进行更为受控的测试环境。我可能已经看到了路由器测试模块@ JONRSARPE的第一个答案，我完全忘记了这一点。这是一个答案！我正在删除我的其他注释和答案，因为它们是无用的，或者只是鹦鹉学舌。sourcemaps关闭帮助！-我必须提供{snapshot:{params:{id:''}}}

providers: [MatDialog, MatToolbar, RoomService,
{
  provide: ActivatedRoute, useValue: {
    snapshot: { params: { id: 123 } }
  }
}];