Error: Unexpected value 'DomSanitizer' imported by the module 'DynamicTestModule'. Please add an @NgModule annotation

Question

I try to test a DomSanitizer import.

But I still get this error:

Error: Unexpected value 'DomSanitizer' imported by the module 'DynamicTestModule'. Please add an @NgModule annotation.

And my test case looks like this:

 beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [RouterTestingModule, DomSanitizer, DossierFileService, ErrorProcessor, MatDialog, BrowserModule],
      declarations: [ DossierPersonalDataComponent ],
      providers: [{

        provide: DomSanitizer,
        useValue: {
          sanitize: () =>'safeString',
          bypassSecurityTrustHtml: () => 'safeString'
        }

      }]
    })
    .compileComponents();
  }));

So what I have to change?

Thank you

This are de dependencies in the ts file:

constructor(
    private dossierService: DossierService,
    private route: ActivatedRoute,
    private sanitizer: DomSanitizer,
    private dossierFileService: DossierFileService,
    private errorProcessor: ErrorProcessor,
    private dialog: MatDialog
  )

Answer 1

Remove DomSanitizer from imports. You should only import modules, not services. You should provide services. If DossierFileService, ErrorProcessor are services (I am not sure if MatDialog is or not), move them to providers.

beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [RouterTestingModule, MatDialog, BrowserModule],
      declarations: [ DossierPersonalDataComponent ],
      providers: [{

        provide: DomSanitizer,
        useValue: {
          sanitize: () =>'safeString',
          bypassSecurityTrustHtml: () => 'safeString'
        }

      },
      DossierFileService,
      ErrorProcessor,
     ]
    })
    .compileComponents();
  }));