Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
import React from "react";
import { screen, render, fireEvent } from "@testing-library/react";
import InputField from "./InputField";
import { Formik } from "formik";
test("should have validation error given input field is touched and error exists on form", async () => {
const fieldName = "firstName";
const labelName = "First Name";
render(
<Formik
validate={(values) => {
let errors = {};
if (!values?.firstName) {
errors.firstName = "Required.";
}
return errors;
}}
>
<InputField fieldName={fieldName} labelName={labelName} />
</Formik>
);
const input = screen.getByLabelText(labelName);
// Call blur without inputting anything which should trigger a validation error
fireEvent.blur(input);
const validationErrors = await screen.findByTestId(`errors-${fieldName}`);
expect(validationErrors.innerHTML).toBe("Required.");
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment