testing - What is the best way to test methods that traverse the react components -
i have tried test small react components. following component tab system when click tab, change classname of tab clicked. working want test them , dont know how steps test method traverse lot of components. put code above.
tabsystem: has method change currenttab state, method prop in tabs component renders each tab.
react.createclass({ .... handleclick (currenttab) { this.setstate({ currenttab }) }, render () { return ( <div> <tabs tabs = {tabs2} currenttab = {this.state.currenttab} onclick = {this.handleclick}/> </div> ) } });
tabs: receive onclick prop parent method, method prop tab component, goal add onclick method in name of tab.
react.createclass({ ... rendertabs () { return this.props.tabs.map((tab, index) => { var classname = index === this.props.currenttab ? 'active' : null; var clickhandler = this.props.onclick.bind(null, index); return ( <tab key={tab.name} onclick={clickhandler} index={index} classname={classname} name={tab.name}/> ) }) }, render () { return ( <div> {this.rendertabs()} </div> ) } });
tab: receive again onclick prop parent method.
react.createclass({ render () { return ( <span classname={this.props.classname} onclick={this.props.onclick}> {this.props.name} </span> ) } });
what best way test method? need in components method works well?
i wrote testing library abstracts react's test utils. https://github.com/legitcode/tests can like:
test(<testcomponent />) .find('button') .simulate({method: 'click', element: 'button'}) .element(button => { expect(button.props.classname).to.be.equal('blah'); })
you idea, helps.
Comments
Post a Comment