如何测试反应的组分与重新合成肝卵圆细胞

问题描述：

使用最近开始重新构图（https://github.com/acdlite/recompose）如何测试反应的组分与重新合成肝卵圆细胞

我不知道我应该如何处理那些包裹着一些肝卵圆细胞的重新组合提供了单元测试组件？我喜欢如何用功能方法替换整个类的组件，但它在单元测试方面完全不是真的。

例如与给定列表组件

export const ListItem = toClass(pure(({ text }) => <li>{text}</li>)); 
 
const renderItems = R.map(t => <ListItem key={t} text={t} />); 
 

 
export const ListComponent = toClass(({ todos, name, updateName, addTodo }) => 
 
    <div> 
 
    <input onChange={updateName} value={name} /> 
 
    <button onClick={() => addTodo(name)}>add todo</button> 
 
    <ul> 
 
     {renderItems(todos)} 
 
    </ul> 
 
    </div> 
 
); 
 

 
... 
 

 
const List = compose(
 
    withReducer("state", "dispatch", listReducer, props => ({ 
 
    ...initialState, 
 
    ...props 
 
    })), 
 
    withHandlers({ 
 
    updateName: ({ dispatch }) => e => 
 
     dispatch({ type: "UPDATE_NAME", payload: e.target.value }), 
 
    addTodo: ({ dispatch, name }) => name => 
 
     dispatch({ type: "ADD_TODO", payload: name }) 
 
    }), 
 
    flattenProp("state") 
 
)(ListComponent); 
 

 
export default List;

我如何测试给定的道具孩子长？我试过这样的东西，但它不起作用。

it("renders todos list",() => { 
 
    const component = shallow(<List todos={["todo1", "todo2", "todo3"]} />); 
 
    expect(component.instance().children).toHaveLength(3); 
 
    });

答

使用mount代替shallow和istarkov给了good example here

答

不要使用mount代替shallow。改为使用.dive()而不是shallow。

挂载渲染所有的孩子以及单元测试不好。

如何测试反应的组分与重新合成肝卵圆细胞

相关推荐