Reactjs 在jest中将DOM元素作为event.target传递会被解释为空对象
我使用jest,酶来测试我的反应成分(摘要)。在这个组件中,我有一个带有onClick函数的按钮,该函数相对于这个按钮操纵DOM节点。该函数在浏览器中按预期工作,但当我测试它时(我模拟“单击”按钮并将event.target作为按钮本身传递)-我的组件表示event.target是一个空对象 摘要的功能Reactjs 在jest中将DOM元素作为event.target传递会被解释为空对象,reactjs,jestjs,enzyme,Reactjs,Jestjs,Enzyme,我使用jest,酶来测试我的反应成分(摘要)。在这个组件中,我有一个带有onClick函数的按钮,该函数相对于这个按钮操纵DOM节点。该函数在浏览器中按预期工作,但当我测试它时(我模拟“单击”按钮并将event.target作为按钮本身传递)-我的组件表示event.target是一个空对象 摘要的功能 showOrderList(event) { console.log(JSON.stringify(event)) //logs {"target":{}}
showOrderList(event) {
console.log(JSON.stringify(event)) //logs {"target":{}}
const $this = event.target;
const list = $this.parentElement.getElementsByClassName('orderItems')[0];
list.classList.toggle('hidden');
};
测试
it('button "Elementy" invokes style-changing showOrderList() onClick', (done) => {
configure({ adapter: new Adapter() });
const showOrderList = jest.spyOn(Summary.prototype, 'showOrderList');
const name = 'Kuba';
const age = '666';
const created = '123'
const list = [{name: name, age: age, created: created,
items: [{id: 0, color: 'blue', size: 's'}]}];
const component = shallow(
<Summary />
);
component.instance().setState({
list: list
});
component.update();
setTimeout(function () {
const showElemsBtn = component.find('.showElems').at(0);
const mockshowElemsBtnEvent = { target: showElemsBtn};
showElemsBtn.simulate('click', mockshowElemsBtnEvent);
setTimeout(function () {
expect(showOrderList).toHaveBeenCalledWith(mockshowElemsBtnEvent);
done();
component.unmount();
}, 500);
}, 4000)
});
it('按钮“Elementy”调用样式更改showOrderList()onClick',(完成)=>{
配置({adapter:newadapter()});
const showOrderList=jest.spyOn(Summary.prototype,'showOrderList');
常量名称='Kuba';
常数年龄='666';
已创建常量='123'
const list=[{name:name,age:age,created:created,
项目:[{id:0,颜色:'blue',大小:'s'}]}];
常数分量=浅(
);
component.instance().setState({
列表:列表
});
component.update();
setTimeout(函数(){
const showlembtn=component.find('.showlems')。位于(0);
const mockshowlembtnEvent={target:showlembtn};
showlembstn.simulate('click',mockshowlembstnevent);
setTimeout(函数(){
expect(showOrderList).tohavencalledWith(mockshowlembtnEvent);
完成();
component.unmount();
}, 500);
}, 4000)
});