Skip to content
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

How can I configure react-scripts jest to mock the return of an endpoint? #12730

Open
caio-borghi-yapi opened this issue Sep 14, 2022 · 1 comment

Comments

@caio-borghi-yapi
Copy link

I'm trying to use a custom configuration for jest by running this command

react-scripts test -- --config=jest.config.js

jest.config.js
/* eslint-disable no-undef */
module.exports = {
 setupFilesAfterEnv: ['<rootDir>/jestSetup.js'],
 preset: 'ts-jest',
  testEnvironment: 'node',
  transform: {
    '^.+\\.ts?$': 'ts-jest',
  },
  transformIgnorePatterns: ['<rootDir>/node_modules/'],
}
jestSetup.js

const { server } = require('./src/app/mocks/api/server')
const AbortController = require('abort-controller')
const { fetch, Headers, Request, Response } = require('cross-fetch')

// Establish API mocking before all tests.
beforeAll(() => {
  server.listen()
})

// Reset any request handlers that we may add during the tests,
// so they don't affect other tests.
afterEach(() => server.resetHandlers())

// Clean up after the tests are finished.
afterAll(() => server.close())

global.fetch = fetch
global.Headers = Headers
global.Request = Request
global.Response = Response
global.AbortController = AbortController
@isqua
Copy link

isqua commented Sep 15, 2022

AFAIK, neither react-scripts nor jest do the network request mocks. Have you tried some third-party libraries like nock or msw?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants