我已经建立了一个 github 项目，以了解如何更好地测试 react (v 16.8.0)useEffect钩子。我进行 api 调用以获取useEffect中的数据，并将接收到的数据设置为状态组件元素。我的组件将查询作为 prop 接收，如果查询 prop 字符串不为空，则进行 api 调用。我想测试一下，使用非空查询 prop，api 调用是否已完成，组件是否正确设置了其状态。我知道测试us
2019-06-01
我的功能组件使用useEffect钩子从挂载时的 API 获取数据。我希望能够测试获取的数据是否正确显示。虽然这在浏览器中运行良好，但测试失败，因为钩子是异步的，组件无法及时更新。实时代码：https://codesandbox.io/s/peaceful-knuth-q24ih?fontsize=14App.jsimport React from "react";function getData
2019-07-12
我试图断言我的自定义钩子在挂载时会从 API 返回一些数据。代码如下所示：import * as React from 'react';import { findByStatus } from '../../services/AssignmentService';import Assignment from '../../models/Assignment';import AssignmentLi
2019-08-19
我有一个简单的组件，它可以获取帖子的异步列表。export const Posts = () => {const [list, dispatch] = useReducer(listReducer, []);useEffect(() => {fetchList(dispatch);}, []);return (<ul>{list.map((el) => (<li key={el.id}>{el.t
我有一个使用useEffect钩子进行数据提取和设置加载、成功和失败状态的反应组件。import React, { useState, useEffect } from "react";import { fetchData } from "./api";function App({ id }) {const [data, setData] = useState(null);const [isFet
2020-01-03
如何使用react-testing-libs测试异步useEffect？我有：// in other fileconst getData = () => {return new Promsise(resolve => setTimeout(() => resolve([1, 2, 3]), 5000));};const MyComponent = () => {const [data, setDa
2021-01-08
我对 react-testing-library 和一般测试还不太熟悉。我想测试一个组件，该组件从 useEffect 钩子中的 API 中获取数据。然后将其存储在本地状态中。它使用 array.map 呈现这些数组数据，但我收到Error: Uncaught [TypeError: Cannot read properties of undefined (reading 'map')]错误。我可
2021-11-23
如何在 React 中使用 Jest 测试 useEffect Fetch？我尝试寻找答案，并找到了一个我复制来尝试的代码，但仍然无法通过测试。我以前没有使用过 Jest，目前正在尝试在我正在编写的代码中实现它。这是我在 test.js 文件中的测试： it('Displays days from 1 to 31', async () => {expect(useEffectTest).toBe
2021-12-26
我对 JavaScript 测试完全陌生，正在使用新的代码库。我想编写一个测试来检查元素上的 className。我正在使用 Jest 和React Testing Library。下面我有一个测试，它将根据variant属性呈现一个按钮。它还包含一个 className，我想测试它。it('Renders with a className equal to the variant', () =>
2018-11-20
我正在尝试在 nextjs 版本 10.2.3 中测试动态导入，我尝试使用 jest-next-dynamic 库来避免抛出错误TypeError: require.resolveWeak但是当我在 jest 测试用例中调试组件时，我得到以下输出并且无法获取应该加载的真实组件 <ForwardRef(LoadableComponent) .../>我的测试用例it('should render I
2021-10-23
由于使用了一个翻译库调用'react-simple-i18n'，我在模拟我的一个 React 组件时卡住了。在我的 React 组件中，我需要从这个库导入一个函数来使用它，如下所示：import { useI18n } from 'react-simple-i18n/lib/'const MyComponent = ({ data }) => {const { t } = useI18n()ret
我在测试 nextjs 12 中使用动态导入的组件时遇到问题。我展示了一些技术信息：NextJS 12 使用 SWC（不使用 babel）React 18Jest + React 测试库这里是示例：组件：import styles from '@/pages/index.module.css';import dynamic from 'next/dynamic';const Hello = dyn
我已安装 react redux 工具包，并添加了 jest 而不是 vitest 进行测试。我想测试模式窗口是否在 App 组件中呈现（如果 isOpen 标志为 true）。我只模拟了我需要的商店部分。不是整个商店。应用组件function App() {const { isOpen: isPostModalWindowOpen } = useAppSelector(selectPostMod
2023-12-03
我正在尝试使用 react-navigation 为应用程序编写测试，但遇到了路线和参数读取不正确的问题。我在const [leadId] = useState(route.params.leadId);TypeError: Cannot read property 'params' of undefined我的组件看起来像export default function AComponent()
我正在使用 useContext 在 React 应用程序中传递状态，我是测试新手，我正在尝试对名为 timer.js 的 React 组件进行单元测试（Jest/Enzyme）import React, { useEffect, useContext } from 'react';import { GameContext } from './global/contexts';export def