unit-testing - karma - unit test angular services

Cómo burlarse de Pipe al probar un componente

Question

Actualmente estoy anulando a los proveedores para usar servicios simulados como este:

beforeEach(inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
    tcb.overrideProviders(AddFieldToObjectDropdownComponent,
        [
             provide(ServiceA, { useClass: MockServiceA })),
             provide(ServiceB, { useClass: MockServiceB }))
        ])...

Quiero hacer lo mismo para las tuberías que utiliza el componente. Lo intenté, provide(PipeA, { useClass: MockPipeA }) y provide(PipeA, { useValue: new MockPipeA() }) pero ambos no funcionaron.

Answer 1

Burlándose de mi pipa en clase simple como

export class DateFormatPipeMock {
 transform() {
  return ''29.06.2018 15:12'';
 }
}

y uso simple de useClass en mi archivo de especificaciones

{provide: DateFormatPipe, useClass: DateFormatPipeMock}

trabajó para mi :-)

Answer 2

Para tocar el tubo, use la respuesta de Dinistro. Para espiar la tubería, puedes complementar eso con lo siguiente:

let pipeSpy: jasmine.Spy;

beforeEach(() => {
    TestBed.configureTestingModule...

    pipeSpy = spyOn(MockPipe.prototype, ''transform'');
};

it(''should do whatever'', () => {
    doYourStuff();

    expect(pipeSpy).toHaveBeenCalled();
}

Answer 3

Puedes agregar tus mockpipes en las declarations de TestBed :

TestBed.configureTestingModule({
            declarations: [
                AppComponent,
                MockPipe
            ],
           ...

El MockPipe necesita tener el decorador @Pipe con el nombre original.

import {Pipe, PipeTransform} from ''@angular/core'';

@Pipe({name: ''pipename''})
class MockPipe implements PipeTransform {
    transform(value: number): number {
        //Do stuff here, if you want
        return value;
    }
}