angular - Angular2 unit testing does not update input's ngModel when used inside a form -
i have extensive testing in our angular 2.4 based application. 1 area have not been able test though forms inputs. tracked down small test case. have plnkr shows issue: https://plnkr.co/edit/nyeaoh2uo5rjt9if6j64 (see form_bug.spec.ts)
note: based example off way code in testing guide works.
the problem when hook input ngmodel, , in test suite update input data flow component if input not inside form. if add form, data not flow correctly.
the core pieces of code are:
@component({ selector: 'with-form-test', template: ` <div> <div class="show_val">{{testval}}</div> <form> <input name="test_val" id="val_id" [(ngmodel)]="testval" /> </form> </div> `, }) class withformtestcomp { testval: string = 'start'; } and test. 2 expect() checks in 1 fail.
describe('withformtest', () => { let fixture: componentfixture<withformtestcomp>; let comp: withformtestcomp; let comp_de: debugelement; function getinput(): debugelement { return comp_de.query(by.css('input')); } function getshowval(): debugelement { return comp_de.query(by.css('.show_val')); } beforeeach(() => { testbed.configuretestingmodule({ imports: [ formsmodule, ], declarations: [ withformtestcomp, ], }); fixture = testbed.createcomponent(withformtestcomp); comp = fixture.componentinstance; comp_de = fixture.debugelement; }); it('should update testval', () => { fixture.detectchanges(); const input_elt: htmlinputelement = getinput().nativeelement; input_elt.value = 'set_val'; input_elt.dispatchevent(newevent('input')); fixture.detectchanges(); const show_val_elt = getshowval().nativeelement; expect(comp.testval).toequal('set_val'); expect(show_val_elt.textcontent).tobe('set_val'); }); }); does see how fix work correctly? have looked around , can't find bug reports explain why work without form fail it.
Comments
Post a Comment