search

testing-library / native-testing-library

🐳 Simple and complete React Native testing utilities that encourage good testing practices.
https://native-testing-library.com
MIT License
515 stars 44 forks source link

Testing native rendering #100

Closed lucido-apps closed 4 years ago

lucido-apps commented 4 years ago

Dear testing-library team,

When I test using this library, does the rendered output mimic actual native rendering? how can I find more information on how the rendering is done? It might be a good idea to provide a bit of information on this on the README.md of this repo.

Also (this is a bit out of the scope of questions here, but thought I should add it for some context), I would like to use this library along with react-testing-library to test for platform and rendering differences with web and native for a universal application. Does this make sense? or should I use something like Detox and Puppeteer for this?

Thank you very much! Santiago

bcarroll22 commented 4 years ago

Hello @lucido-apps, thanks for using Testing Library!

Since this isn't an issue, I'm going to go ahead and close it with this response, but hopefully this answer helps 👍

Just like the web version, React Testing Library, we only show the output of "host nodes". In the browser, those are things like div, span, p, etc. In React Native, those are things like View, Text, ScrollView, etc. So you won't see your custom components (something like <HomePage /> in the output. At a high level, it's safe to think of it as if what you're seeing when you debug() is what is being "rendered" natively. At a more in-depth level, unfortunately not really. A good explanation is too verbose to write out, but I'd encourage you to dig through the source code of React Native if you want to know how it does what it does on each platform. It's quite complex and fully replicating it is outside of the scope of this library.

For your second question, if you want to literally "see" difference, you'd want to use detox, cypress, nightwatch, puppeteer, tools like that. If you just want to know users can take the same actions on each platform, you should be able to accomplish what you're looking for. There aren't any resources for it, and I don't know of anyone currently doing it (although I'm sure it's possible), so I'd recommend documenting it and publishing it if you end up doing it! 😄

Hope that helps, and good luck!

lucido-apps commented 4 years ago

Thank you very much @bcarroll22! your response was exactly what I was looking for! There is not much information out there on these topics so i really appreciate you taking the time to respond here! I might be good to go with this library, but might also go for option 2 (detox, puppeteer, etc.) for very simple cases, and documenting as I go along, cheers! 🥳