我正在使用jsdom在我的React组件下测试自己的微型"虚拟浏览器"工具,这个工具挺好用,但是当我尝试使用setState
时就出问题了。例如,测试一个儿童年龄输入控件:
describe('rendering according to the draft value', function () {
var component;
beforeEach(function () {
component = TestUtils.renderIntoDocument(
React.createElement(ChildrenInput, {value: []})
);
component.setState({draft: [{age: null}, {age: null}]}, done);
});
it('overrides the value property for the count', function () {
assert.strictEqual(component.refs.count.props.value, 2);
});
it('overrides the value property for the ages', function () {
assert.strictEqual(component.refs.age1.props.value, null);
});
});
未捕获的错误:不变式违规:dangerouslyRenderMarkup(...): 无法在工作线程中呈现标记。在单元测试时确保window
和document
在全局范围内可用,或使用React.renderToString进行服务器呈现。
我知道像TestBrowser
这样基于jsdom的工具确实设置了window
和document
全局变量,如下所示:
global.document = jsdom.jsdom('<html><body></body></html>', jsdom.level(1, 'core'));
global.window = global.document.parentWindow;
我甚至尝试将setState
包装成setTimeout(..., 0)
,但这也没有帮助。我该如何使测试状态更改有效?