Snažím se dělat něco docela jednoduché, když jsem odešlete formulář, funkce prop předán do složky se nazývá. To funguje, pokud jsem spustit aplikaci, ale když jsem spustit unit testy je to vždy nedaří.
expect(myFunction).toHaveBeenCalledWith(...expected)
Expected: "New Reason 1"
Number of calls: 0
Tady je test:
describe("New Reason Form", () => {
it("calls onCreate prop when the form is submitted", () => {
const onCreate = jest.fn().mockName("onCreate");
const { queryByTestId } = render(
<NewReasonForm onCreate={onCreate} />
);
const submitButton = queryByTestId("submit");
fireEvent.click(submitButton!);
expect(onCreate).toHaveBeenCalledWith("New Reason 1");
});
});
Zde je složka
export const NewReasonForm: React.FC<Props> = ({ onCreate }) => {
const { register, handleSubmit } = useForm();
const onSubmit = (data: any) => onCreate("New Reason 1");
return (
<form onSubmit={handleSubmit(onSubmit)}>
<label>Example</label>
<input
defaultValue="test"
{...register("example")}
data-testid="example"
/>
<input type="submit" data-testid="submit" />
</form>
);
};
Byl jsem více než 8 hodin, se snaží napravit a vyhledávání v google, ale vypadá to, že lidé, které měl tento problém již vzdal. Nicméně to vypadá docela základní pro mě, pokud nemohu vyzkoušet tento jednoduchý, funkčnost, jak bych vyzkoušet ty složitější?
Poznámka
Když jsem odstranit handleSubmit, zdá se, že funguje, ale teoreticky bych to neměla dělat, že. Z toho, co jsem viděl, handleSubmit pouze hovory, zpětné volání, je-li formulář je platný. Ale moje forma nemá žádné omezení :(