Enzyme (React Component Unit-Testing)#344
Enzyme (React Component Unit-Testing)#344jrodl3r wants to merge 23 commits intoreactGo:masterfrom jrodl3r:enzyme-testing
Conversation
| describe('<MainSection />', () => { | ||
| describe('With Topics', () => { | ||
| it('should render <TopicItem> list items', () => { | ||
| expect(mount(<MainSection topics={topicItemData} {...stubFunctions} />).find('.list li').length).toBe(1); |
There was a problem hiding this comment.
Minor comment: should this be find(TopicItem) given that we are asserting that MainSection contains TopicItem?
expect(wrapper.find(Foo)).to.have.length(3);Finding .list li works, but that ties this test to the specific implementation of TopicItem, i.e. if at some point in the future, we change TopicItem to be <div>, this test will break even though it shouldn't. :)
(Sorry if I'm being really critical with this test, but given that this is the first of the enzyme tests, I'm really trying my best to ensure it will be awesome for everyone!)
There was a problem hiding this comment.
yes, Enzyme has very flexible/expressive selectors. Do you have any suggestions for the choice to go with here? Also, is there any documentation that you would like me to add/update? Thx 👍
There was a problem hiding this comment.
I'd still go with find , the way you did it, following this doc here in enzyme.
so instead of using .list li
I would
expect(mount(<MainSection topics={topicItemData} {...stubFunctions} />).find(TopicItem).length).toBe(1);is there any documentation that you would like me to add/update?
So far we don't have any docs for testing yet, but I think we should outline good testing practices here as a doc after this gets merged in.
Thanks!
|
@jrodl3r Excellent changes - and thanks for pushing this through! |
|
Moved to #384 |
5 participants
Re: #261