Storybook react-query msw mock PUT #2022
Unanswered
dstone1983
asked this question in
Q&A
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
I am using Storybook MSW Addon. Get calls are working as expected. I am trying to mock a PUT for my component in the story, but the mutation status and the onSuccess properties are not changing for me to alter the UI based on that response.
Here is my mock call:
http.put('myUrl, async ({request}) => { await delay('real') return await HttpResponse.json({myJson}) })
Not only that, this put request has a body I am passing and it does not allow me to grab that body to dynamically return the necessary response.
My mutation looks like this:
useMutation({ mutationFn: (isEnabled: boolean) => { //the new instanciates an API factory with all my api's return Api(isEnabled) } })
Api Function:
`
mfaEnablement = async (isEnabled: boolean): Promise => {
const {userId, tenantId} = getSystemRequestDetails();
`
I keep getting this status which never changes after I make the request:
MUTATION STATUS idle
Use inside my component:
mutation.mutate(false, { onSuccess: () => { console.log('success') }, onError: () => { console.log('error') } });
I have verified that it DOES call the mutationFN and chains into the api fine. I have validated that the mock successfully intercepts. The problem I am having is that react-query status's aren't changing like they do for GET calls. So using values like isLoading to test dynamic loading of components is not working.
I am essentially making an NPM package of common api driven features that are used across multiple applications. So I don't want to make these UI screen's multiple times and repeat the code. These applications are not part of a single repo or mono repo so an NPM package with a testable storybook is necessary.
Beta Was this translation helpful? Give feedback.
All reactions