2

I have a span tag in my component and I need to click it using enzyme

    <span className="lock"> 
    <span onClick={[undefined]} id="lock">
    <i className="fa fa-lock" />
    Reserve this chat
    </span>
    </span>

Here is my test

it('simulating reservechat click ...',()=>{
const wrapper=shallow(<ReserveChat activeConversation={conversation1} />);
const button=wrapper.find('span').last();
button.simulate('click');
});

I am confused to find what to click,usually there will be some div class or other findable tags

Thomas John
  • 2,138
  • 2
  • 22
  • 38

1 Answers1

1

Maybe you can use a ref attribute on your span element, like :

<span onClick={this.props.lockConversation} ref='chat-button'>

And then, I'm not that familiar with enzyme, but seems to me that something like 

const button=wrapper.ref('chat-button');

should work, if I read their doc properly.

Emualli
  • 11
  • 1
  • 2
    It should not be necessary to add a ref for the purpose of writing tests if it is not needed for the component's normal function. There should be another way. – Szczepan Hołyszewski Oct 27 '17 at 01:01