Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

expect toHaveBeenCalledWith not working with latest CreateReactApp setup

I have code like below which checks if my named function has been called with certain arguments:

    const wrapper = mount(<PromotionsContent {...props} />);
    let params = new URLSearchParams();
    params.append('page', 0);
    params.append('size', '20');

    expect(getPromotions).toHaveBeenCalledWith(params);

Here getPromotions is a named function which is imported and mocked correctly in the test file. This used to work fine before but after upgrading my app to use latest CreateReactApp(with React 16.12.0) it has started breaking. I have also logged params to the console just before where getPromotions is called and I could actually see right values but in the test it just prints like below and fails:

expect(jest.fn()).toHaveBeenCalledWith(...expected)

    - Expected
    + Received

    - {},
    + {},

    Number of calls: 1

Surprisingly if I directly use the called arguments like below it works:

    const wrapper = mount(<PromotionsContent {...props} />);
    let params = new URLSearchParams();
    params.append('page', 0);
    params.append('size', '20');

   let calledParams = getPromotions.mock.calls[0][0];
   expect(calledParams.get('page')).toEqual ('0');
   expect(calledParams.get('size')).toEqual ('20');

Any clues, please?

like image 934
geekprogrammer Avatar asked Jan 15 '20 02:01

geekprogrammer


1 Answers

I tried this on a fresh install of react app using 16.12.0 and it is working.

Can you share more of your code?

import React, { useEffect } from "react";
import { render } from "@testing-library/react";
import App from "./App";

const MyComponent = ({ getPromotions }) => {
  useEffect(() => {
    const params = new URLSearchParams();
    params.append("page", "0");
    params.append("size", "0");

    getPromotions(params);
  }, []);
  return null;
};

describe("Lorem Ipsum", () => {
  it("should pass", () => {
    const getPromotionsMock = jest.fn();
    render(<MyComponent getPromotions={getPromotionsMock} />);
    const params = new URLSearchParams();
    params.append("page", "0");
    params.append("size", "0");

    expect(getPromotionsMock).toHaveBeenCalledWith(params);
  });
});
like image 76
karlmarxlopez Avatar answered Nov 20 '22 16:11

karlmarxlopez