-
Book Overview & Buying
-
Table Of Contents
-
Feedback & Rating
Learn React with TypeScript - Third Edition
By :
So far, our tests have simply rendered the checklist component with various props set. Users can interact with the checklist component by checking and unchecking items. In this section, we will first learn how to simulate user interactions in tests. We will then use this knowledge to test whether list items are checked when clicked and that onCheckedIdsChange is raised.
The React Testing Library has a fireEvent function that can raise events on DOM elements. The following example raises a click event on a Save button:
render(<button>Save</button>); fireEvent.click(screen.getByText(‘Save’));
This is okay, but what if logic was implemented using a mousedown event rather than click? The test would then need to be as follows:
render(<button>Save</button>); fireEvent.mouseDown(screen.getByText(‘Save’));
Fortunately, there is an alternative approach to performing...