1 回答

TA貢獻(xiàn)1833條經(jīng)驗(yàn) 獲得超4個(gè)贊
如果你稍微重構(gòu)一下,你可以看到哪一行沒有被調(diào)用:
export const CardContainer = ({ index, icon, copy, click }) => (
<BlankCard variant="light" title={copy}>{icon}<p>{copy}</p>
{click && <a className="tile-learn-more" id={`tile-id-${index}`} onClick={() => {
click(index); // this one!
}}>Learn More</a>}
</BlankCard>
);
該行未被覆蓋,因?yàn)閺奈磳?shí)際調(diào)用回調(diào)。onClick
此外,僅僅測試任何函數(shù)是否綁定到它并不是很有用 - 綁定到一個(gè)no-op,比如,甚至綁定到錯(cuò)誤的函數(shù),仍然會(huì)通過。這也是在測試實(shí)現(xiàn),而不是行為。onClick={() => {}}
相反,模擬點(diǎn)擊并確保模擬被調(diào)用:
it('will do the right thing when the Learn More link is clicked', () => {
const mockOnClick = jest.fn();
const index = 1;
const props = { index, icon: 'icon', copy: 'foo', click: mockOnClick };
const wrapper = shallow(<CardContainer {...props} />);
wrapper.find('.tile-learn-more').simulate('click');
expect(mockOnClick).toHaveBeenCalledWith(index);
});
添加回答
舉報(bào)