karma jasmine - How to wait for DOM elements to finish rendering in Angular 2 Unit Tests -


i have following test. focuses html element, sets it's value , triggers blur event handler. blur event triggers validation check which, if invalid should disable save button.

currently during test run failing, if set break point , walk through it, set disabled attribute on save button , work.

based on guess whenstable promise not waiting elements finish re-rendering completely. threw settimeout wait whole second before checking button state, still isn't working me.

is there function on componentfixture class wait elements re-render before triggering callback or resolving promise or whatever?

fixture.whenstable().then(() => {                 inputhomephone.nativeelement.focus();                 setinputvalue(inputhomephone, "123");                 inputhomephone.nativeelement.blur();                 fixture.detectchanges();                 return fixture.whenstable();             })             .then(() => {                 settimeout(() => {                     expect(btnsave.classes['disabled']).tobe(true);                     expect(btnsave.nativeelement.disabled).tobe(true);                     debugger;                 }, 1000)             }) 

the html button here. disabled when input values on form invalid.

 <button *ngif="!loading"                     id="btn-save"                     [class.disabled]="!(profileform?.valid)"                     class="btn primary top-space uppercase"                     [disabled]="!(profileform?.valid)"                     (click)="savechanges()">                 save             </button> 

okay figured out way trigger blur works me.

doing through nativeelement property makes work randomly. sure due angular 2 managing dom events. changing line

inputhomephone.nativeelement.blur();

to

inputhomephone.triggereventhandler('blur', null);

the save button disables , tests pass every time now.

i think in general supposed use triggereventhandler function test using dom events in angular 2.


Comments

Popular posts from this blog

account - Script error login visual studio DefaultLogin_PCore.js -

xcode - CocoaPod Storyboard error: -