Skip to content

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add option to disable delay globally, to ensure consistency in performance of tests in jest #934

Closed
ahayes91 opened this issue Oct 6, 2021 · 1 comment
Labels

Comments

@ahayes91
Copy link

ahayes91 commented Oct 6, 2021

Is your feature request related to a problem? Please describe.

I am finding that the performance of tests written with Mock Service Worker and @testing-library/react is not always consistent when running large numbers of tests (e.g. running jest locally or in a CI environment across a monorepo).

I have found that some tests will time out before the app has fully loaded (e.g. a waitFor query after render times out and shows a loading state still present in the DOM).

Even avoiding "heavy" queries in our tests (like replacing byRole with byTestId as per testing-library/dom-testing-library#698) show this initial loading error sometimes.

Setting up MSW in setupFilesAfterEnv has improved this performance somewhat (as per https://github.com/mswjs/examples/blob/master/examples/with-jest/jest.config.js), but I'd like to be able to further future-proof the test performance and consistency by removing the "random realistic server response time" delay MSW provides on handlers. https://mswjs.io/docs/api/context/delay

Describe the solution you'd like

A global configuration setting, or a setting that we can pass to setupServer, that allows you to disable the delay/set a default of 0 unless it has been overridden.

Describe alternatives you've considered

We could set ctx.delay(0) on every handler, but it's a lot of boilerplate as our code grows.

Additional context
Some other folks mention performance with @testing-library/react and mock service worker here testing-library/react-testing-library#819 and here testing-library/dom-testing-library#820

@kettanaito
Copy link
Member

kettanaito commented Oct 6, 2021

Hey, @ahayes91. Thank you for reaching out.

First, let me clarify that there is no response delay in MSW by default. You control the time of mocked response delay explicitly using the ctx.delay() utility, as you've pointed out. This means that unless you are using ctx.delay() in your tests, there's no response delay from the library that may affect response resolution time.

I'd like to be able to further future-proof the test performance and consistency by removing the "random realistic server response time" delay MSW provides on handlers

Please note that this statement applies only when using ctx.delay() without any arguments. This still means you've made a conscious decision to use ctx.delay(), there is no implicit response delay in play.

However, in the cases when you do use an explicit delay, it will remain the same anywhere your handler is used, including integration tests. This may be undesirable, and I generally recommend not using response delay in tests (there is no practical reason for that unless testing specific delay-dependent scenarios).

There are numerous ways you can ensure there's no explicit delay during your test runs.

Option 1: Abstract the delay value

const IS_NODE_PROCESS = determineInAnyWayYouSeeFit()

function ms(duration) {
  return IS_NODE_PROCESS ? 0 : duration
}

rest.get('/user', (req, res, ctx) => {
  // Use the response delay during development
  // but not during testing.
  return res(ctx.delay(ms(250))
})

Option 2: Write a custom delay response transformer

import { compose, context } from 'msw'

export function delay(duration) {
  // Ensure there is no response delay in tests.
  if (IS_NODE_PROCESS) {
    return compose()
  }

  return compose(context.delay(duration))
}
import { delay } from './delay'

rest.get('/user', (req, res, ctx) => {
  return res(delay(250))
})

Learn more about Custom response transformers.

@mswjs mswjs locked and limited conversation to collaborators Oct 6, 2021

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

Labels
Projects
None yet
Development

No branches or pull requests

2 participants