CODEWITHSUNDEEP
angularjsangularangular-testangular-hybrid
Chandan Kumar V
Chandan Kumar V

Reputation: 123

Angular Upgrade for Performance No provider for $rootscope, $location

I have setup Angular Hybrid setup using Angular upgrade for performance approach and able to run the application without any issues.

But, I am facing an issue running Angular side test cases, I have provided the components, spec and all related snippets. Can anyone help me out on what could be the issue and how can I fix it.

Please also let me know if any more details are required

Angular Component: componentA.ts

constructor(@Inject('$rootScope') public rootScope) { }

Angular Component Spec: componentA.spec.ts

TestBed.configureTestingModule({
  declarations: [ ComponentA ],
  providers: [
    {
      provide: '$rootScope',
      useFactory: ($injector: any) => $injector.get('$rootScope'),
      deps: ['$injector']
    }
  ],
  imports: [
    createAngularTestingModule([ 'app'])
  ]
})

Error

Error: [$injector:unpr] Unknown provider: $rootElementProvider <- $rootElement <- $location <- $location
    at eval (webpack:///./node_modules/angular/angular.js?:68:12)
    at eval (webpack:///./node_modules/angular/angular.js?:4418:19)
    at Object.getService [as get] (webpack:///./node_modules/angular/angular.js?:4571:39)
    at eval (webpack:///./node_modules/angular/angular.js?:4423:45)
    at getService (webpack:///./node_modules/angular/angular.js?:4571:39)
    at injectionArgs (webpack:///./node_modules/angular/angular.js?:4595:58)
    at Object.invoke (webpack:///./node_modules/angular/angular.js?:4617:18)
    at eval (webpack:///./node_modules/angular/angular.js?:4424:37)
    at getService (webpack:///./node_modules/angular/angular.js?:4571:39)
    at injectionArgs (webpack:///./node_modules/angular/angular.js?:4595:58)
NullInjectorError: R3InjectorError(DynamicTestModule)[$rootScope -> $rootScope]: 
  NullInjectorError: No provider for $rootScope!
error properties: Object({ ngTempTokenPath: null, ngTokenPath: [ '$rootScope', '$rootScope' ] })
    at NullInjector.get (http://localhost:9876/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:1085:1)
    at R3Injector.get (http://localhost:9876/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:16984:1)
    at R3Injector.get (http://localhost:9876/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:16984:1)
    at NgModuleRef$1.get (http://localhost:9876/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:36608:1)
    at Object.get (http://localhost:9876/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:34252:1)
    at getOrCreateInjectable (http://localhost:9876/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:5892:1)
    at ɵɵdirectiveInject (http://localhost:9876/node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:21251:1)

Upvotes: 0

Views: 443

Answers (1)

Raz Ronen
Raz Ronen

Reputation: 2628

Like the errors says you are missing $rootElement provider. You can it by inserting the below before TestBed.configureTestingModule executes.

angular.module(<your_angularjs_module>).provider({
   $rootElement: {
       $get: () => {
           return angular.element(document.getElementById(<your_root_angularjs_element_id>));
       }
   }
});

Upvotes: 2

Related Questions