2015-10-03 25 views
9

की संपत्ति 'addEventListener' को पढ़ नहीं सकता है, मैं सिर्फ मोटा 2.3.3, जेएसडम 6.5.1, और नोड.जेएस 4.1.1 के साथ एक प्रतिक्रिया 0.10.0 घटक परीक्षण इकाई शुरू कर रहा हूं। । मैं अपने इकाई परीक्षण के लिए इस है:mocha + jsdom + प्रतिक्रिया प्रकार त्रुटि: अपरिभाषित

var React = require('react/addons'); 
var TestUtils = React.addons.TestUtils; 
var sinon = require('sinon'); 
var expect = require('chai').expect; 
var jsdom = require('jsdom'); 
var view = require('../student-name-view.js'); 

describe('The student name view', function() { 

    var renderedComponent = null; 
    var nameChangedStub = sinon.stub(); 
    var nameSubmittedStub = sinon.stub(); 

    before(function() { 
     global.document = jsdom.jsdom('<!doctype html><html><body></body></html>'); 
     global.window = document.parentWindow; 
     this.renderedComponent = TestUtils.renderIntoDocument(
      view({ 
       nameChanged: nameChangedStub, 
       nameSubmitted: nameSubmittedStub 
      }) 
     ); 
     this.nameInput = TestUtils.findRenderedDOMComponentWithTag(renderedComponent, 'input').getDOMNode(); 
    }); 

    describe('should notify the controller', function() { 

     it('when the name field changes', function() { 
      TestUtils.Simulate.change(this.nameInput); 
      expect(nameChangedStub.called).to.be.true; 
     }); 

    }); 

}); 

और ये मेरे सरल प्रतिक्रिया दृश्य है:

TypeError: Cannot read property 'addEventListener' of undefined 
    at Object.EventListener.listen (node_modules/react/lib/EventListener.js:21:15) 
    at Object.merge.ensureScrollValueMonitoring (node_modules/react/lib/ReactEventEmitter.js:315:21) 
    at Object.ReactMount._registerComponent (node_modules/react/lib/ReactMount.js:282:23) 
    at Object.<anonymous> (node_modules/react/lib/ReactMount.js:305:36) 
    at Object._renderNewRootComponent (node_modules/react/lib/ReactPerf.js:57:21) 
    at Object.ReactMount.renderComponent (node_modules/react/lib/ReactMount.js:359:32) 
    at Object.renderComponent (node_modules/react/lib/ReactPerf.js:57:21) 
    at Object.ReactTestUtils.renderIntoDocument (node_modules/react/lib/ReactTestUtils.js:57:18) 
    at Context.<anonymous> (test/student-name-view-test.js:19:44) 

किसी भी:

var React = require('react'); 

var StudentNameView = React.createClass({ 

    render: function() { 
     return React.DOM.div({ 
      id: 'name-container', 
      children: [ 
       React.DOM.p({ 
        children: 'Enter your name' 
       }), 
       React.DOM.input({ 
        id: 'nameInput', 
        onChange: this.props.nameChanged 
       }), 
       React.DOM.button({ 
        id: 'doneButton' 
       }) 
      ] 
     }) 
    } 

}); 

module.exports = StudentNameView; 

जब मैं परीक्षण चलाने के लिए, मैं इस स्टैक ट्रेस मिल विचार क्या मैं गलत कर रहा हूँ?

+0

कौन-सा संस्करण क्या आप का उपयोग कर रहे हैं? –

+0

मैंने सभी संस्करण संख्याओं के लिए प्रश्न अपडेट किया। –

+3

क्या होता है यदि आप 'jsdom.jsdom()। ParentWindow' से' jsdom.jsdom() में बदल जाते हैं। DefaultView'? –

उत्तर

24

मैं मामले में समाधान यह किसी और में मदद करता है पोस्टिंग कर रहा हूँ। यह विस्तार से here में समझाया गया है, लेकिन संक्षेप में: आपको यह सुनिश्चित करना होगा कि डोड तैयार हो जाने से पहले नोड के मॉड्यूल लोडर द्वारा लोड किया गया हो। आप इसे मोचा के --require विकल्प का उपयोग करके और jsdom सेटअप वाली फ़ाइल निर्दिष्ट करके मजबूर कर सकते हैं।

मेरे मामले में, मैं निम्नलिखित सामग्री के साथ मेरी test निर्देशिका में setup.js नामक फ़ाइल बना:

var jsdom = require('jsdom'); 

global.document = jsdom.jsdom('<!doctype html><html><body></body></html>'); 
global.window = document.defaultView; 
global.navigator = {userAgent: 'node.js'}; 

और अब अपने परीक्षण इस आदेश के साथ सफलतापूर्वक चलता:

mocha --require ./test/setup.js

+2

es2015 का उपयोग करने वाले लोगों के लिए, jsdom आयात न करें। मैंने इसे काम करने के लिए कुछ घंटे बिताए, और आयात के बजाय आवश्यकताओं का उपयोग करके यह काम किया। मुझे नहीं पता क्यों, मैं बस खुश हूं कि यह आखिरकार काम करता है ... – nhjk

+0

मैं 'आयात' वाक्यविन्यास के साथ jsdom का उपयोग कर रहा हूं ठीक है। यह आपके बेबेल कॉन्फ़िगरेशन पर निर्भर करता है। –

+0

क्यों नहीं 'global.navigator = global.window.navigator'? –

संबंधित मुद्दे