如何使用Jest酶测试Material-ui RadioGroup按钮的变化
Jest是一个流行的JavaScript测试框架，而Material-UI是一个React组件库，提供了丰富的UI组件。在使用Jest测试Material-UI的RadioGroup按钮的变化时，可以按照以下步骤进行：
- 安装Jest和相关依赖：
- 安装Jest和相关依赖：
- 创建测试文件：
在与被测试组件相同的目录下创建一个名为
RadioGroup.test.js的文件。 - 导入所需的依赖：
- 导入所需的依赖：
- 编写测试用例：
- 编写测试用例：
- 在上述代码中，我们首先使用
render函数渲染了RadioGroup组件，并通过getByLabelText函数获取了第一个选项的label元素。然后，使用fireEvent.click函数模拟了点击操作，选中了第一个选项。最后，使用expect断言第一个选项被选中。 - 运行测试： 在命令行中执行以下命令运行测试：
- 运行测试： 在命令行中执行以下命令运行测试：
- Jest将会执行测试用例，并输出测试结果。
对于Material-UI RadioGroup按钮的变化的测试，以上是一个简单的示例。根据具体的需求，可以编写更多的测试用例来覆盖不同的场景和交互行为。
关于Jest和Material-UI的更多信息，可以参考以下链接：
- Jest官方文档：https://jestjs.io/
- Material-UI官方文档：https://material-ui.com/
相关·内容
1回答
如何使用Jest酶测试Material-ui RadioGroup按钮的变化
reactjs、testing、jestjs、material-ui、enzyme
如何测试Material-UI值按钮的更改以及设置为本地状态(UseState)值的RadioGroup属性‘RadioGroup’的后续更改 On change事件应该触发我模拟过的handleChangedescribe("test", () => {
const handleChange = jest.f
浏览 28提问于2020-10-18得票数 1
4回答
如何用React测试TextField材料-UI元素？
reactjs、material-ui、jestjs、enzyme
我建立了一个组件的反应和材料-UI。我用的是React和Redux。PropTypes.func.isRequired,};
我用Airbnb酶和Jest来构建单元测试。对InputSearch组件的测试如下所示：import { shallow, mo
浏览 2提问于2017-04-09得票数 14
回答已采纳
2回答
嘲弄React.Suspense的同时让其余的人保持完整的反应
javascript、reactjs、unit-testing、jestjs、enzyme
我试图为使用的组件编写一个单元测试。Suspense fallback={<div>Loading…</div>}> </Suspense>天真地，在我第一次尝试时，我编写了一个使用挂载挂起组件的单元测试：
在web上搜索错误消息时，我发现这很可能是因为<em
浏览 0提问于2019-01-02得票数 0
回答已采纳
1回答
如何用酶为material ui电台编写测试
reactjs、jestjs、material-ui、enzyme
我使用material UI中的RadioGroup，并希望使用jest和酶来编写测试代码。下面是我的代码：这是我的测试，但是我找不到道具来检查收音机是否被点击了？
浏览 21提问于2020-11-16得票数 1
1回答
测试材料用户界面无线电检查值
reactjs、redux、react-redux、material-ui、react-hooks
I有一个用Redux编写的功能组件，使用React。，我正在用Jest和酶一起测试。组件呈现材料UI单选按钮(代码示例) <FormControlLabel label="Batch Name">import React from 'react';
import { Batc
浏览 2提问于2019-12-10得票数 2
1回答
使用jest从要调用的组件测试onClose事件
reactjs、jestjs、enzyme
我正在使用jest和酶对react组件进行测试，还没有想出如何从material-ui菜单中测试onClose事件。这同样适用于其他组件，但为了这个问题，我们可以坚持使用菜单。这是我的组件：
export class ItemPreviewerPage extends React.C
浏览 0提问于2018-10-12得票数 0
1回答
(不含酶)
javascript、reactjs、jestjs
我正在尝试测试React按钮组件的文本是否会在单击时发生变化。下面是我正在测试的组件中返回的大致内容(让我们称之为RandComponent)： return (<> let container;
浏览 13提问于2020-10-29得票数 0
1回答
如何使用React Testing Library模拟点击Material UI RadioGroup选项？
reactjs、react-testing-library
我如何编写一个react测试库测试脚本来验证点击Material UI单选按钮？下面是我遇到的问题的再现。import React from 'react';import RadioGroup from '@material-ui/core/Rad
浏览 25提问于2021-05-03得票数 1
回答已采纳
2回答
单击jest测试中的material-ui单选按钮，查看其效果
reactjs、jestjs、material-ui、enzyme、ui-testing
我试图在一个定制的可重用组件上完成一个jest测试，但很难让它工作。我已经在沙箱中使用普通的material-ui组件对其进行了裁剪，但在模拟单选按钮单击时仍有困难。).first().simulate('change', {target: {checked: true}});
wrapper.find(Radio).first().update(); 测试失败的工作沙箱：https:/
浏览 61提问于2020-01-08得票数 1
1回答
Material-UI的withStyles在使用Jest +酶测试有状态类组件时导致问题
reactjs、typescript、jestjs、material-ui、enzyme
我将Material-UI与SSR指令一起使用，如下所述： https://material-ui.com/guides/server-rendering/ 我的很多组件都是有状态的，我用Jest +Enzyme来测试它们。，就会发生这个问题： export default withStyles(styles)(Counter); 然后用酶包裹它： const counterProps: CounterProps = {
浏览 18提问于2019-06-02得票数 1
1回答
酶-如何模拟在按住Shift键的同时单击？
enzyme
我正在使用酶/Jest来测试我的React组件。如何模拟在按住shift键的同时单击按钮？
浏览 6提问于2019-07-24得票数 2
回答已采纳
1回答
如何测试Stencil.js状态变化？
testing、jestjs、state、stenciljs
我试图弄清楚如何使用jest测试Stencil组件中的状态更改。我对测试很陌生，并且发现你可以用酶来测试反应组分中的状态变化，但是我还没有弄清楚如何用模板组件来做。我该怎么做呢？
浏览 2提问于2019-07-17得票数 3
回答已采纳
1回答
模拟点击material-ui切换组件测试
javascript、reactjs、material-ui、enzyme
因此，我正在尝试使用jest和酶测试一些基于material-ui切换组件的功能。我有一个通用的clickIt函数，它可以很好地用于其他material-ui组件，但在这个函数中，它似乎不会触发状态更改 }
TestUtils.Simulate.touc
浏览 6提问于2017-03-17得票数 5
回答已采纳
1回答
添加用于反应测试的酶后，所有测试均失败
javascript、reactjs、unit-testing、jestjs、enzyme
这是非常直接的。在我的React应用程序中，我想使用Enzyme和Jest来测试我的应用程序。我已经为酶创建了一个安装文件import Adapter from 'enzyme-adapter-react-15';
Enzyme.configure从字面上看，所有测试(即使是测试2+2是否为4的最基本测试</
浏览 1提问于2018-07-10得票数 0
2回答
检测Jest/酶测试过程中的合成点击反应
javascript、reactjs、jestjs、enzyme、html-input
因此，当单击按钮时，我转过身，在文本输入元素上触发一个合成单击事件，如下所示。 .../酶来测试这个。但是，虽然我可以模拟按钮上的单击事件，但我还没有弄清楚如何检测文件输入元素上的合成单击事件。
我尝试过使用Jest/酶法来模拟输入元素上的click方法。我也不能添加onClick属
浏览 7提问于2017-03-04得票数 2
回答已采纳
3回答
物料UI +酶检测组件
reactjs、jestjs、material-ui、enzyme
我在React中有一个组件，我正在尝试用Jest测试它，不幸的是测试没有通过。"@material-ui/core/es/Tabs/Tabs";import {connect} fromstate.product.products,}
export defa
浏览 4提问于2018-06-19得票数 13
1回答
如何测试由在SetTimeout上触发的useEffect修改的组件样式？
reactjs、jestjs、react-hooks、enzyme、ts-jest
我正在使用Jest/酶法测试React/TypeScript应用程序，而且我很难编写测试来断言某个按钮是否在一段时间后出现：import { StyledNotifyButtonreturn ( <StyledNotifyButton visible={showNotifyButton} /&g
浏览 2提问于2021-05-07得票数 4
回答已采纳
1回答
e.preventDefault阻止我使用酶进行单元测试
reactjs、jestjs、enzyme
我有一个带按钮的reactJS应用程序。event.preventDefault();因此，在我的onClick处理程序中，我具有以下结构。(包括对后端API的异步调用)然而，我的问题是，当我用酶创建单元测试时，函数在&#
浏览 11提问于2019-07-29得票数 0
回答已采纳
3回答
ReactWrapper只能包装有效的元素(材料-ui-酶)
reactjs、jestjs、material-ui、enzyme
我正在为一个组件编写一个测试，以测试它的一个函数，但是我得到了一个错误: ShallowWrapper只能包装有效的元素 /* eslint-disableimport React from 'react'import { InputLabel, TextField } from '@material-uireturn {
浏览 1提问于2020-09-13得票数 0
回答已采纳
1回答
使用jest酶测试输入组件
reactjs、jestjs、material-ui、enzyme
我有一个简单的输入组件，我想用jest来测试它，酶。import TextField from '@material-ui/core/TextField'; );
e
浏览 20提问于2019-09-27得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
活动推荐
腾讯云开发者
