Test pipe with dependencies on services

Question

I have a pipe that sanatises HTML as below:

import { Pipe, PipeTransform } from '@angular/core'; import { DomSanitizer } from '@angular/platform-browser';  @Pipe({     name: 'sanitiseHtml' })  export class SanitiseHtmlPipe implements PipeTransform {  constructor(private _sanitizer: DomSanitizer) {}      transform(value: any): any {       return this._sanitizer.bypassSecurityTrustHtml(value);     }  } 

I want to test it as below:

describe('Pipe: Sanatiser', () => {     let pipe: SanitiseHtmlPipe;      beforeEach(() => {         pipe = new SanitiseHtmlPipe(new DomSanitizer());     });      it('create an instance', () => {         expect(pipe).toBeTruthy();     });  }); 

The DomSanatizer is an abstract class which is autowired by typescript by passing it into a constructor:

constructor(private _sanitizer: DomSanitizer) {} 

Currently I get the typescript errror:

Cannot create an instance of the abstract class 'DomSanitizer'.

Does anyone know what typescript does when instantiating dependencies passed into a constructor in Angular? Or what the way to test something like this is?

Answer 1

Because of the DI in your pipe, you need to configure a test environment (test bed) to resolve the dependency:

import { BrowserModule, DomSanitizer } from '@angular/platform-browser'; import { inject, TestBed } from '@angular/core/testing';  describe('SanitiseHtmlPipe', () => {   beforeEach(() => {     TestBed       .configureTestingModule({         imports: [           BrowserModule         ]       });   });    it('create an instance', inject([DomSanitizer], (domSanitizer: DomSanitizer) => {     let pipe = new SanitiseHtmlPipe(domSanitizer);     expect(pipe).toBeTruthy();   }));  });