I have a test like this:
it('should login successfully', async () => {
let { baseElement, getByPlaceholderText, findByText } = render(renderComponent);
expect(baseElement).toBeTruthy();
expect(await findByText(/Welcome/i)).toBeInTheDocument();
fireEvent.change(getByPlaceholderText('Username'), { target: { value: 'test@test.com' } });
fireEvent.change(getByPlaceholderText('Password'), { target: { value: 'secret' } });
fireEvent.click(getByText(/Log in/i));
// for some reason this does not work. Can anybody help with this?
expect(await findByText(/Dashboard/i)).toBeInTheDocument();
});
the Dashboard is never found. Apparently, react testing library does not detect the page should have routed to the Dashboard page after successfully logging in.
Inside my Login component,
const formik = useFormik({
[...]
onSubmit: (values, { setStatus, setSubmitting }) => {
console.log('during testing, it gets here');
oktaAuth
.signInWithCredentials({
username: values.username,
password: values.password,
})
.then((res) => {
console.log('but never gets here');
[...]
})
.catch((err) => {
console.log('nor gets here');
[...]
});
},
});