Angular 6 测试 Jasmine Karma：覆盖提供程序不起作用

Question

所以我在网上查看了很多问题，包括这个 https://github.com/angular/quickstart/issues/320 我被难住了......

我的代码设置方式是我的主要描述创建了我的测试平台组件，在这里我为活动路由设置了我的 mockParams，所以我们可以 this.route.queryparams.subscribe(..)，我的问题是否我无法覆盖不同描述或“它”块中的值。

 beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [MyComponent],
      imports: [RouterTestingModule
        })],
      providers: [
        { provide: ActivatedRoute, useValue: mockParams },
      ],
      schemas: [NO_ERRORS_SCHEMA]
    }).compileComponents();
}));

这是我在不同的 NESTED 描述块中添加覆盖的示例...

beforeEach(() => {
      TestBed.overrideProvider(ActivatedRoute, 
      {useValue: newMockParams});
      TestBed.compileComponents();
      fixture = TestBed.createComponent(MyComponent);
      component = fixture.componentInstance;
      fixture.detectChanges();
});

这几乎就像这根本不运行......如果我重新使用 mockParams 并更改值，新的模拟参数不会改变，那么它将改变原始描述中的值，我真的必须重新创建吗我在每个嵌套描述中的组件？当我唯一需要更改的是提供者时，我不得不这样做是不对的，我不确定此时 overrideProvider 会做什么！任何帮助将不胜感激！

Answer 1

更新了以下 cmets 中提供的新信息。

我的建议是更改 route.queryParams 返回的值。您在 cmets 中提到您的 ngOnInit() 函数如下所示：

ngOnInit() {
    this.route.queryParams.subscribe(params => { this.value = params; });
}

如果您在每次测试中运行 .detectChanges() 之前更改 queryParams observable 的返回值，这应该可以实现您想要的。例如，像这样：

describe('MyComponent', () => {
    let mockActivatedRoute = {queryParams: of({old: 'test'})};
    let component: MyComponent;
    let fixture: ComponentFixture<MyComponent>;
    let route: ActivatedRoute;

    beforeEach(async(() => {
        TestBed.configureTestingModule({
            declarations: [MyComponent],
            imports: [ ],
            providers: [
                { provide: ActivatedRoute, useValue: mockActivatedRoute },
            ]
        })
        .compileComponents();
    }));

    beforeEach(() => {
        fixture = TestBed.createComponent(MyComponent);
        component = fixture.componentInstance;
        route = TestBed.get(ActivatedRoute);
    });

    it('ngOnInit should initialize and route params be intial values', () => {
        fixture.detectChanges(); // execute ngOnInit() in component
        expect(component.value).toEqual({old: 'test'}); // check that value is correct
    });
        it('ngOnInit should initialize and route params be changed values', () => {
        route.queryParams = of({new: 'newTest'/* mocked params */});
        fixture.detectChanges();
        expect(component.value).toEqual({new: 'newTest'}); // check that value is correct
    });
});

我在 stackblitz 中测试了这一切，以确保这一切都没有错误。 :) 这是链接：STACKBLITZ