React 17使用Enzyme测试单选按钮无法触发onChange事件的原因是什么？

不是适配器兼容问题，是你的测试代码存在两处明显错误：

• 事件触发目标错误：你通过#intermediate选择器选中的是<label>标签，但是onChange事件是绑定在label内部的<input type="radio">元素上的，给label触发change事件不会触发输入框的回调。
• 选中值展示元素的选择器错误：你的组件里展示选中值的div类名是radio，测试代码里查找的.selected类在组件中完全不存在，自然拿不到正确的更新后的值。

it('should change the selected option when clicking on Intermediate', () => {
  // 选择label下的input元素，而不是label本身
  const radioInput = wrapper.find('#intermediate input');
  // 正确选择展示选中值的元素，前三个.radio是单选框容器，第四个是展示区
  const selectedOne = wrapper.find('.radio').at(3);
  expect(selectedOne.text()).toContain('Beginner');

  // 给input触发change事件，补充checked属性更贴近真实浏览器事件参数
  radioInput.simulate('change', { target: { value: 'Intermediate', checked: true } });

  // 重新查询元素获取更新后的值
  const selectedTwo = wrapper.find('.radio').at(3);
  expect(selectedTwo.text()).toContain('Intermediate');
});

• 可以给展示选中值的div单独加一个类名比如selected-value，避免用索引选择元素，测试代码健壮性更高
• 触发单选框change事件时建议带上checked: true的属性，更贴近真实浏览器触发事件的参数

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