react-testing-library

问题 Going through using react testing library with reach-router https://testing-library.com/docs/example-reach-router function renderWithRouter( ui, { route = '/', history = createHistory(createMemorySource(route)) } = {} ) Second argument to the function , suspect is an object, {} . But '=' is used instead of ':' means its not a name-value pair. So what is it? Also, what is the purpose of the assignment operator between two objects { route = '/', history = createHistory(createMemorySource(route)

问题 Going through using react testing library with reach-router https://testing-library.com/docs/example-reach-router function renderWithRouter( ui, { route = '/', history = createHistory(createMemorySource(route)) } = {} ) Second argument to the function , suspect is an object, {} . But '=' is used instead of ':' means its not a name-value pair. So what is it? Also, what is the purpose of the assignment operator between two objects { route = '/', history = createHistory(createMemorySource(route)

问题 I have a component that looks like this: import React, { Component } from 'react'; import connect from 'react-redux/es/connect/connect'; import { FormattedNumber } from 'react-intl'; class Currency extends Component { render() { const { setting, amount } = this.props; const { employee } = setting; const { currency = 'USD', currency_symbol } = employee.settings; /*eslint-disable react/style-prop-object*/ const applicable_symbol = currency_symbol || currency; return ( <FormattedNumber value=

问题 I am creating a simple test with Jest + React Testing Library. However, when I try to render my it crashes in de code. This is strange because the application does run smoothly. It seems like the props are undefined or empty. Test file: test('renders learn react link', () => { const { container } = render(<App />); }); App: import React from 'react'; import logo from './logo.svg'; import './App.css'; import { Child} from './Child'; function App() { return ( <div className="App"> <header

问题 I have seen this in 2 different code bases now and am stumped because it works fine in the actual browser but not the tests: if a component uses the useParams hook, the hook throws an error in the test: Error: Uncaught [TypeError: Cannot destructure property accountId of 'undefined' or 'null'.] I am using React Functional Component, React Testing Library and React-Router: // component: const Overview: FC = () => { const location = useLocation(); console.log(location) // see below const {

问题 I'm using create-react-app, Jest and react-testing-library for the configuration of the chatbot project. I have a functional component that uses useRef hook. When a new message comes useEffect hook is triggered and cause scrolling event by looking a ref's current property. const ChatBot = () => { const chatBotMessagesRef = useRef(null) const chatBotContext = useContext(ChatBotContext) const { chat, typing } = chatBotContext useEffect(() => { if (typeof chatMessagesRef.current.scrollTo !==

问题 I'm trying to test my antd application with react testing library , but I keep getting this error: TypeError: Cannot read property 'addListener' of undefined Im using a custom render but the error seems to be coming from the 'render' method. const customRender = (ui, options) => render(ui, { wrapper: TestingWrapper, ...options }) ^ I´m even using the same versions of react and react-dom (which seems to be a common issue with rtl). "react": "17.0.1", "react-dom": "17.0.1", The problematic

问题 I'm trying to test my antd application with react testing library , but I keep getting this error: TypeError: Cannot read property 'addListener' of undefined Im using a custom render but the error seems to be coming from the 'render' method. const customRender = (ui, options) => render(ui, { wrapper: TestingWrapper, ...options }) ^ I´m even using the same versions of react and react-dom (which seems to be a common issue with rtl). "react": "17.0.1", "react-dom": "17.0.1", The problematic

问题 I'm trying to test my antd application with react testing library , but I keep getting this error: TypeError: Cannot read property 'addListener' of undefined Im using a custom render but the error seems to be coming from the 'render' method. const customRender = (ui, options) => render(ui, { wrapper: TestingWrapper, ...options }) ^ I´m even using the same versions of react and react-dom (which seems to be a common issue with rtl). "react": "17.0.1", "react-dom": "17.0.1", The problematic

问题 I'm using react-testing-library within a project of mine and am trying to write tests that validate in-app routing. e.g. testing that a button on the AccessDenied page brings you back to the Home page. I've been able to write these sorts of tests successfully for my App component because it defines all of the app routes. But if AccessDenied is one of those routes , how do I need to set up my tests to validate a button clicked there will route my back to Home? Here is a contrived example: App