1

Working template of the project: https://codesandbox.io/s/blue-currying-3me1t

The only test I have set up is in src/App.test.js to check that a name is rendered. I am trying to setup another test that checks to see if a function is called before the buttons are generated.

In FontAwesome.js there is a registerIcons() function that registers all of the icons needed for the website. I call this function in Buttons.js as it is the place where I use the icons.

I want to create a test in App.test.js that checks to see if registerIcons() is called before the buttons are created in Buttons.js.

arctic
  • 609
  • 3
  • 11
  • 19
  • FYI, may be below link will help you. https://stackoverflow.com/questions/40393486/test-if-function-is-called-react-and-enzyme – nav99 Jul 24 '20 at 06:20
  • Not really helpful for my case. They are testing render on click via simulation. – arctic Jul 24 '20 at 06:29

1 Answers1

1

You could typically do this by manually mocking your FontAwesome dependency like this:

import React from "react";
import { render } from "@testing-library/react";
import Button from "./Buttons.js";
import registerIcons from './FontAwesome'

jest.mock('./FontAwesome', () => ({
  __esModule: true
  default: jest.fn()
}))


test("registers icons", () => {
  render(<Button />);

  expect(registerIcons).toHaveBeenCalled();
});

However, it seems code sandbox does not currently support mocking. You could try it in your own IDE though.

CampbellMG
  • 2,090
  • 1
  • 18
  • 27
  • I am getting an error that says `TypeError: (0 , _FontAwesome.default) is not a function` and all of the stackoverflow answers for this error involved incorrectly implemented import statements. However, I think that all of my import statements are formatted correctly. Any suggestions? – arctic Jul 24 '20 at 07:05
  • I missed the `__esModule: true` from the export. I've just added it to my answer, try including that – CampbellMG Jul 24 '20 at 07:14