0
が最近再構成使用して開始した構図のhocsとコンポーネントを反応させるテストする（https://github.com/acdlite/recompose）どのよう
私はhocsの一部が提供する再構成でラップされているユニットテストコンポーネントにアプローチすべきか、私は疑問に思いますか？私はクラスコンポーネント全体を機能的なアプローチに置き換えることが大好きですが、単体テストの点では全く真実ではありません。与えられたリストの要素を持つ例えば
は
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);
});