# Ng test Error: NullInjectorError: No provider for IonRouterOutlet!

**URL:** <https://forum.ionicframework.com/t/ng-test-error-nullinjectorerror-no-provider-for-ionrouteroutlet/199649>\
**Category:** Ionic Angular\
**Created:** [November 15, 2020, 6:26pm UTC](https://forum.ionicframework.com/t/ng-test-error-nullinjectorerror-no-provider-for-ionrouteroutlet/199649 "2020-11-15T18:26:10Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![tylerpashigian](https://avatars.discourse-cdn.com/v4/letter/t/a88e57/32.png) [@tylerpashigian](https://forum.ionicframework.com/u/tylerpashigian)\
**Post date:** [November 15, 2020, 6:26pm UTC](https://forum.ionicframework.com/t/ng-test-error-nullinjectorerror-no-provider-for-ionrouteroutlet/199649/1 "2020-11-15T18:26:10Z")

</div>

I am getting an error in the default “should create” tests for a page when adding “IonRouterOutlet” to the page constructor to use in a modal presentation.

**Error Message**

> Chrome 86.0.4240.193 (Mac OS 11.0.0) CustomPage should create FAILED  
> Failed: R3InjectorError(DynamicTestModule)[IonRouterOutlet → IonRouterOutlet]:  
> NullInjectorError: No provider for IonRouterOutlet!

I have tried importing and adding IonRouterOutlet to the page providers in custom-page.page.spec.ts but that results in another error. Can anyone help explain the dependency mistake I am making? Still trying to understand Angular’s dependency system. Thanks!

**Custom Page Constructor**

```auto
constructor(private authService: AuthService, private formBuilder: FormBuilder, private modalController: ModalController, private customService: CustomService, private routerOutlet: IonRouterOutlet) {}

```

**Modal Presentation (func in custom page)**

```auto
async presentModal(param) {
    const modal = await this.modalController.create({
      component: AddItemModalComponent,
      componentProps: {
        'param': param
      },
      presentingElement: this.routerOutlet.nativeEl,
      swipeToClose: true
    });
    return await modal.present();
  }

```

**custom-page.page.spec.ts**

```auto
describe('CustomPage', () => {
  let component: CustomPage;
  let fixture: ComponentFixture<CustomPage>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [CustomPage],
      imports: [
        FormsModule,
        IonicModule.forRoot(),
        ReactiveFormsModule,
        RouterTestingModule
      ]
    }).compileComponents();

    fixture = TestBed.createComponent(CustomPage);
    component = fixture.componentInstance;
    fixture.detectChanges();
  }));

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

```

---

<div class="post-metadata">

**Author:** ![lsantaniello](https://avatars.discourse-cdn.com/v4/letter/l/e495f1/32.png) [@lsantaniello](https://forum.ionicframework.com/u/lsantaniello)\
**Post date:** [February 20, 2021, 1:41pm UTC](https://forum.ionicframework.com/t/ng-test-error-nullinjectorerror-no-provider-for-ionrouteroutlet/199649/2 "2021-02-20T13:41:55Z")

</div>

I have the same issue. Did you solve it?

---

<div class="post-metadata">

**Author:** ![tylerpashigian](https://avatars.discourse-cdn.com/v4/letter/t/a88e57/32.png) [@tylerpashigian](https://forum.ionicframework.com/u/tylerpashigian)\
**Post date:** [February 21, 2021, 11:37pm UTC](https://forum.ionicframework.com/t/ng-test-error-nullinjectorerror-no-provider-for-ionrouteroutlet/199649/3 "2021-02-21T23:37:09Z")

</div>

Unfortunately, no. I was never able to figure this out.

---

<div class="post-metadata">

**Author:** ![tusksoft](https://avatars.discourse-cdn.com/v4/letter/t/7ea924/32.png) [@tusksoft](https://forum.ionicframework.com/u/tusksoft)\
**Post date:** [February 24, 2021, 7:59pm UTC](https://forum.ionicframework.com/t/ng-test-error-nullinjectorerror-no-provider-for-ionrouteroutlet/199649/4 "2021-02-24T19:59:14Z")

</div>

I encountered this issue, and was able to get the test passing by adding the following to the providers array:

```auto
        {
          provide: IonRouterOutlet,
          useValue: {
            //add whatever property of IonRouterOutlet you're using in component class
            nativeEl: ""
          }
        }

```

(

---

<div class="post-metadata">

**Author:** ![tylerpashigian](https://avatars.discourse-cdn.com/v4/letter/t/a88e57/32.png) [@tylerpashigian](https://forum.ionicframework.com/u/tylerpashigian)\
**Post date:** [February 25, 2021, 5:32am UTC](https://forum.ionicframework.com/t/ng-test-error-nullinjectorerror-no-provider-for-ionrouteroutlet/199649/5 "2021-02-25T05:32:10Z")

</div>

Wow, thank you so much! That worked. @lsantaniello check out the comment above for the solution.