Jest : Test method in reactjs component

Question

I have functional component FilterBar -

const FilterBar=()=>{

....
....
useEffects..
states...

function apiCallToFilters()
{
  ...
  ...
}

...
..

}

Since entire code cannot be shared , I have shared a structure and a method which I want to test from jest.

I have written FilterBar.test.tsx -

describe('Filter Bar', () => {
  it('All Api Calls', () => {
    const wrapper = shallow(<FilterBar />);
    expect(wrapper.instance().apiCallToFilters //not able to find apiCallToFilters method here
  });
});

I have followed this question from SO.

After having wrapper.instance(). I am getting below properties and methods -

context
forceUpdate
getSnapshotBeforeUpdate
props
render
setState
shouldComponentUpdate
state

How can I test apiCallToFilters method in FilterBar from jest?

Hi, if my answer helped resolve your question, would you mind accepting it? Thankyou! — Ovidijus Parsiunas, May 13 '22 at 11:08

score 1 · Accepted Answer · answered May 11 '22 at 11:38

Enzyme - the library that gives programmatic access to a component instance's properties can only give access to properties that are accessible from outside as it cannot violate JavaScript's encapsulation principles.

I cannot see what kind of a component you are using from in your example code, but I would strongly advise you to convert it to a class component and change the apiCallToFilters function into a method (by removing the function keyword).

Link to a thread where this is called out can be found here.

Jest : Test method in reactjs component

1 Answers1