在行为回调中包装异步 moxios 调用
我正在尝试使用钩子测试反应功能组件.useEffect 钩子调用第三方 API，然后在返回时调用 setState. 我进行了测试，但不断收到警告，指出组件的更新未包含在行为中. 我遇到的问题是期望在 moxios.wait 承诺中，因此我无法将其包装在行为函数中，然后对其结果进行断言. 测试通过了，但我知道如果不包装在行为函数中更新状态的代码可能会导致误报或未发现的错误.我只是
..
react-testing-library相关内容
如果输入只接受数字，则反应测试
我正在使用 React 测试库来创建我的测试. import React, {useState} from 'react';const 输入 = () =>{const [state, setState] = useState(0);const onChange = (e) =>{setState(e.target.value)};返回 (
{state}
..
单元测试 React 单击外部组件使用 Jest 和 React 测试库
我在这里找到了这个实现，但它使用了酶. 单元测试 React 点击组件外 向窗口添加事件也不起作用: window.addEventListener('click', () => {console.log('点击窗口');}); 有没有人在上面使用 jest 和“@testing-library/react"遇到过这个问题? 解决方案 正如@Giorgio 提到的: fi
..
React 测试库 - TypeError 修剪不是使用渲染时的功能
我正在使用 Jest + React 测试库创建一个简单的测试.但是，当我尝试渲染它时，它会在代码中崩溃.这很奇怪，因为应用程序运行流畅.似乎道具未定义或为空. 测试文件: test('renders learn react link', () => {const { 容器 } = 渲染();}); 应用: 从'react'导入React；从'./logo.svg'导入标志
..
React 测试库 - 在 fireEvent 之后使用“await wait()"
我正在尝试使用测试库在 fireEvent.click 之后检查 DOM 元素.我知道我需要在 fireEvent 之后等待，但不知道为什么简单地使用 await 不起作用?下面是用两种方式编写的相同测试——第一个失败，第二个通过.我不明白为什么第一个失败......非常感谢您的任何见解！ 附言-- 我知道 wait 已被弃用，waitFor 是首选，但是由于某些限制，我目前无法更新版本:(
..
如何使用 jest 和 react-testing-library 测试上下文提供的函数?
我有一个 组件，它提供上下文，它的值中有一个 login 方法.在我的测试中，我想检查该方法是否已被调用.如果来自上下文，我如何检查以确保在我的测试中调用此方法?我试过使用 spyOn 和 mock 方法，但我无法让它们工作. 这是我的 UserProvider 组件，它提供上下文. import React, { useState, useContext,
..
react-test-renderer 的 create() 与 @testing-library/react 的 render()
我是 React 的新手，对所有测试库都感到困惑.我让我的测试代码可以工作，但是为了使用它的 toMatchSnapshot() 并且不得不从 react-test-renderer 调用 create() 并且必须调用它似乎是多余的render() 来自 @testing-library/react 以便使用其断言，例如 getByLabelText(). import {render} fr
..
将 react-testing-library 与 storyshots 一起使用?
是否可以将 react-testing-library 与 storybook storyshots 插件一起使用?我想为不使用酶的反应组件生成一些测试. 解决方案 对你来说可能有点晚了，但只是一直在研究这个确切的问题.这是我想出的配置，似乎对我有用. 从“@storybook/addon-storyshots"导入initStoryshots；从“路径"导入路径；从“react-tes
..
如何使用 testing-library 测试 ag-grid 中的内容?
我正在尝试编写一些简单的测试，让我想要呈现的标题和数据按预期显示.我创建了一个 repo - https://github.com/olore/ag-grid-testing-library 来重现.在浏览器中打开表格时，该表格看起来与我预期的一样. 和测试 test('渲染所有标题', async() => {const { getByText } = render(
..
React 测试库:当输入表单上的 fireEvent 更改时，给定的元素没有值设置器
我想改变material UI的值TextField在反应测试库中.我已经设置了数据测试ID.然后使用 getByTestId 我拿起输入元素. //组件
..
如何使用 <Router> 测试组件标签里面呢?
关于: 嘿，目前我正在尝试使用 jest 和 react 测试库为我的 react 组件编写测试.我也使用反应路由器. 问题: 我想在路径改变时检查应用程序是否路由到正确的组件，而不与单个组件交互. 例如，如果当前路径名是“/impressum"，我只想从 Impressum 页面获取快照. 我不知道如何将路径传递给 以便只显示一个 Route. 我要测试的组件
..
为什么在测试期间 useParams 在带有包装器的测试环境中返回未定义?
我现在已经在 2 个不同的代码库中看到了这一点，但我很难过，因为它在实际浏览器中运行良好，但在测试中却没有:如果组件使用 useParams 钩子，则钩子会在测试: 错误:未捕获 [TypeError:无法解构 'undefined' 或 'null' 的属性 accountId.] 我正在使用 React 功能组件、React 测试库和 React-Router: //组件:
..
React-Testing-Library - 用 Redux 和路由器包装组件
我正在尝试设置一个测试文件以在我的应用程序上呈现路由/页面.我正在尝试用 Redux 和 Router 包装所有东西，这就是我所拥有的: 从'react'导入React；从'react-testing-library'导入{渲染}；从'redux'导入{createStore}；从'react-redux'导入{提供者}；从'../../store/reducer'导入reducer；从“rea
..
使用 react-testing-library 时如何测试组件是否使用正确的道具呈现?
我有一些组件正在渲染另一个已经单独测试过的组件 (FetchNextPageButton)，例如: const News = () =>(
新闻
...)const 乔布斯 = () =>(
工作
...
..
React 测试库:测试元素是否已被映射/渲染
问题: 我有一个项目列表，我想通过每个项目 name 值(字符串)来测试.我正在使用 @testing-library/react 并让测试套件正常工作，但我无法让我的测试工作. 概述: 每个item 都有一个data-testid="side-menu-link" 的测试ID.这必须是唯一的还是可以按原样进行测试? 菜单项由Dashboard、Settings 和User P
..
使用@testing-library/react 对 react-router 的链接进行最简单的测试
我正在尝试了解如何最好地测试 react-router 的行为是否符合 @testing-library/react 的预期. 我能想到的最简单的测试是验证单击链接是否会更改 URL.我知道理想情况下我应该测试点击链接会呈现一个新组件，但这会为测试增加很多样板. 这是我失败的例子: import { MemoryRouter } from 'react-router-dom';从'@
..
无法摆脱警告:在测试 RTL 期间对卸载的组件进行反应状态更新
我正在编写集成测试.此文件呈现 、填充输入并在每次测试之前提交搜索.测试全部通过.但是，我无法摆脱: 警告:无法对卸载的组件执行 React 状态更新.这是一个空操作，但它表明您的应用程序中存在内存泄漏. 我在应用程序中没有收到此警告，只有测试.我已经阅读了数十篇帖子，但没有一个解决方案(act()、wait()、waitFor() 等...) 有所作为. 这是测试代码，我保留了导致警告
..
测试自定义钩子的返回值
我正在尝试为此自定义挂钩编写测试套件. export const useInitialMount = () =>{const isFirstRender = useRef(true);//在第一次渲染中，ref 为真，但我们立即将其更改为假.//所以每个渲染之后都会是假的.如果(isFirstRender.current){isFirstRender.current = false;返回真；}返
..
使用 react-testing-library 测试 useEffect 内部的 api 调用
我想测试 api 调用和返回的数据，这些数据应该显示在我的功能组件中.我创建了执行 api 调用的 List 组件.我希望返回的数据显示在组件中，为此我使用了 useState 钩子.组件如下所示: const 列表:FC= () =>{const [data, setData] = useState();const getData = (): Promise=>{return fetch('h
..
如何使用React测试库测试材料UI自动完成
我正在使用material-ui 自动填充组件，并尝试使用react-测试库 组件: /*禁止在定义前禁止使用*/从'@ material-ui/core/TextField'导入TextField;从'@ material-ui/lab/Autocomplete'导入自动完成；从'react'导入React；导出默认函数ComboBox(){const [autocompleteInpu
..