angular 2 trigger custom event for test purpose

Viewed 1235

I'm trying to write a unit test checking that I can handle a custom event and verify that I send back the same event

Seems that my event isn't triggered or handled, I can't say

here is the component :

@Component({
  selector: 'sites',
  templateUrl: './sites.component.html',
  styleUrls: ['./sites.component.css'],

})
export class SitesComponent implements OnInit {

  @Input()
  sites : Site[];

  @Output()
  selectedSiteEvent = new EventEmitter();

  constructor() {
  }

  ngOnInit() {
  }

  handleEvent(event: Event){
    console.log("ici ici ici ");
    this.selectedSiteEvent.emit(event);
  }


}

The template :

<div layout="columns" class="sites">
  sites
  <site *ngFor='let occur of sites' [site]="occur" (selectedSiteEvent)="handleEvent($event)">
  </site>

</div>

And the test case :

describe('SitesComponent', () => {
  let component: SitesComponent;
  let fixture: ComponentFixture<SitesComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ SitesComponent, MockSite ]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(SitesComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should raise selectedSiteEvent event when child output this event', () => {
    spyOn(component.selectedSiteEvent, 'emit');



    let de: DebugElement = fixture.debugElement.query(By.css('.sites'));
    de.triggerEventHandler('selectedSiteEvent', null);

    fixture.detectChanges();


    expect(component.selectedSiteEvent.emit).toHaveBeenCalled()
  });

});
0 Answers
Related