This is a reminder to myself. And to anybody who needs a creative solution to test an event handler directly attached to a DOM node of a react component. Last Friday I ran into the situation to test my react component to ensure that the state updates correctly when the pointerenter and pointerleave event fires. Testing for these events is usually no big deal when you use reactjs in one way or the other (either web or native).

ReactJS San Francisco Meetup at Zendesk Thursday night I attended the SF ReactJS Meetup at Zendesk. First of all, there were some noticeable difference to some other meetups I went to in the past, No need to sign No need to sign an NDA before entering the premise No Pizza! The office space is gorgeous. Grass on the wall, stairs to sit on and a small atrium like opening from the basement to the first floor to bring some light to the lower level.

I was building a Reactjs component, that should toggle between two child components. <Toggle> <Comp1> <Comp2> </Toggle> The render method of Toggle looked like this render() { const content = React.Children.count(this.props.children) > 0 ? this.props.children[0] : this.props.children[1]; return ( ${content} ); } Unfortunately, this didn’t work (index out of bounds), when I passed only one component instead of two. This doesn’t make sense since the Toggle is supposed to toggle between two components.