2017-05-09 4 views
1

반응 구성 요소를 테스트하려고하지만 시뮬레이션 기능을 사용하여 클릭을 트리거 할 수 없으므로 상태 변수를 테스트하거나 확인할 수 없습니다. 클릭 핸들러의 함수 호출. 여기 시뮬레이션 이벤트가 작동하지 않게하려면

는 컴포넌트 코드 -

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 ".

정확히 무엇이 잘못 될지 확실하지 않습니다. 간단한 테스트 여야합니다.

답변

0

콘솔 로그의 출력에서 ​​simulate를 호출 중입니다.

이 코드는 : console.log(header.find('a').get(5)).simulate('click');

은 다음과 같아야합니다 header.find('a').get(5).simulate('click');

나는 그 전에 짓을 ...하지만 난 console.log..problem에 싸여있는 출력을보고 내가 시뮬레이션 얻고있다
+0

함수가 아니며 단지 확인하고 싶었습니다. 내가 시뮬레이션을 가져올 필요가 있습니다. 내가 마운트 ... 효소에서했던 것처럼 .. 문서에 ... 아무것도 언급되어 있지 않습니다. – Ayan

+0

나는 그 앵커 태그에 대한 ID를 부여함으로써 .. 그걸 고쳤다. 여섯 앵커 태그는 내가 확인했다. 나는 효소에 문제가 있다고 생각한다. get 함수가 노드를 반환하기 때문에 ...하지만 시뮬레이션을 호출하면 어떻게 든 작동하지 않는다 .. – Ayan