Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular / Ivy error : Error: Token InjectionToken XXXXXXXXX is missing a ɵprov definition

Getting the error after updating to Angular 9 / Ivy compiler

ERROR Error: Token InjectionToken XXXXXXXXX is missing a ɵprov definition.
    at injectableDefOrInjectorDefFactory (vendor.js:47105)
    at providerToFactory (vendor.js:47210)
    at resolveProvider$1 (vendor.js:56430)
like image 843
Simon_Weaver Avatar asked Feb 21 '20 03:02

Simon_Weaver


3 Answers

This can occur if you try to explicitly override an inherited injectable with undefined or null.

In Angular 8 this was ok

    {
        provide: AMBIENT_CART,
        useExisting: undefined
    }

With Angular 9 it needs to be changed to

    {
        provide: AMBIENT_CART,
        useValue: undefined
    }

If you're curious: In my case I was doing this for safety reasons, to make sure I didn't use this particular injectable by mistake.

like image 91
Simon_Weaver Avatar answered Sep 18 '22 09:09

Simon_Weaver


I got the same error when running ng test after upgrading from Angular 8 --> 9: "Error: Token InjectionToken apiToken is missing a ɵprov definition."

My solution to this was very simple- there was a typo in the spec file that I guess didn't matter in Angular 8, but does in Angular 9? The last instance of 'useValue' below was incorrectly written 'usevalue'. Such an obscure error!

TestBed.configureTestingModule({ 
    imports: [ HttpClientTestingModule ], 
    providers: [ 
        { provide: ApiService, useValue: apiService }, 
        { provide: ProductsApiService, useValue: productsService }, 
        { provide: apiToken, useValue: mockApiToken } 
    ] 
});
like image 31
Ross Mawdsley Avatar answered Sep 18 '22 09:09

Ross Mawdsley


I started receiving this error while running unit tests after upgrading an application from Angular 8 to Angular 10. The issue occurred because the existing spec file was using value instead of useValue in the providers array as shown in the below sample. Fixed the issue by changing it to useValue.

    beforeEach(async(() => {
    void TestBed.configureTestingModule({
        declarations: [
            MockPipe(TranslatePipe),
        ],
        imports: [
            HttpClientTestingModule,
        ],
        providers: [
            FormBuilder,
            MessageService,
            { provide: MESSAGES_TOKEN, value: {} }, //changed to useValue
        ]
    }).compileComponents();
}));
like image 38
Atif Majeed Avatar answered Sep 19 '22 09:09

Atif Majeed