javascript - Angular 6 测试 Jasmine Karma : Override Provider Not working

Question

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

我如何设置我的代码是我的主要描述创建我的测试平台组件，在这里我为事件路由设置了我的模拟参数，所以我们可以 this.route.queryparams.subscribe(..)，我的问题是我无法覆盖不同描述或“它” block 中的值。

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

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

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

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

Answer 1

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

我的建议是更改 route.queryParams 返回的值。您在评论中提到您的 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