请我为下面的reactjs页面写一个unitTest.
export default class Collapsible extends React.Component { static propTypes = { title: React.PropTypes.string,children: React.PropTypes.any,}; render() { const { title } = this.props; return ( <details> <summary>{title}</summary> {this.props.children} </details> ); } }
继0730之后,我在下面写了我的测试
describe('Collapsible',()=>{ it('works',()=>{ let renderer = createRenderer(); renderer.render(<Collapsible title="MyTitle"><span>HEllo</span></Collapsible>); let actualElement = renderer.getRenderOutput(); let expectedElement = (<details><summary>title</summary>Details</details>); expect(actualElement).toEqual(expectedElement); }); });
但是,我的测试是在上面的标题中抛出错误,我怀疑我在Collapsible上的道具(即标题和孩子)没有从测试中分配.请问我该如何解决这个问题?非常感谢任何帮助或指导.
解决方法
@H_502_13@ 谢谢你的时间.事实证明我错误地将Collapsible导入测试文件.以下是我之前的导入方式import React from 'react'; import expect from 'expect'; import {createRenderer} from 'react-addons-test-utils'; import { Collapsible } from '../Collapsible.js';
改为之后
import React from 'react'; import expect from 'expect'; import {createRenderer} from 'react-addons-test-utils'; import Collapsible from '../Collapsible';
它似乎工作.我以前导入Collapsible作为现有的变量/对象.通过阅读文档和很少的教程,我意识到.