酶查找並選擇元素的第一個實例

Question

我正在嘗試點擊三個框中的第一個。

我的反應代碼看起來像這樣

const Boxes = (props) => {

   return (
     <div className="container">
        <div onClick={props.showMessage} className="box">One</div>
        <div onClick={props.showMessage} className="box">Two</div>
        <div onClick={props.showMessage} className="box">Three</div>
     </div>
   );
}

然后我的笑話代碼看起來像這樣

it("shows a message if Box One is selected", () => {
    let wrapper = shallow(
        <Boxes
            {...props}
        />
    );

    wrapper.find('.box').simulate('click');
    expect(wrapper.contains('Box One Clicked')).toEqual(true);

});

這給了我以下錯誤消息

方法“模擬”僅意味着在單個節點上運行。 3 找到了。

然后當我嘗試以下操作時它也不起作用並且測試失敗。

wrapper.find('.box').first().simulate('click');
expect(wrapper.contains('Box One Clicked')).toEqual(true);

Answer 1

有多個.box項目，您必須選擇其中一個，比如第一個：

wrapper.find('.box').at(0).simulate('click');