Subject Under Test
A generic hook wrapping useMutation
of React-Query
for all of my master-detail edit forms. It is an adaptor responsible for generating URL by entity name, error handling and invalidating relevant queries.
Behaviours
it takes an
entityName
and generates the correct URL to send a post request toit forwards models and request configurations to the HTTP request
it wires up
ErrorHandler
for error handlingit invalidates queries with keys containing the
entityName
MSW and @mockapi/msw
The tests use MSW and @mockapi/msw to mock a post
endpoint for a dummy entity Supplier
. @mockapi/msw provides a standard set of CRUD endpoints so that I do not have to write any endpoints for this test suite. For more information: @mockapi/msw
Code
Notes
TestComponent
shows how the SUT is to be used. It also has auseGetItems
hook to test if the queries are invalidated properly. The code and tests foruseGetItems
are here, it also introduced the use ofuseTranslationForTest
andQueryClientProviderForTest
the tests use
findByText
as a way to wait for the SUT to finish its operationsserver.use
from MSW is used to override the target endpoint to test theparams
and error responses.With the help of MSW, the tests only care about the data flows. I love the setup because it doesn't care about how the HTTP requests are made. I could have replaced React Query and Axios without touching the tests.
Top comments (0)