reactjs - 得到错误“无法读取未定义的属性'__reactInternalInstance $ a2hlbpvzpyeu9ywvcwjr1kyb9'”

Question

我正在使用Jest测试以下Material-UI组件。我想断言，单击RaisedButton组件时会调用handleSubmit函数。

        //Form.js

export default class Form extends React.Component {    

<RaisedButton
            ref="buttonTag"
            className='SubmitButton'
            label='Go'
            icon={<ActionSearch />}
            onClick={this.handleSubmit} />

        handleSubmit = (event) => {

        };
    }

    //Form-test.js

    import Form from '../../src/Components/Form/Form';
    import React from 'react';
    import TestUtils from 'react-dom/test-utils';

    let form = TestUtils.renderIntoDocument(
        <Form />
    );

    const spy = jest.spyOn(form, 'handleSubmit').mockImplementation(() => {});
    let buttonNode = form.refs.buttonTag; 
    TestUtils.Simulate.click(buttonNode);
    expect(spy).toHaveBeenCalled();

当执行到：

TestUtils.Simulate.click(buttonNode);

我收到以下错误：

"Cannot read property '__reactInternalInstance$a2hlbpvzpyeu9ywvcwjr1kyb9' of undefined"

如何正确模拟RaisedButton的单击以触发handleSubmit（）？

Answer 1

而不是做：

let buttonNode = form.refs.buttonTag; 

我解决的方法是在按钮上放一个纯色 ID="myID"，然后像这样得到它：

const buttonNode = document.getElementById("myID");

然后执行 TestUtils.Simulate.click(buttonNode);