嗨，有人能解释一下如何在react native中用笑话测试formik吗

Question

嗨，我用formik为react native创建了表单生成器。我用笑话进行测试，但当我测试onSubmit时，没有人能解释如何测试吗。

function FormBuilder({data, onSubmit, initialValues, navigation}) {
const formik = useFormik({
enableReinitialize: true,
initialValues: initialValues,
onSubmit: data => {
onSubmit(data);
},
});

return (
<View>
{data.map((item,index) => {
switch (item.type) {
case 'text':
return (
<TextBox
key={index}
onChangeText={formik.handleChange(item.name)}
onBlur={formik.handleBlur(item.name)}
value={formik.values[item.name]}
label={item.name}
touched={formik.touched}
errors={formik.errors}
required={
!!item.validators &&
item.validators.find(valid => valid.type === 'required')
}
{...item}
/>
);
case 'button':
return (
<CustomButton key={index} testID={item.testID} title= 
{item.name} onPress={formik.handleSubmit} />
);
}
})}
</View>
)
}

我在屏幕上这样调用这个组件。有人能解释一下我们如何为这个编写测试集成测试吗

<FormBuilder
initialValues={initialValues}
data={[
{
type: 'text',
name: 'whatsAppNumber',
testID: 'input',

},
{type: 'button', name: 'login', testID: 'button'},
]}
onSubmit={submitData}
/>

Answer 1

您可以通过以下方法测试您的代码，请使用msw为api调用创建虚拟服务器。

import {fireEvent, render,} from '@testing-library/react-native';
describe('Login Screen', () => {
it('should validate form', async () => {

const {getByTestId} = render(<Login />);
const numberField = getByTestId('input');
const button = getByTestId('button');
expect(numberField).toBeDefined();
expect(button).toBeDefined();
fireEvent.changeText(numberField, '9876543215');
fireEvent.press(button)
await waitFor(() =>{
//expect your function to be called
})
});
});