Reputation: 127
I just start learn tests for react and stuck on this moment.
Here is my function:
private handleCountyItemClick = (
e: React.FormEvent<HTMLButtonElement>
): void => {
const { countries } = this.props.countriesRed;
const selectedId: number = parseFloat(e.currentTarget.dataset.value);
const foundCountry = countries.find(
(country: Country, i: number) => i === selectedId
);
if (foundCountry) {
this.props.CountyItemClick(foundCountry);
this.props.clearInput();
this.setState({
dropdownOpen: false,
fullWidthFullHeightElHeight: 54
});
this.countriesListItems.current.style.height = "";
scrollIt(this.props.countriesRootEl.current, 300, "easeOutQuad", () =>
enableBodyScroll(this.countriesListItems.current)
);
}
};
and after then, i wrote this test, and i get the error:
it("should update the count by 1 when invoked by default", () => {
const wrapper = shallow(component);
const instance = wrapper.instance();
instance.handleCountyItemClick({
currentTarget: { dataset: { value: 1 } }
});
});
Error:
TypeError: _this.props.CountyItemClick is not a function
As you see, in my function i use another function from Redux and this error refers to function from Redux. I don't know what i need to do next! What do I need to do? How to proceed?
Upvotes: 0
Views: 1594
Reputation: 2879
Seems like you need to mock your props.
let props;
let wrapper;
beforeEach(() => {
props = {
CountyItemClick: jest.fn(),
};
wrapper = shallow(<Component {...props} />);
});
it("should update the count by 1 when invoked by default", () => {
const wrapper = shallow(component);
const instance = wrapper.instance();
instance.handleCountyItemClick({
currentTarget: { dataset: { value: 1 } }
});
expect(props.CountyItemClick).toHaveBeenCalled();
});
Upvotes: 3