Mocha + Axios + Sinon + chai unit testing

Question

У меня есть компонент реагирования с функцией, как показано ниже, которая вызывает службу api с использованием axios.I хотел бы знать, как писать единичный тест с использованием фермента, синона и chai.

import React from 'react'; 
import es6BindAll from 'es6bindall'; 
import { browserHistory } from 'react-router'; 
import axios from 'axios'; 

export default class Header extends React.Component { 
    constructor() { 
     super(); 
     es6BindAll(this,['handleLogoutClick']); 
    } 
    handleLogoutClick(e) { 
     e.preventDefault(); 
     let that = this; 
      this.serverRequest = axios({ 
       url: 'Url_to_call', 
       method: 'post' 
      }).then(function (successData) { 
       browserHistory.push("nextPage to navigate");     
      }.bind(that)); 
    } 
    render(){ 
     return(
      <div className="columns large-12 header-container"> 
       <h6 className="logout" onClick={this.handleLogoutClick}>Logout</h6> 
       </div> 
      </div> 
     ) 
    } 
} 

Я написал тестовый пример, как показано ниже

import React from 'react';     
import { mount,shallow } from 'enzyme';   
import { expect } from 'chai'; 
import sinon from 'sinon'; 
import '../testUtils'; 
import Header from '../../components/Common/Header'; 

describe('(Container) Header',() => { 
const wrapper = shallow(<Header />); 
let sandbox; 
    let server; 
    beforeEach(() => { 
    sandbox = sinon.sandbox.create(); 
    server = sandbox.useFakeServer(); 
    }); 
    afterEach(() => { 
    server.restore(); 
    sandbox.restore(); 
    }); 

    it('Logout link to be present',() => { 
    expect(wrapper.find('.logout')).to.exist; 
    }); 
    it('simulates logout clicks',() => {   

    wrapper.find('h6').filter('.logout').simulate('click',{preventDefault() {} }); 
     expect(wrapper.instance().handleLogoutClick).to.have.been.called; 

    }); 
}); 

И сконфигурированные testUtils.js ниже

var jsdom = require('jsdom').jsdom; 

global.document = jsdom(''); 
global.window = document.defaultView; 
Object.keys(document.defaultView).forEach((property) => { 
    if (typeof global[property] === 'undefined') { 
    global[property] = document.defaultView[property]; 
    } 
}); 
global.window.loggedInUserData = {userName: 'TestName'}; 
global.navigator = { 
    userAgent: 'node.js' 
}; 

Пожалуйста, дайте мне знать, как проверить Вардар и напускной browserHistory.I не я работайте в любом браузере, чтобы проверить это, пожалуйста, дайте мне знать, как насмехаться

Thanks

Answer 1

Вы должны окурок browserHistory с помощью Sinon, как показано ниже,

import { browserHistory } from 'react-router'; 
import { stub } from 'sinon'; 
const browserHistoryPushStub = stub(browserHistory, 'push',() => { }); 

Для насмешливыми запросов AXIOS, вы можете использовать Moxios