I am new to Angular/Typescript/Javascript. The challenge I am facing right now since few hours is: I have this function to test:
setupIFrame($event: any): void {
this.iframeWrappers = document.getElementsByClassName('iframe-wrapper');
this.iframeButtons = document.getElementsByClassName('iframe-button');
const closeListener: any = (payload) => {
if (payload.data?.eventId === 'closeEvent') {
this.iframeWrappers[$event.rowIndex].classList.remove('open');
window.removeEventListener('message', closeListener, false);
}
}
this.iframeButtons[$event.rowIndex].addEventListener('click', () => {
this.iframeWrappers[$event.rowIndex].classList.add('open');
window.addEventListener('message', closeListener, false);
}, false);
}
But I cannot cover the closeListener
and these two lines:
this.iframeWrappers[$event.rowIndex].classList.add('open');
window.addEventListener('message', closeListener, false);
What can I do in order to cover these two lines? This is my current test:
it('test iFrame setup', () => {
Object.defineProperty(document, 'getElementsByClassName', {
value: mockedGetElementsByClassName
})
configureTestBed();
const rowIndex: RowIndex = {rowIndex: 0};
expect(component).toBeTruthy();
expect(fixture).toMatchSnapshot();
component.setupIFrame(rowIndex);
expect(document.getElementsByClassName).toBeCalledTimes(2);
expect(mockedIFrameButton.addEventListener).toBeCalledWith('click', expect.any(Function), false);
// expect(mockedIFrameWrapper.classList.add).toBeCalled();
});
I feel like mocking the getElementsByClassName
function is not the right thing to do, but otherwise I would get a undefined HTMLElement and cannot call the addEventListener function either. But I am very unsure how to approach the test properly tbh :/
Aucun commentaire:
Enregistrer un commentaire