e.currentTarget.input.value = undefined?? ReactJS Testing Library - reactjs

Question

I'm trying to make a test using ReacTJS Testing Library for a to-do list form, the test I want to implement it's supposed to check if the form has called a function from parameter but I'm having a hard time receiving an error I cannot solve (error at the end of the question).
What am I doing wrong here??
My form component code:
import { FC } from "react";
import "./TaskCreator.css";
interface TaskCreatorProps {
sendNewTask: (text: string) => void;
}
const TaskCreator: FC<TaskCreatorProps> = ({ sendNewTask }) => {
return (
<form
action="#"
className="todo__form"
onSubmit={(e) => {
e.preventDefault();
sendNewTask(e.currentTarget.taskInput.value);
}}
>
<input
name="taskInput"
className="form__input"
type="text"
placeholder="New to do..."
required
/>
<button className="form__submit" type="submit">
Add new task
</button>
</form>
);
};
export default TaskCreator;
The test's code:
import { render, screen } from "#testing-library/react";
import userEvent from "#testing-library/user-event";
import TaskCreator from "./TaskCreator";
describe("Given a TaskCreator component", () => {
test("When the user creates a new task, it should be sent by parameter to App component", () => {
const callbackFn = jest.fn();
render(<TaskCreator sendNewTask={callbackFn} />);
const formInput = screen.getByRole("textbox");
userEvent.type(formInput, "test");
const formButton = screen.getByRole("button");
userEvent.click(formButton);
expect(formInput).toHaveValue("test");
expect(callbackFn).toHaveBeenCalled();
});
});
The error:
● Given a TaskCreator component › When the user creates a new task, it should be sent by parameter to App component
TypeError: Cannot read properties of undefined (reading 'value')
13 | onSubmit={(e) => {
14 | e.preventDefault();
> 15 | sendNewTask(e.currentTarget.taskInput.value);
| ^
16 | }}
17 | >
18 | <input
● Given a TaskCreator component › When the user creates a new task, it should be sent by parameter to App component
expect(jest.fn()).toHaveBeenCalled()
Expected number of calls: >= 1
Received number of calls: 0
15 |
16 | expect(formInput).toHaveValue("test");
> 17 | expect(callbackFn).toHaveBeenCalled();
| ^
18 | });
19 | });
20 |
at Object.<anonymous> (src/components/TaskCreator/TaskCreator.test.tsx:17:24)
Test Suites: 2 failed, 2 total
Tests: 1 failed, 1 total
Snapshots: 0 total
Time: 0.764 s, estimated 1 s
I have already tried to test with async and await but I didn't get any result.