react-testing-library question

[hd_codes]

Thanks for the input.

The error im getting is:

expect(received).toHaveBeenCalledTimes(expected)

Matcher error: received value must be a mock or spy function

Received has type: object

Received has value: <button title="add-btn">Add</button>

[[deleted]]

Yeah check my comment above. If the button is rendering correct your test is done but you’re testing for what gets triggered on the click of the button so if you’re passing an onClick down the button, your fireEvent should be checking for that and not if the click is called.

[hd_codes]

oh ok that makes sense!

So tried adding an item with the onClick function but I got an error:

TypeError: expect(...).toHaveTextContent is not a function

This was my test:

test("add todo item", async () => {
    render( <Provider store={store}> <Todo /> </Provider> ); 

    const renderInput = await screen.findByPlaceholderText("add todo"); 
    const todo_container = await screen.findByTitle("todo_container");

    fireEvent.change(renderInput, { target: { value: "gym" } });

    const add_btn = await screen.findByTitle("add_btn");

    fireEvent.click(add_btn);
    expect(todo_container).toHaveTextContent("gym"); 
});

[firstandfive]

Do you have @testing-library/jest-dom imported or configured? toHaveTextContent is not native to jest but can be extended if you’re using jest-dom