I just started a new React/Next.js project and realized that I cannot mock memoized React components the way I could in a previous project. And I fail to find out why. Here's a minimal example of my setup: // /src/components/Foo.tsx…
I have a function that takes a props value in a component and flattens it into a form the component can use. This needs to happen every time the props value changes. I put the setState in a useEffect with…
Error message: The package at "node_modulesconsole-testing-librarydistpure.js" attempted to import the Node standard library module "console". It failed because the native React runtime does not include the Node standard library. I have a basic React-Native app using Expo and React. I…
I've gone through the official Jest docs around manual mocking but I can't quite make sense of it. I have a file that exports an object of computed values utils.js export const getCalculatedValues = (stuff) => ({ val1: 'val1', val2:…
As I am relatively new to unit testing, my primary objective is to employ function mocking, specifically for the add() function. But I have encountered difficulties in achieving this goal. // math.js export const add = (a, b) => {…
I've successfully tested one isolated server component by using an async it and awaiting the output of a call to the component as a plain function to pass into render: it('renders the user data when user is authenticated', async ()…
Apology for the winding question title which might not make sense at first sight. Let me explain. I have a library package named foo-bar-ui for some shared UI components. All the components are exported from a single index file. //…
what is the difference if a normal method or async method is called on an object ? (1) myObject.handleUpdate() // conventional method (2) myObject.handleUpdate() // handleUpdate is declared async I know that async methods return always promise. But apart from…
I have a component that looks like this: const isPersonalSite: boolean = process.env.PERSONAL_SITE === 'true'; const isFeatureEnabled: boolean = process.env.IS_FEATURE_ENABLED === 'true'; export const ProfileMenu = () => { console.log('PERSONAL_SITE component', process.env.PERSONAL_SITE) return ( <> {!isPersonalSite && isFeatureEnabled && <a…
My jest config clearMocks: true, rootDir: '../../', cacheDirectory: 'cache', testEnvironment: 'jsdom', modulePaths: [ '<rootDir>' ], setupFilesAfterEnv: [ '<rootDir>/config/jest/setup.ts' ], moduleDirectories: [ 'node_modules', 'src' ], moduleNameMapper: { '\.(jpg|jpeg|png|gif|svg)$': '<rootDir>/config/jest/mocks/file.js', '\.s?css$': 'identity-obj-proxy' }, moduleFileExtensions: [ 'js', 'mjs', 'cjs', 'jsx', 'ts', 'tsx', 'json',…