我最近开始使用新的ionic 4
,它引入了react而不是角度语言。在最近的项目中,我正在使用react-testing-library
测试组件的反应。尤其是涉及表格以及表格的提交/更改时。由于ionic使用自己的Web组件而不是本机的Web组件(离子输入而不是输入),因此无法触发诸如更改值之类的事件。如果这样做,我会收到错误消息,该元素没有值的设置器。研究DOM树时,有一个本地输入元素作为ion-input
元素的子元素。似乎他们正在通过refs
通信,因为本机输入上不存在任何值。
现在更改测试用例中字段值的正确方法是什么?我也无法使用querySelector
查询本机输入元素。它返回并清空对象。当查询ion-input
时,返回元素。
感谢每个想法:)
如果使用onIonChange
事件,则需要为此触发一个自定义事件,例如:
const { getByPlaceholderText } = render(...);
const input = getByPlaceholderText('Input placeholder');
fireEvent(input, new CustomEvent('ionChange', { detail: { value: 'Text' } }));