2017-01-23 3 views
1

酵素を使用して反応成分をテストしようとしています。私はモーダルをするときshowModal =真表示されていることを確認したい私のテストケースで酵素は、instance()。stateとupdate()を使用して状態を更新できません。

render() { 
     let modal = null; 
     let modalTitle = this.state.isEditing ? 'Edit Event' : 'Add Event'; 
     if (this.state.showModal) { 
      modal = (<div className="event-modal"> 
       <Modal show={this.state.showModal} onHide={this.closeModal}> 
        ... 
       </Modal> 
      </div>); 
     } 
     return (
      <div style={{height: '500px', width: '1000px'}}> 
       <BigCalendar 
        events={this.props.events} 
        startAccessor='startDate' 
        endAccessor='endDate' 
        onSelectSlot={this.onDayClick} 
        selectable={true} 
        onSelectEvent={this.onEventClick} 
       /> 
       {modal} 
      </div> 
     ); 
    } 

、および酵素を使用して、詳細のために正しい状態にコンポーネントを取得するには、インスタンスを()を使用をお勧めします。コンポーネントは、このrenderメソッドを持っていますテストでは、instance()を使用してからupdate()を試みましたが、動作しませんでした。私のテストケースでは、setState()を使用していました。可能であれば、酵素はこれを使用することを推奨しています。これは私のテストケースです。

setState()は動作しますが、instance()を使用してからupdate()を実行しても動作しません。 update()がコンポーネントを適切に再レンダリングしないのはなぜですか?

+0

彼らはあなたがインスタンスを(使用をお勧めしますSETSTATEのための酵素のドキュメント()、): https://github.com/airbnb/enzyme/blob/master/docs/api/ShallowWrapper/setState.md 酵素例:http://airbnb.io/enzyme/docs/api/ShallowWrapper/instance.html –

+0

ありがとうございます。 – prosti

答えて

0

酵素は、あなたが言ったようにすることをお勧めしますが、私たちは直接、状態を設定しなければならない唯一のケースは、コンポーネントのコンストラクタになりますので、これは

calendar.instance().state.showModal = true; 

ので、良いではないでしょう。

状態を設定するときに常に非同期で動作するsetState()を使用する必要があります。


hereから:12


更新するものがある場合update()メソッドはのみ機能します。 update()が瞬間に状態が変更されていないように見えます。

+0

ありがとう、私は、酵素が、それらを直接意味する状態をセットアップするためにinstance()を使用していると言っていて、何らかの形でそれが機能するようにコンポーネントにフックできると思っていました。私は将来setState()を使用します。 –

+0

いいえ問題は、良い仕事を続けてください。 – prosti

関連する問題