如何使用React測試實用程序與Jasmine

Question

我使用React的測試實用程序製作了單元測試代碼。 但遇到問題

我的環境是：

• 軌道4
• 茉莉花2.0.0
• 骨幹1.1.2

describe("cNotice", function() { 
    it("lol", function() { 
     console.log(Notice); // present 
     console.log(<Notice message="show me the message" />); // return Constructor 

     var instance = <Notice message="show me the message" />; 
     var component = React.addons.TestUtils.renderIntoDocument(instance); 
     expect(component.getDOMNode().childNodes[0].className).toBe('notice'); 
    }); 
}); 

錯誤消息：

Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. This usually means that you're trying to add a ref to a component that doesn't have an owner (that is, was not created inside of another component's render method). Try rendering this component inside of a new top-level component which will hold the ref.

---

UPDATE

這個代碼是沒有問題的：

describe("cNotice", function() { 
    var Notice = null; 
    beforeEach(function() { Notice = React.createClass({...}); }); 

    it("lol", function() { 
     var instance = <Notice message="show me the message" />; 
     var component = React.addons.TestUtils.renderIntoDocument(instance); 
     expect(component.getDOMNode().childNodes[0].className).toBe('notice'); 
    }); 
}); 

但是我想從外部文件導入的通知組件。

Answer 1

解決

我使用的窗口命名空間。
進口來自外部文件的通知組件

describe("cNotice", function() { 
    it("lol", function() { 
     var component = React.addons.TestUtils.renderIntoDocument(window.Notice({ message: "show me the message" })); 
     expect(component.getDOMNode().childNodes[0].className).toBe('notice'); 
    }); 
});