Material-uiのTextField
コンポーネントに入力された値を使ってデータをSubmitする際など、テスト環境で適当な値を使って目的のfunctionがちゃんと呼ばれるかをテストしようと思った所、上手く値を設定できずに少し困りました。
wapper
に入っているのはenzyme
でmount
された親のComponentで、TextField
にはref=username
としてrefを設定しています。
結論からすると、値を入れた後にchange
をsimulateする必要があった、と言う部分で躓きました。
この挙動はMaterial-ui自体の挙動になるので、よりシンプルな形としてはonChange
内でstate
を変更して、テスト内ではinputではなくstateを変更するだけで良いのかも知れません。
let username = wrapper.ref('username').find('input')
username.node.value = 'first'
username.simulate('change', username)
wrapper.instance().onSubmit() // 最終的なfunctionを呼び出して適宜値のチェックを行うなど