Единичный тест-ретранслятор onEnter/onLeave

Question

У меня есть несколько логических схем на OnEnter/onLeave. Я использовал setInterval на onEnter и очистил их на onLeave, используя clearInterval.

Как я могу выполнить проверку над корпусом?

<Route 
     component={App} 
     onEnter={onEnterApp} 
     onLeave={onLeaveApp} 
     path="/app"> 

Ниже мой тест, но он терпит неудачу,

import React from 'react'; 
import App from '../components/views/app.jsx'; 
import {shallow, mount, render} from 'enzyme'; 
import {expect, assert} from 'chai'; 
import sinon from 'sinon'; 
import {mountWithIntl} from '../test_utils/intl-enzyme-test-helper.js'; 





describe(‘App renders correctly',() => { 

    it('When mounting set intervals',() => { 
     const wrapper = mountWithIntl(<App/>); 
     expect(window.x).to.exist; 
     expect(window.y).to.exist; 
    }); 

    it('When unmounting clear intervals',() => { 

     const wrapper = mountWithIntl(<App/>); 
     wrapper.unmount(); 
     expect(window.x).to.not.exist; 
     expect(window.y).to.not.exist; 
    }); 

}); 

Answer 1

The onEnter и onLeave реквизита не привязаны к componentWillMount и componentWillUnmount методов вашего <App> компонента, поэтому просто подключение и отключение <App> не будут вызывать эти функции.

Предполагая, что вы доверие, реагирующий маршрутизатор работает, вы можете просто проверить, что ваши onEnterApp и onLeaveApp функций работают правильно

describe('onEnterApp',() => { 
    it('sets x and y',() => { 
    onEnterApp(); 
    expect(global.x).to.exist; 
    expect(globa.y).to.exist; 
    }); 
}); 

Если вы хотите, чтобы убедиться, что они работают, когда URL соответствует /app пути, то вы необходимо будет включить <Router>.

import createMemoryHistory from 'react-router'; 

describe('App',() => { 
    it('runs onEnterApp when navigating to /app', (done) => { 
    const history = createMemoryHistory(['/app']); 
    const holder = document.createElement('div'); 
    render((
     <Router history={history}> 
     <Route 
      component={App} 
      onEnter={onEnterApp} 
      onLeave={onLeaveApp} 
      path="/app"> 
     </Router> 
    ), holder,() => { 
     expect(global.x).to.exist; 
     expect(globa.y).to.exist; 
     done(); 
    }); 
    }); 
}); 

Тестирование onLeaveApp потребуется перемещаться на новое место с history экземпляра, а затем проверить, что желаемое глобальное состояние существует.

history.push({ pathname: '/foo' })