Question

我有一个react-app，我在一个组件中渲染按钮，在另一个组件中建模。该按钮访问功能openModal，以通过引用打开模态。我正在为我的应用程序编写测试用例，但无法找到一种方法来编写测试用例，以检查是否在单击按钮时打开了模态

按钮组件

        <div>
          <button type='primary' onClick={() => this.handleClick.showModal()}>
            ADD 
          </button>
          <AddConceptModal ref={(instance) => this.handleClick = instance}/>
        </div>

模式组件：

    class ModalComp extends React.Component {
  state = {

    visible: false,

  }


  // show modal handles the logic of opening the modal
  showModal = () => {
    this.setState({
      visible: true,
    })
  }


  render() {
    const { visible } = this.state

    return (
      <div>
        <Modal
          visible={visible}
        >
          modal
        </Modal>
      </div>
    )
  }
}

export default ModalComp

我尝试创建这样的实例：

let component = mount(<ModalComp />)
const instance = component.instance()

我什至试着用spyOn方法也可以做到这一点。我该如何编写模拟按钮组件中的按钮的测试，该组件调用showModal（）和我想检查按钮click模拟后模态是否正在接受道具

使用引用访问函数的测试用例

0 个答案: