A utility hook provides an HTTP error handler that sends errors to a message context. A message snack bar component would show errors in toasters for end users.
it takes an optional message to be prepended to error messages returned from the server
it takes an optional translator for localisation
it clears the JWT token if the server returns 401 Unauthorised Error
it sends an error alerting the user to log in to an account with the required permissions if the server returns 403 Unauthorised Error
it sends extract error messages from
it sends "Server connection failed" if no response is received
if the above fails, it logs out error as-is in the console
TestComponentshows a way the error handler hook could be used. It is a component designed to facilitate the tests.
axiosand renders the above component inside a
MessageProviderwhich is not mocked.
userEventis used to trigger the HTTP call, which was mocked to reject with an error object. It has to be wrapped inside an
actblock as it updates the states in the message context.
@testing-libraryis async by design, and we do not have to do anything extra in the tests to wait for async operations.
in the last test, I use
@testing-libraryas there is nothing be found by
findBy. Note: do not forget to await for
waitForas I did.