feat(native): Add toContainElement() #146
Conversation
| .toHaveMessage("Expected element <View ... /> to contain element <Text ... />."); | ||
| }); | ||
| }); | ||
| }); |
There was a problem hiding this comment.
Could we please add some tests for when there are no child nor parent elements 🙏
There was a problem hiding this comment.
Thanks for the recommendation! To take this into account, I've changed the structure of the tests so they're clearer and easier to read 🚀
| const isElementContained = ( | ||
| parentElement: ReactTestInstance, | ||
| childElement: ReactTestInstance, | ||
| ): boolean => { | ||
| if (parentElement === null || childElement === null) { | ||
| return false; | ||
| } | ||
|
|
||
| return ( | ||
| parentElement.findAll( | ||
| node => | ||
| node.type === childElement.type && node.props === childElement.props, | ||
| ).length > 0 | ||
| ); | ||
| }; |
There was a problem hiding this comment.
Does this need to be an inner function? We're on the same scope, so we don't even need to pass args to the function. We should be able to rework this so a simple variable easily 🤔
| } | ||
|
|
||
| return ( | ||
| parentElement.findAll( |
There was a problem hiding this comment.
You can use the .some() method instead of finding all elements and then checking if the length is > 0 🙂
| <View testID="grandParentId"> | ||
| <View testID="parentId"> | ||
| <View testID="childId" /> | ||
| </View> | ||
| <Text testID="textId" /> | ||
| </View>, |
There was a problem hiding this comment.
Can we use <Text> elements so that we can avoid the testIDs?
| @@ -271,4 +271,64 @@ describe("[Unit] ElementAssertion.test.ts", () => { | |||
| }); | |||
| }); | |||
| }); | |||
|
|
|||
| describe (".toContainElement", () => { | |||
| const element = render( | |||
There was a problem hiding this comment.
Destructiring helps to make the queries simpler:
| const element = render( | |
| const { getByText, ... } = render( |
| describe (".toContainElement", () => { | ||
| const element = render( |
There was a problem hiding this comment.
As a good practice, elements should be rendered on each test it(..) function, so the cleanup function cleans what's rendered before each test, avoid flaky tests, etc.
kdquistanchala
force-pushed
the
feat/native-to-be-visible
branch
from
35e5052 to
82fa78b
Compare
This PR adds the
toContainElement()matcher for React Native