Invalid provider for the NgModule 'DynamicTestModule' - only instances of Provider and Type are allowed, got: [..., ..., ?[object Object]?]

Viewed 1888

In my angular app I redirect to the login page if the user is not logged in, it works, but the test with jasmine and karma fails with this error: Invalid provider for the NgModule 'DynamicTestModule' - only instances of Provider and Type are allowed, got: [..., ...,?[object Object]?]

this is my spec file:

import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
  import { TestBed, waitForAsync } from '@angular/core/testing';

  import { RouterTestingModule } from '@angular/router/testing';

  import { AppComponent } from './app.component';
  import { LoginPage } from './modules/user/pages/login/login.page';

  describe('AppComponent', () => {


    beforeEach(waitForAsync(() => {

      TestBed.configureTestingModule({
        declarations: [AppComponent],
        schemas: [CUSTOM_ELEMENTS_SCHEMA],
        imports:[RouterTestingModule],
        providers:[RouterTestingModule.withRoutes([{path:"users/login",component:LoginPage}])]
      }).compileComponents();
    }));

    it('should create the app', waitForAsync(() => {
      const fixture = TestBed.createComponent(AppComponent);
      const app = fixture.debugElement.componentInstance;
      expect(app).toBeTruthy();
    }));

    it('should have menu labels', waitForAsync(() => {
      const fixture = TestBed.createComponent(AppComponent);
      fixture.detectChanges();
      const app = fixture.nativeElement;
      const menuItems = app.querySelectorAll('ion-label');
      expect(menuItems.length).toEqual(12);
      expect(menuItems[0].textContent).toContain('Inbox');
      expect(menuItems[1].textContent).toContain('Outbox');
    }));

    it('should have urls', waitForAsync(() => {
      const fixture = TestBed.createComponent(AppComponent);
      fixture.detectChanges();
      const app = fixture.nativeElement;
      const menuItems = app.querySelectorAll('ion-item');
      expect(menuItems.length).toEqual(12);
      expect(menuItems[0].getAttribute('ng-reflect-router-link')).toEqual('/folder/Inbox');
      expect(menuItems[1].getAttribute('ng-reflect-router-link')).toEqual('/folder/Outbox');
    }));

  });

and this my component:

import { Component, OnInit } from '@angular/core';
import {db} from "./../../functions/src/configs/firebase"
import {initializeApp} from "firebase/app"
import { getAuth, onAuthStateChanged } from "firebase/auth";
import { configs } from './configs/credentials';
import { Router } from '@angular/router';
@Component({
  selector: 'app-root',
  templateUrl: 'app.component.html',
  styleUrls: ['app.component.scss'],
})
export class AppComponent  implements OnInit{
  public appPages = [
    { title: 'Inbox', url: '/folder/Inbox', icon: 'mail' },
    { title: 'Outbox', url: '/folder/Outbox', icon: 'paper-plane' },
    { title: 'Favorites', url: '/folder/Favorites', icon: 'heart' },
    { title: 'Archived', url: '/folder/Archived', icon: 'archive' },
    { title: 'Trash', url: '/folder/Trash', icon: 'trash' },
    { title: 'Spam', url: '/folder/Spam', icon: 'warning' },
  ];
  public labels = ['Family', 'Friends', 'Notes', 'Work', 'Travel', 'Reminders'];
  constructor(public router:Router) {}
  ngOnInit(): void {
    const app = initializeApp(configs.firebase)
    const auth = getAuth()
    onAuthStateChanged(auth,async (user)=>{
      if( user){
      const token = await user.getIdTokenResult(true)
          console.log("user ok è",user)
          console.log("token.claims",token.claims)
    }else{
      this.router.navigate(["/users/login"])
    }
    }
    
    )
  }
}

nothing too complex, but I do not understand how to fix the test

1 Answers

Generally RouterTestingModule only goes into imports declarations. Remove it from providers should work.

Related