Mocha-Chai rzuca "nie zdefiniowany nawigator" z powodu komponentu routera Reaktor

Piszę test dla komponentu React, który używa routera reagowania. Używam Mocha z Chai i Chai-jQuery.Mocha-Chai rzuca "nie zdefiniowany nawigator" z powodu komponentu routera Reaktor

Moje testy działają poprawnie, dopóki nie zaimportuję komponentu z routera reakcji do komponentu (np. Link). W tym momencie pojawia się następujący błąd:

ReferenceError: navigator is not defined 
    at Object.supportsHistory (/Users/nico/google-drive/code/agathos/client/node_modules/history/lib/DOMUtils.js:61:12)

Kiedyś uzyskać podobny błąd z reagują-bootstrap aż aktualizowane reagować-bootstrap v0.29.3. Mam najnowszą wersję routera reagowania v2.4.0 (i historię v2.1.1). Ale problem utrzymuje się.

Jedynym rozwiązaniem znalazłem jest zmiana node_modules/history/lib/DOMUtils: navigator do window.navigator. To jest jednak hackowanie, a nie dobre rozwiązanie.

Myślę, że problem dotyczy routera reagowania, ale nie mam rozwiązania.

Na wszelki wypadek oto moja test-helper.js.

import jquery from 'jquery'; 
import React from 'react'; 
import ReactDOM from 'react-dom'; 
import TestUtils from 'react-addons-test-utils'; 
import jsdom from 'jsdom'; 
import chai, { expect } from 'chai'; 
import chaiJquery from 'chai-jquery'; 
import { Provider } from 'react-redux'; 
import { createStore } from 'redux'; 
import reducers from './reducers'; 

// set up a testing environment to run like a browser in the command line 
// create a fake browser and html doc 
global.document = jsdom.jsdom('<!doctype html><html><body></body></html>'); 
global.window = global.document.defaultView; 
// prevent jquery defaulting to the dom by giving it access to the global.window 
const $ = jquery(window); 

// build renderComponent function that should render a React class 
function renderComponent(ComponentClass, props = {}, appState = {}) { 
    const componentInstance = TestUtils.renderIntoDocument(
    <Provider store={createStore(reducers, appState)}> 
     <ComponentClass {...props} /> 
    </Provider> 
); 
    // produces html 
    return $(ReactDOM.findDOMNode(componentInstance)); 
} 

//build a helper for simulating events 
// $.fn allows you to add a custom function to your jquery library 
$.fn.simulate = function(eventName, value) { 
    if (value) { 
    // `this` allows you to access the object appended to 
    // `val()` is a jquery function that sets the value of selected html element 
    this.val(value); 
    } 
    // the [] are object method selectors, which allow you to access e.g. Simulate.change 
    TestUtils.Simulate[eventName](this[0]); 
}; 

// set up chai jquery 
chaiJquery(chai, chai.util, $); 

export {renderComponent, expect};

Źródło

2016-05-06 Nico

Wydaje się, że react-router zakłada navigator jest w zasięgu globalnym.

Aby rozwiązać ten problem, należy dodać navigator zakresu globalnego w fazie testowej:

global.navigator = { 
    userAgent: 'node.js' 
};

Źródło

2016-05-07 05:30:17

Pracował jak urok! Dziękuję Ci. – Valjas

Mocha-Chai rzuca "nie zdefiniowany nawigator" z powodu komponentu routera Reaktor

Odpowiedz

Powiązane problemy