react-testing-library

问题 When running a test using jest I have the basic test suit syntax: jest.mock('axios'); describe('app', () => { let render beforeEach(() => { axiosMock.get.mockResolvedValueOnce({ data: {greeting: 'hello there'}, }), render= renderApp() }); test('should render something', () => { expect(something).toBeInTheDocument(); }); }); The problem is I have interceptors in my code which when running the test with jest command outputs: TypeError: Cannot read property 'interceptors' of undefined and points

问题 I have a situation where I am facing an issue regarding unit testing of a function. There is a function SOP3loginConfig which returns an object, within that object we have a function isSOP3 that returns a boolean, I want to test this function and cover the test part of it. The actual implementation of the function sop3login.ts export const SOP3loginConfig = (props: IVariables) => { const { i18n } = props; return { buttonLabel: props.user != null ? i18n('StartJourney') : i18n('logIn'),

问题 All most all the articles and examples about setting focus are explained using input element. It works well with input element but how to set focus to a div element using React useRef and useEffect hooks? How to test it using toHaveFocus of react-testing-library ? 回答1: After searching for a while and wasting quite a bit of time, I was able to do it. Sharing it here for friends!! Component file SetFocusToDivComponent.js import React, { useRef, useEffect } from 'react'; export default function

问题 I want to test my Expo React Native app with Jest and @testing-lib/react-native . I have the following set up in my package.json . "jest": { "preset": "jest-expo", "moduleDirectories": [ "node_modules", "test-utils" ] }, And my folder structure looks like this: ├──node_modules/ ├──test-utils/ ├──src/ └──package.json src/ contains the test files. I'm testing my configuration with this simple test at src/index.test.js : import { assert } from 'test-utils'; const sum = (a, b) => a + b; describe(

问题 I want to test my Expo React Native app with Jest and @testing-lib/react-native . I have the following set up in my package.json . "jest": { "preset": "jest-expo", "moduleDirectories": [ "node_modules", "test-utils" ] }, And my folder structure looks like this: ├──node_modules/ ├──test-utils/ ├──src/ └──package.json src/ contains the test files. I'm testing my configuration with this simple test at src/index.test.js : import { assert } from 'test-utils'; const sum = (a, b) => a + b; describe(

问题 I want to change the value of material UI TextField in react testing library. I already set up the data-testid. Then using getByTestId i picked up the input element. // the component <TextField data-testid="input-email" variant="outlined" margin="normal" required fullWidth id="email" label="Email Address" name="email" value={email} onChange={e => setEmail(e.target.value)} autoComplete="email" autoFocus /> // the test //... let userInput = getByTestId('input-email') fireEvent.change(userInput,

问题 I want to change the value of material UI TextField in react testing library. I already set up the data-testid. Then using getByTestId i picked up the input element. // the component <TextField data-testid="input-email" variant="outlined" margin="normal" required fullWidth id="email" label="Email Address" name="email" value={email} onChange={e => setEmail(e.target.value)} autoComplete="email" autoFocus /> // the test //... let userInput = getByTestId('input-email') fireEvent.change(userInput,

问题 I am wanting to write a test for the code below which basically renders all the blog posts such that the latest post is on the top. I am new to React test Library and every time I add my components in the React testing Library I get the following error : No overload matches this call. Overload 1 of 2, '(props: Readonly): PostList', gave the following error. Property 'posts' is missing in type '{}' but required in type 'Readonly'. Overload 2 of 2, '(props: State, context?: any): PostList',

问题 I keep getting Warning: An update to App inside a test was not wrapped in act(...). in my test suite whenever I make an API request and update the state. I'm making use of react-testing-library. I also tried using ReactDOM test utils, got the same result. One other thing I tried was wrapping the container in act , still got the same result. Please note that: My App works and my test passes. I just need to know what I was doing wrong or if it's a bug in the react-dom package that's making that

问题 I am trying to test a react functional component using hooks. The useEffect hook makes a call to a third part API which then calls setState on return. I have the test working but keep getting a warning that an update to the component was not wrapped in act. The problem I have is that the expectation is inside a moxios.wait promise and therefore I cannot wrap that in an act function and then assert on the result of that. The test passes but I know not wrapping code that updates state in an act