我得到以下错误
我试着写formik形式的测试用例。在其中我嘲笑了react内部的顺风并得到了以下错误。如何解决嘲笑问题并在渲染时得到错误。
<Input
label={t('chChampionForm.firstName')}
className="my-1"
name="firstName"
labelClassName={'font-semibold'}
value={formik.values.firstName}
touched={formik.touched.firstName}
onChange={formik.handleChange}
onBlur={formik.handleBlur}
error={formik.errors.firstName}
/>
字符串
的数据
下面是我的代码
describe('FrChampionForm', () => {
beforeEach(() => {
jest.clearAllMocks();
});
it('submits the form when Continue button is clicked', async () => {
const formSubmitHandler = jest.fn(); // Use a more descriptive prop name
// Create a mock formik object with necessary properties
const mockFormik = {
values: {
firstName: '',
familyName: '',
birthYear: '',
city: '',
postcode: '',
bestApprentice: '',
bestWorker: '',
natFinalsYear: '',
natFinalsRank: '',
natFinalsRegion: '',
euroSkillsYear: '',
euroSkillsRank: '',
worldSkillsYear: '',
worldSkillsRank: '',
trainingAndDiploma1: '',
trainingAndDiploma2: '',
currentCompanyCityDept: '',
worldSkillsProfession: '',
gender: '',
currentJobName: '',
instagramAddress: '',
tiktokAddress: '',
facebookAddress: ''
},
touched: {},
handleChange: jest.fn(),
handleBlur: jest.fn(),
setFieldValue: jest.fn(),
handleSubmit: formSubmitHandler, // Provide the correct function
isSubmitting: false
};
// Mock the context value
const mockContextValue = [{ profile: { type: 'fr' } }];
// Mock the useContext hook
React.useContext.mockReturnValue(mockContextValue);
const theme = {};
const { asFragment } = render(
<PgProfileData
// formik={mockFormik}
/>
);
expect(asFragment()).toMatchSnapshot();
// Fill in form fields using data-test-id attribute
userEvent.type(screen.getByTestId('first-name-input'), 'John');
userEvent.type(screen.getByTestId('family-name-input'), 'Doe');
userEvent.type(screen.getByTestId('birth-year-input'), '1990');
// ... continue filling in other fields
// Simulate selecting radio buttons using data-test-id attribute
userEvent.click(screen.getByTestId('best-apprentice-radio-input'));
userEvent.click(screen.getByTestId('best-worker-radio-input'));
// ... continue selecting other options
// Submit the form
fireEvent.click(screen.getByText('Continue'));
// Wait for form submission to complete (use your own logic if async operations are involved)
await waitFor(() => {
// Assertions after form submission, for example:
expect(screen.queryByText('Continue')).toBeNull(); // Button should disappear after submission
// ... other assertions
});
});
// Add more test cases as needed
});
型
是与上述代码的一些问题,或者是由于一些其他原因,我无法正确理解什么是与上述代码的问题。
1条答案
按热度按时间hmae6n7t1#
对我来说,这种嘲笑
tailwind CSS
的方式很有效。你只需要在
jest.config
中这样做:字符串
希望这有帮助!