React Native Jest测试：如何触发状态控制渲染元素的点击事件？

看起来你遇到的问题核心是直接修改组件状态后没触发重新渲染，导致目标TouchableOpacity根本没被渲染出来，所以Enzyme找不到元素才报错。咱们一步步解决：

第一步：修正组件的测试标识属性 #

React Native的原生组件（比如TouchableOpacity）并不支持用id作为测试选择器，你得换成官方推荐的testID属性。先修改你的组件代码：

{this.state.noRecord ? 
  <View> 
    <TouchableOpacity testID="navEnqtrn" onPress={() => this.navEnqtrn()}> 
      <Text style={styles.courseEnquiry}> Learning enquiry </Text> 
    </TouchableOpacity> 
  </View> : 
  <View> 
    <Text>Some other view here..</Text>
  </View> 
}

第二步：正确更新状态并触发组件重新渲染 #

你之前直接修改wrapper.state.noRecord = true的方式是错误的——这只是修改了Enzyme包装器里的状态对象，并没有触发组件的setState生命周期，组件自然不会重新渲染出条件UI。

调整你的测试用例，用Enzyme提供的setState方法来更新状态：

it('checks navEnqtrn', () => { 
  const wrapper = shallow(<Online navigation={navigation}/>); 
  // 正确设置state，这会触发组件重新渲染
  wrapper.setState({ noRecord: true });
  // 极少数情况下shallow渲染可能需要手动强制更新，可按需添加
  // wrapper.update();
  const instance = wrapper.instance(); 
  const navEnqtrnSpy = jest.spyOn(instance,"navEnqtrn"); 
  // 通过testID查找目标元素
  wrapper.find('[testID="navEnqtrn"]').simulate('press'); 
  expect(navEnqtrnSpy).toBeCalled(); 
});

补充说明 #

Enzyme的shallow包装器会维护组件的内部状态，但只有通过setState、props更新等符合组件生命周期的方式，才会触发重新渲染逻辑。直接修改wrapper.state跳过了这些流程，所以条件渲染的UI不会被渲染出来，自然找不到你要模拟点击的元素。

内容的提问来源于stack exchange，提问作者komalV