没有让模拟事件工作以触发点击

时间:2017-05-09 20:19:48

标签: reactjs jestjs enzyme

我正在尝试测试一个react组件,但不知怎的,我无法获得模拟函数来触发click,因此我无法测试状态变量或检查click处理程序的函数调用。

以下是组件代码: -

import React, { Component } from 'react';
   import { Navbar,Nav,NavItem,NavDropdown,MenuItem,Panel } from 'react-
   bootstrap';
   import PropTypes from 'prop-types';

   class Header extends Component {
   constructor() {
    super();
    this.state = {
     isLogOut : false
    };
    this.handleLogOut=this.handleLogOut.bind(this);

    }  
    handleLogOut(){
    this.setState({isLogOut:true});   
    }
    render() {
    return (
      <Navbar>
        <div className="network-nav-bar">
            <div className="network-nav-bar-items">
               <ul className="nav nav-tabs">
                    <li><a href="#">Network Opimization</a></li>
                    <li><a href="#">Quick links</a></li>
                    <li><a href="#">What If?</a></li>
               </ul>
            </div>
        </div>
        <div className="col-xs-6">
        <Navbar.Header>
          <Navbar.Brand>
            <a href="#" className="ancIndiLogo">INDi</a>
          </Navbar.Brand>
        </Navbar.Header>
        </div>
        <div className="col-xs-6 noPadding">
       <Nav className="pull-right"> 
         <NavDropdown eventKey={3} title="Felicia Johnson" id="basic-nav-
    dropdown">
            <MenuItem eventKey={3.1} onClick=
   {this.handleLogOut}>LogOut</MenuItem>
          </NavDropdown>
        </Nav>
        <i className="glyphicon glyphicon-search pull-right"></i>
        </div>

 </Navbar>
    );
  }
}

export default Header;

这是规范文件: -

'use strict';
  import React from 'react';
  import Header from '../modules/common/header';
  import {mount} from 'enzyme';
  describe('Testing the Header when', () => {
    it('the it should have text-center class', () => {
    const header = mount(
    <Header/>
   );
    expect(header.find('i .glyphicon-search').length).toBe(1);
   expect(header.find('a').length).toBe(6);
    console.log(header.state());
   console.log(header.find('a').get(5)).simulate('click');
      console.log(header.state());     
    expect(header.state().isLogOut).to.equal(true); 

});

});

这是package.json依赖项文件: - “酶”:“^ 2.8.2”。

不确定这里到底出了什么问题......应该是一个简单的测试。

2 个答案:

答案 0 :(得分:1)

尝试使用.at(index)代替.get(index)

答案 1 :(得分:0)

您正在控制台日志的输出上调用simulate。

您的代码: R = / \b # match word break #{'apples'.reverse} # match 'elppa' \b # match word break (?! # begin a negative lookahead \s+ # match one or more whitespaces #{'bad'.reverse} # match 'dab' \b # match word break ) # close negative lookaheaad /ix # case-indifferent and free-spacing regex definition modes #=> / \b # match word break elppa # match 'selppa' \b # match word break (?! # begin a negative lookahead \s+ # match one or more whitespaces dab # match 'dab' \b # match word break ) # close negative lookaheaad /x def avoid_bad_apples(str) str.reverse.match? R end avoid_bad_apples("good apples") #=> true avoid_bad_apples("Simbad apples") #=> true avoid_bad_apples("bad pears") #=> false avoid_bad_apples("bad apples") #=> false avoid_bad_apples("bad apples") #=> false avoid_bad_apples("good applesauce") #=> false avoid_bad_apples("Very bad apples. BAD!") #=> false

应该是: console.log(header.find('a').get(5)).simulate('click');