Solution to the Exercise
Explore how to implement a React component for task input with proper state management and event handling. Understand submitting input via a form and distinguish Jest testing methods like getByPlaceholder and queryByPlaceholder. This lesson helps you solidify skills in writing functional React components and effective tests.
We'll cover the following...
We'll cover the following...
Solution
As you recall, we wrote a test that renders the TaskInput component. We also tried entering some text into it. It then validated that an onSubmit callback was called.
Firstly, we need somewhere to store the input value. Let’s use the state for that:
const [value, setValue] = useState('');
And the handler function for the input:
const handleChange = (event) =>