您好我有这个组件
class ConfirmDialog extends Component {
...
render() {
const actions = [
<FlatButton
label="Cancel"
primary={true}
onTouchTap={this.handleClose}
/>,
<FlatButton
label="Submit"
primary={true}
keyboardFocused={true}
onTouchTap={this.handleConfirm}
/>,
];
return (
<div>
<Dialog
title="xxx"
actions={actions}
open={this.state.open}
onRequestClose={this.handleClose}
>
</Dialog>
</div>
);
}
我想从我正在使用的取消按钮模拟touchTap sinon jest +酶。 我尝试了很多解决方案但没有工作 我的考试......
const clickSpy = spy();
const wrapper = mount(<ConfirmDialog
openDialog={true}
confirmDialog={clickSpy}
/>,
{ // Workaround https://github.com/callemall/material-ui/issues/5330
context: { navigate: () => { }, muiTheme: getMuiTheme() },
childContextTypes: { navigate: () => { }, muiTheme: React.PropTypes.object.isRequired }
}
);
const cDialog = wrapper.find(Dialog);
const cBtn = cDialog.find(FlatButton);
cBtn.simulate('touchTap');
结果:
方法“模拟”仅用于在单个节点上运行。 0找到了。
at ReactWrapper.single (node_modules\enzyme\build\ReactWrapper.js:1364:17)
at ReactWrapper.simulate (node_modules\enzyme\build\ReactWrapper.js:751:14)
at Object.<anonymous> (src\components\ConfirmDialog\ConfirmDialog.test.js:77:10)
at process._tickCallback (node.js:369:9)
使用此版本
"sinon": "^1.17.6"
"material-ui": "^0.16.4",
"react": "^15.4.1",
"enzyme": "^2.6.0",
UPDATE1:
const cDialog = wrapper.find(Dialog).first();
const cBtn = cDialog.find('FlatButton').first();
结果
Method “simulate” is only meant to be run on a single node. 0 found instead.
log console.log(“cBtn”);的console.log(cBtn);
console.log src\components\ConfirmDialog\ConfirmDialog.test.js:76
cBtn
console.log src\components\ConfirmDialog\ConfirmDialog.test.js:76
ReactWrapper {
component: null,
root:
ReactWrapper {
component:
{ setChildProps: [Object],
setChildContext: [Object],
getInstance: [Object],
getWrappedComponent: [Object],
props: [Object],
context: {},
refs: {},
updater: [Object],
state: [Object],
_reactInternalInstance: [Object] },
root: [Circular],
node:
ConfirmDialog {
props: [Object],
context: {},
refs: {},
updater: [Object],
handleClose: [Function],
handleConfirm: [Function],
mOpenDialog: true,
state: [Object],
_reactInternalInstance: [Object] },
nodes: [ [Object] ],
length: 1,
options: { context: [Object], childContextTypes: [Object] },
complexSelector:
ComplexSelector {
buildPredicate: [Function: buildInstPredicate],
findWhereUnwrapped: [Function: findWhereUnwrapped],
childrenOfNode: [Function: childrenOfInst] } },
nodes: [],
length: 0,
options: {},
complexSelector:
ComplexSelector {
buildPredicate: [Function: buildInstPredicate],
findWhereUnwrapped: [Function: findWhereUnwrapped],
childrenOfNode: [Function: childrenOfInst] } }
UPDATE2
const dialog = wrapper.find('Dialog').first();
const buttons = dialog.props('actions');
shallow(buttons[0]).simulate('touchTap');
shallow(buttons[1]).simulate('touchTap');
RESULT-UPDATE2
TypeError: Cannot read property 'type' of undefined
at ReactShallowRenderer.render (node_modules\enzyme\build\react-compat.js:153:30)
at node_modules\enzyme\build\ShallowWrapper.js:90:26
at ReactDefaultBatchingStrategyTransaction.TransactionImpl.perform (node_modules\react-dom\lib\Transaction.js:140:20)
at Object.ReactDefaultBatchingStrategy.batchedUpdates (node_modules\react-dom\lib\ReactDefaultBatchingStrategy.js:62:26)
at batchedUpdates (node_modules\react-dom\lib\ReactUpdates.js:97:27)
at node_modules\enzyme\build\ShallowWrapper.js:89:41
at withSetStateAllowed (node_modules\enzyme\build\Utils.js:224:3)
at new ShallowWrapper (node_modules\enzyme\build\ShallowWrapper.js:88:38)
at shallow (node_modules\enzyme\build\shallow.js:19:10)
at Object.<anonymous> (src\components\ConfirmDialog\ConfirmDialog.test.js:66:51)
at process._tickCallback (node.js:369:9)