Testing components with react-test-library
It would be great to have some documentation on using Amplify with react-testing-library (RTL). RTL has 13k+ stars on github and is now the recommended library to use when testing react components.
As a start i think it would be good to have some examples on testing Amplify UI components and components that use an Amplify API. Where we can mock the API service with JEST, so we can test them.
Maybe it could be a stage of the React - Getting started guide? Which has an API as well as Amplify UI components
There is documentation on Mocking Amplify services using amplify mock and how to set up end-to-end tests but i think that leaves a gap of how to perform fast unit tests which can be run in a CI environment.
Would love to hear further thoughts and recommendations.
This is a great proposal. I think it would make sense for us to have a "Testing" section in the guides to show how to do this as well as maybe go into Cypress and other testing with the Amplify Console.
It would be great to have any kind of documentation, we want to use amplify but without being able to test the gql queries it seems like we won't be able to use amplify
I've been working on a potential framework and best practices to test Amplify Gen2 using RTL and vitest. I'm almost done and would be more than happy to share my progress with others, but I have gotten stuck at how to test mobile breakpoints.
It's easy enough to mock the useBreakpointValue hook, but this is not what amplify uses behind the scenes when determining what breakpoint to use in a style property, so at the moment I'm stuck. Changing window sizes within a test doesn't seem to affect it either, either before or after rendering.
If anyone here can explain how amplify-ui and the theming module determines the activeBreakpoint, I'm more than happy to share my framework with others once I've implemented it.