我有一个带有两个EditText组件的React-Native表单,如果您在第一个表单上按Enter,则在第二个表单上按Enter(此方法有效)。现在,我正在尝试为其编写测试,该组件看起来像这样
const passwordTextInput = React.createRef()
<TextInput
style={styles.textInput}
returnKeyType="next"
keyboardType="numeric"
underlineColorAndroid="transparent"
editable={!isLoading}
onChangeText={text => onCodeChange({ text })}
onSubmitEditing={() => { passwordTextInput.current.focus() }}
value={code}
/>
<TextInput
style={styles.textInput}
returnKeyType="next"
placeholderTextColor={Colors.ON_PRIMARY_TEXT_HALF_OPACITY}
underlineColorAndroid="transparent"
secureTextEntry={shouldHidePassword}
editable={!isLoading}
onChangeText={text => onPasswordChange({ text })}
ref={passwordTextInput}
onSubmitEditing={() => { repeatPasswordTextInput.current.focus() }}
value={password}
/>
正如我所说的那样,这很完美,但是现在我正在尝试编写测试。我的快照很浅,但是onChangeText看起来像这样
onSubmitEditing={[Function]}
所以我试图做这样的事情
it('testing codeChange onSubmitEditing', () => {
const codeTextInput = wrapper.find('TextInput').at(0)
const password = wrapper.find('TextInput').at(1)
codeTextInput.simulate('submitEditing')
expect(password.is(':focus')).toBe(true)
})
不幸的是,这崩溃了
TypeError: Cannot read property 'focus' of null