Giorgio
Giorgio

Reputation: 144

How to setup dependecies with ngmocks for a service

I got a unit test that tests a service class that derives from a base class and I'm having trouble defining the correct way of injecting properly using ng mocks.

Service:

    export class PaymentAcceptanceRulesPlatformService extends PaymentAcceptanceRulesService {
      constructor(
        private httpClient: HttpClient,
        protected appConfig: AppConfigSettings,
      ) {
        super(appConfig);
      }

The Base class looks like:

    export abstract class PaymentAcceptanceRulesService {
      protected baseUrl: string;
    
      constructor(protected appConfig: AppConfigSettings) {
        this.baseUrl = this.appConfig.getconfig('paymentAcceptanceRulesServiceUrl');
      }

This is defined in a module something like this:

    providers: [
        {
          provide: PaymentAccountsService,
          deps: [HttpClient, AppConfigSettings],
          useFactory: paymentAccountsServiceFactory,
        },
        {
          provide: PaymentAcceptanceRulesService,
          deps: [HttpClient, AppConfigSettings],
          useFactory: paymentAcceptanceRulesServiceFactory,
        },

My test looks like this:

    const factory = MockRenderFactory(PaymentAcceptanceRulesPlatformService);
      let httpClientSpy: jasmine.SpyObj<HttpClient>;
      let appConfigSpy: jasmine.SpyObj<AppConfigSettings>;
    
      beforeAll(() => {
        httpClientSpy = jasmine.createSpyObj('HttpClient', [
          'get',
          'post',
          'put',
          'delete',
        ]);
        appConfigSpy = jasmine.createSpyObj('AppConfigSettings', ['getconfig']);
        appConfigSpy.getconfig.and.returnValue('false');
        MockBuilder(PaymentAcceptanceRulesPlatformService, SharedPaymentModule)
          .replace(HttpClientModule, HttpClientTestingModule)
          .provide({ provide: AppConfigSettings, useValue: appConfigSpy })
          .provide({
            provide: HttpClient,
            useValue: httpClientSpy,
          })
          .provide(PaymentAcceptanceRulesPlatformService); // Provide the service here
      });
    
      beforeAll(() => factory.configureTestBed());
    
      beforeEach(() => {
        fixture = factory(null, false);
    
        appConfigSpy.getconfig
          .withArgs('paymentAcceptanceRulesServiceUrl')
          .and.returnValue(baseTestUrl);
    
        service = fixture.point.componentInstance;
        httpMock = TestBed.inject(HttpTestingController);
      });
    
      afterEach(() => {
        httpMock.verify();
      });

currently, I have this error: I'm guessing I'm missing something to inject but is not clear to me

    Payment Acceptance Rules Service > should be created
    NullInjectorError: R3InjectorError(CompilerModule)[PaymentAcceptanceRulesPlatformService -> PaymentAcceptanceRulesPlatformService]: 
      NullInjectorError: No provider for PaymentAcceptanceRulesPlatformService!
    error properties: Object({ ngTempTokenPath: null, ngTokenPath: [ 'PaymentAcceptanceRulesPlatformService', 'PaymentAcceptanceRulesPlatformService' ] })
        at NullInjector.get (http://localhost:9878/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2020/core.mjs:7493:27)
        at R3Injector.call (http://localhost:9878/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2020/core.mjs:7914:33)
        at R3Injector.apply (http://localhost:9878/_karma_webpack_/webpack:/node_modules/ng-mocks/index.mjs:1:98979)
        at R3Injector.get (http://localhost:9878/_karma_webpack_/webpack:/node_modules/ng-mocks/index.mjs:1:9718)
        at R3Injector.call (http://localhost:9878/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2020/core.mjs:7914:33)
        at R3Injector.apply (http://localhost:9878/_karma_webpack_/webpack:/node_modules/ng-mocks/index.mjs:1:98979)
        at R3Injector.get (http://localhost:9878/_karma_webpack_/webpack:/node_modules/ng-mocks/index.mjs:1:9718)
        at TestBedImpl.inject (http://localhost:9878/_karma_webpack_/webpack:/node_modules/@angular/core/fesm2020/testing.mjs:24210:62)
        at getInjection (http://localhost:9878/_karma_webpack_/webpack:/node_modules/ng-mocks/index.mjs:1:2725)
        at http://localhost:9878/_karma_webpack_/webpack:/node_modules/ng-mocks/index.mjs:1:108275
    TypeError: Cannot read properties of undefined (reading 'verify')
        at UserContext.apply (http://localhost:9878/_karma_webpack_/webpack:/projects/arc/unified-payments-frontend/shared-payment/src/services/payment-acceptance-rules-platform.service.spec.ts:151:14)
        at _ZoneDelegate.invoke (http://localhost:9878/_karma_webpack_/webpack:/node_modules/zone.js/fesm2015/zone.js:368:26)
        at ProxyZoneSpec.onInvoke (http://localhost:9878/_karma_webpack_/webpack:/node_modules/zone.js/fesm2015/zone-testing.js:273:39)
        at _ZoneDelegate.invoke (http://localhost:9878/_karma_webpack_/webpack:/node_modules/zone.js/fesm2015/zone.js:367:52)
        at Zone.run (http://localhost:9878/_karma_webpack_/webpack:/node_modules/zone.js/fesm2015/zone.js:129:43)
        at runInTestZone (http://localhost:9878/_karma_webpack_/webpack:/node_modules/zone.js/fesm2015/zone-testing.js:555:34)
        at UserContext.<anonymous> (http://localhost:9878/_karma_webpack_/webpack:/node_modules/zone.js/fesm2015/zone-testing.js:570:20)
        at <Jasmine>

Upvotes: 0

Views: 61

Answers (0)

Related Questions