`server.use()` or `server.resetHandlers` do not appear to be working within/between tests

See original GitHub issue

Describe the bug

server.use() or server.resetHandlers do not appear to be working within tests.

I have a setupTests file that is appropriately calling resetHandlers (confirmed with logging) after each test.

When using a server.use statement to override a route payload like so:

server.use(
      rest.get('myUrl', (req, res, ctx) => {
        return res(ctx.json([]));
      })
    );

I would expect the result to return as an empty array. My main handlers file is setup similarly:

rest.get('myUrl', (req, res, ctx) => {
    return res(ctx.json(mockDataArray));
  })

When running all my tests, I see my mock data, and can log it to the console in the actual component implementation.

When running as part of a test suite, I do not get the overridden empty array that I want, I see the original list from the handlers.

The bug I think I’ve found is that if I run the test as it.only then I see the correct empty array and my test passes. My component logs out the empty array as the fetched data I was expecting. Running the tests completely by itself seems to fix the issue.

I’m hoping this is just a silly mistake on my part.

Environment

  • msw: 0.19.5
  • nodejs: 12.16.1
  • npm: 6.13.4

Please also provide your browser version. n/a

To Reproduce

Steps to reproduce the behavior: I attempted to reproduce this behavior using the react example project, but haven’t been able to yet.

Expected behavior

I have a setupTests file that is appropriately calling resetHandlers (confirmed with logging) after each test. When using server.use to setup a route override, I should get the payload assigned (as one would expect from the docs as well as the example project.

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:2
  • Comments:27 (9 by maintainers)

github_iconTop GitHub Comments

18reactions
philalscommented, Nov 2, 2020

For anyone coming to this who is using react-query. You will need to add

import { queryCache } from "react-query"; 

beforeEach(() => {
  // Resets React Query cache
  queryCache.clear();
});
13reactions
marcosvega91commented, Jun 26, 2020

I have tried as above and it works. Let me know if I’m wrong

afterEach(() => {
  client.resetStore()
  // Reset any runtime handlers tests may use.
  server.resetHandlers()
  console.log('server.resetHandlers')
})
Read more comments on GitHub >

github_iconTop Results From Across the Web

resetHandlers() - Api - Mock Service Worker Docs
resetHandlers() function is useful as a clean up mechanism between multiple test suites that leverage runtime request handlers.
Read more >
React Jest MSW server not running/working - Stack Overflow
Hello guys i have been stuck with this task for very long time and yet couldn't figure out after checking the docs and...
Read more >
Configuring Mock Service Worker (MSW) - Daniel Afonso blog
On the test above, by using the server.use() and passing it a new request handler and a response resolver, we are telling MSW...
Read more >
Testing React Components with Testing Library and Mock ...
We can also see that it's possible to have different responses from the server by using the server.use() function and passing a new...
Read more >
Mock Service Worker - msw - npm
There are 166 other projects in the npm registry using msw. ... application's code and tests unaware of whether something is mocked or...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found