When you import image files, Jest tries to interpret the binary codes of the images as .js, hence runs into errors. The only way out is to mock a default response anytime jest sees an image import! How do we do this? first you tell Jest to run the mock file each time an image … Read more
In general, using hooks shouldn’t change testing strategy much. The bigger issue here actually isn’t the hook, but the use of context, which complicates things a bit. There’s a number of ways to make this work, but only approach I’ve found that works with ‘react-test-renderer/shallow’ is to inject a mock hook: import ShallowRenderer from ‘react-test-renderer/shallow’; … Read more
This does not work on windows prior to node 16.2.0 (and prior to 17.0.1 in node 17) – see https://github.com/nodejs/node/issues/4230 The problem with process.env.TZ = ‘UTC’; is, that if something runs before this line and uses Date, the value will be cached in Date. Therefore process.env is in general not suitable for setting the timezone. … Read more
Updated answer: Please refer to @mikaelrs comment below. No need for the waitFor or waitForElement. You can just use findBy* selectors which return a promise that can be awaited. e.g await findByTestId(‘list’); Deprecated answer: Use waitForElement is a correct way, from the docs: Wait until the mocked get request promise resolves and the component calls … Read more
You can mock the module so it returns spies and import it into your test: import {navigationEnabled, guidanceEnabled} from ‘../../../magic/index’ jest.mock(‘../../../magic/index’, () => ({ navigationEnabled: jest.fn(), guidanceEnabled: jest.fn() })); Then later on you can change the actual implementation using mockImplementation navigationEnabled.mockImplementation(()=> true) //or navigationEnabled.mockReturnValueOnce(true); and in the next test navigationEnabled.mockImplementation(()=> false) //or navigationEnabled.mockReturnValueOnce(false);
This can be done with asymmetric matchers (introduced in Jest 18) expect(track).toHaveBeenCalledWith( expect.objectContaining({ “action”: “PublicationPage”, “category”: “PublicationPage”, “label”: “7”, “name”: “n/a” }) ) If you use jest-extended you can do something like expect(track).toHaveBeenCalledWith( expect.objectContaining({ “action”: “PublicationPage”, “category”: “PublicationPage”, “label”: “7”, “name”: “n/a”, “intervalInMilliseconds”: expect.toBeWithin(999, 1002) }) )
The Jest documentation now has an “official” workaround: Object.defineProperty(window, ‘matchMedia’, { writable: true, value: jest.fn().mockImplementation(query => ({ matches: false, media: query, onchange: null, addListener: jest.fn(), // Deprecated removeListener: jest.fn(), // Deprecated addEventListener: jest.fn(), removeEventListener: jest.fn(), dispatchEvent: jest.fn(), })), }); Mocking methods which are not implemented in JSDOM
You could write a more thorough manual mock for dayjs, one that has the extend method, but then you’re coupling your tests to a 3rd party interface. “Don’t mock what you don’t own” – you’ll end up having to recreate more and more of the dayjs interface in your mock, and then if that interface … Read more
With Jest 24.3.0 or higher, you can do this in pure TypeScript by adding the following to a Jest setup file configured in setupFilesAfterEnv: import { CustomConsole, LogType, LogMessage } from ‘@jest/console’; function simpleFormatter(type: LogType, message: LogMessage): string { const TITLE_INDENT = ‘ ‘; const CONSOLE_INDENT = TITLE_INDENT + ‘ ‘; return message .split(/\n/) .map(line … Read more
OK I got it. Here is how I fixed it! I ended up doing without any mocking libraries for axios! Create a mock for axios in src/__mocks__: // src/__mocks__/axios.ts const mockAxios = jest.genMockFromModule(‘axios’) // this is the key to fix the axios.create() undefined error! mockAxios.create = jest.fn(() => mockAxios) export default mockAxios Then in your … Read more