angular - 无法在 Angular Testing 用例中使用 TestBed.overrideProvider 覆盖 MAT_DIALOG_DATA 提供程序

Question

我正在尝试使用 TestBed 为 Angular 组件编写集成测试。使用 @inject(MAT_DIALOG_DATA) 将一些数据注入(inject)到 Material 对话框的组件中.我想测试两个案例。一种是没有提供数据，另一种是提供了一些数据。但是我想在所有情况下都以相同的方式配置测试模块(在 beforeEach 方法中)。
因此，对于没有注入(inject)数据的情况，我将模块配置如下:

    TestBed.configureTestingModule({
          declarations: [
            PostNewComponent
          ].concat(EntryComponents1),
          imports: [TestingModule],
          providers: [
            PostService,
            { provide: MAT_DIALOG_DATA, useValue: {} },
            { provide: MatDialogRef, useValue: { close: (dialogResult: any) => {}, updateSize: () => {} }}
          ]
        });

然后我有一个案例，我想测试通过的测试数据。所以我尝试了以下方法来覆盖提供者。

    TestBed.overrideProvider(MAT_DIALOG_DATA, {useValue : {name: "passedName"}});

但它不会覆盖提供者。我调试了这个问题，发现 overrideProvider 终于在 core.js 中调用了以下方法

        /**
     * Read the `ngInjectableDef` for `type` in a way which is immune to accidentally reading inherited
     * value.
     *
     * @param type A type which may have its own (non-inherited) `ngInjectableDef`.
     */
    function getInjectableDef(type) {
        var def = type[NG_INJECTABLE_DEF];
        // The definition read above may come from a base class. `hasOwnProperty` is not sufficient to
        // distinguish this case, as in older browsers (e.g. IE10) static property inheritance is
        // implemented by copying the properties.
        //
        // Instead, the ngInjectableDef's token is compared to the type, and if they don't match then the
        // property was not defined directly on the type itself, and was likely inherited. The definition
        // is only returned if the type matches the def.token.
        return def && def.token === type ? def : null;
    }

和“类型”参数在 MAT_DIALOG_DATA 的情况下传递给此函数不包含 ngInjectableDef属性(property)。我对 Angular 没有深入的了解，所以有人可以解释为什么它不起作用以及这个只读属性“ ngInjectableDef”到底是什么？

Answer 1

我遇到了类似的问题。不知道为什么它不起作用，但我能够针对我的情况使用一种解决方法。因为在组件的构造函数中我们有

@Inject(MAT_DIALOG_DATA) public data: any,

我们可以在单独的测试中访问这个值并改变它们的值，例如:

component.data.name = "passedName";

希望这可以帮助。