如何使用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'); 
    }); 
});