在进行角度零件单元测试时向零件提供/注入第三方服务

问题描述

我刚刚开始进行角度单元测试，LoginComponent依赖于第三方模块的(保险丝)服务FuseConfigService.

I have just started with Angular Unit testing, LoginComponent is dependent on third party module's (Fuse) service FuseConfigService.

这是FuseConfigService的样子

@Injectable({
    providedIn: 'root'
})
export class FuseConfigService
{
    private _configSubject: BehaviorSubject<any>;
    private readonly _defaultConfig: any;

    /**
     * Constructor
     *
     * @param {Platform} _platform
     * @param {Router} _router
     * @param _config
     */
    constructor(
        private _platform: Platform,
        private _router: Router,
        @Inject(FUSE_CONFIG) private _config
    )
    {

这是LoginComponent constructor的样子

constructor(
        private fuseConfig: FuseConfigService,
        private formBuilder: FormBuilder,
        private router: Router,
        private authenticationService: AuthService,
        private route: ActivatedRoute,
        private snackBar: MatSnackBar,
        private fuseNavigationService: FuseNavigationService,
        private pbiService: PbiService,
        private translateService: TranslateService
    ) {
        this.incorrectCredentials = false;
        this.loginFormErrors = {
            email: {},
            password: {},
        };
    }

我不知道如何使用TestBed配置测试模块，因为它会抛出类似错误

I don't know how to configure testing module using TestBed, as it is throwing error like

Error: StaticInjectorError(DynamicTestModule)[FuseConfigService -> InjectionToken fuseCustomConfig]:
  StaticInjectorError(Platform: core)[FuseConfigService -> InjectionToken fuseCustomConfig]:
    NullInjectorError: No provider for InjectionToken fuseCustomConfig!

这就是我正在尝试的

TestBed.configureTestingModule({
            declarations: [LoginComponent],
            imports: [FormsModule, ReactiveFormsModule, MatFormFieldModule,
                MatInputModule,
                MatCheckboxModule,
                MatSnackBarModule,
                MatButtonModule,
                MatRadioModule],
            providers: [
                FuseConfigService,
                { provide: Router, useClass: class { navigate = jasmine.createSpy("navigate"); } },
                FuseNavigationService
            ]
        });

任何帮助将不胜感激.

推荐答案

问题是您使用原始的FuseService.
而且该FuseService具有依赖项.这意味着您还必须提供它们.以及它们的依赖性.和他们的.依此类推.

The problem is that you use the original FuseService.
And that FuseService has dependencies. That means you would have to provide them also. And their dependencies. And theirs. And so on.

因此，最好是嘲笑该服务.

Therefor it would be a good practice to mock that service away.

对于"providedIn:根"服务，可以这样进行:

For Services that are "providedIn: root", this could be done like that:

 TestBed.overrideProvider(OriginalService, {useValue: new MockService()});

只需在配置TestBed之前添加它即可.

Just add that before you configure your TestBed.

"MockService"需要您在组件中使用的所有公共方法/变量.

The "MockService" needs all public methods / variables that you are using in your component.

这篇关于在进行角度零件单元测试时向零件提供/注入第三方服务的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！