How to unit test an Angular service with AngularJS service dependencies

user_10624123 0
Viewed 1240

I am trying to migrate angular js services to a new angular 7 app. However, each service has many dependencies on other angularjs services and I am not able to convert them all at the same time whilst continuing to create new features. How can I inject angular js services inside unit tests so that I can test my Angular 7 service?

tests.ts // test entry file

import 'core-js/es6';
import 'reflect-metadata';
import 'zone.js/dist/zone';
import 'zone.js/dist/long-stack-trace-zone';
import 'zone.js/dist/proxy';
import 'zone.js/dist/sync-test';
import 'zone.js/dist/jasmine-patch';
import 'zone.js/dist/async-test';
import 'zone.js/dist/fake-async-test';

import { getTestBed } from '@angular/core/testing';
import {
  BrowserDynamicTestingModule,
  platformBrowserDynamicTesting
} from '@angular/platform-browser-dynamic/testing';

declare const require: any;

// First, initialize the Angular testing environment.
getTestBed().initTestEnvironment(
  BrowserDynamicTestingModule,
  platformBrowserDynamicTesting()
);

// Then we find all the tests.
const context = require.context('./', true, /\.spec\.ts$/);

// And load the modules.
context.keys().map(context);

TestService.ts 

import { UpgradeModule } from '@angular/upgrade/static';
import { CHECKOUT_SERVICE } from '../../../../ajs-upgraded-providers';

@Injectable({
 providedIn: 'root'
})
export class TestService {
   let checkout: any;
   constructor(@Inject(CHECKOUT_SERVICE) private checkoutService: any){
     this.checkout = checkoutService;
   }
}

TestService.spec.ts

import { TestBed } from '@angular/core/testing';
import { TestingService } from './testing-service';
import { CheckoutServiceProvider } from 'ajs-upgraded-provider.ts'

describe('testing service with an injected AJS service', () => {
  let service: TestingService;
  TestBed.configureTestingModule({
  providers:[
    TestService,
    CheckoutServiceProvider
  ],
  imports:[ upgradeModule ]
 });
  service = TestBed.get(TestingService);
})
  it('instance should be created', () => {
    expect(expect(service).toBeTruthy();
  })
})

When running this unit test I get the following error:

Error: Trying to get the AngularJS injector before it being set.
angular7 angular angularjs migration unit-testing
2 Answers

Try doing it this way:

class MockConfigurationService {

}
class SomeMockCheckOutService {

}

// Configure the component with another set of Providers
TestBed.overrideComponent(
  TestService,
  { 
    set: { 
      providers: [
        {
          provide: CHECKOUT_SERVICE, 
          useClass: MockConfigurationService
        },
        {
          provide: CheckoutService, 
          useClass: SomeMockCheckOutService
        }
     ] 
   } 
  }
);
user_21338340

If you dont want to use mocks this worked for me:

add this to your beforeEachMethod

const upgrade = TestBed.get(UpgradeModule) as UpgradeModule;
upgrade.bootstrap(document);
const serviceWhichReliesonInjector =

afterwards i could simply access the service by

TestBed.get(ServiceWhichReliesonInjector)
user_22283300
Related