reactjs - 如何让 Jest 等待状态更新 - React / Jest / Enzyme
问题描述
我有一个简单的程序,可以在单击按钮时更改 textField 的 helperText。
在 Jest 中,我正在模拟按钮按下,然后我想验证帮助文本是否已更改。目前,我只是在单击之前和之后控制台记录文本字段,但在这两种情况下,它都说值是“”。单击执行后,我希望它是“用户名不得包含任何特殊字符”。
笑话/酶测试:
import React from "react";
import RegistrationPage from "../pages/registration";
import { configure, mount } from "enzyme";
import Adapter from "enzyme-adapter-react-16";
import { act } from "react-dom/test-utils";
import TextField from "@material-ui/core/TextField";
configure({ adapter: new Adapter() });
describe("App", () => {
it("renders without crashing", () => {
let wrapper;
act(() => {
wrapper = mount(<RegistrationPage />);
console.log("BEFORE CLICK");
console.log(wrapper.find(TextField).first().props());
wrapper.find("#submitRegForm").first().props().onClick();
});
console.log("AFTER CLICK");
console.log(wrapper.find(TextField).first().props());
});
});
React 看起来像这样:
const onSubmitHandler = ()=>{
setDisplayName({
...displayName,
helperText: "Username must not contain any special characters",
error: true
});
}
.
.
.
<TextField {...props} size="small" fullWidth variant="outlined" />
<Button
variant="contained"
color="primary"
fullWidth
onClick={onSubmitHandler}
id="submitRegForm">
Finish
</Button>
解决方案
也许你是一种更规范的方式,但我个人只是使用
it('...', (done) => {
//simulating some async functions
setTimeout(() => {
expect...
done();
});
}
推荐阅读
- javascript - Angular 9 a for 循环正在向空属性名称添加值
- c++ - 如何在 Windows 内核中获取文件大小
- python - 这段代码如何生成 26 次唯一字符?
- python - 为什么文件中的这个打印会添加我没有要求的换行符?
- autohotkey - 在 onenote 2016 中折叠展开的 autohotkey 脚本
- flutter - 停留在 Flutter Native Plugin 指南中的第 2b 步
- python - 使用 Python 生成所需的数字组合
- python-3.x - 单击按钮时,我的 gui 未打印所需的用户名
- python - 如何在 discord.py 中使字符串长于 1 个单词?
- algorithm - 使用“Low-Down Triple Dealing”魔术技巧来确定牌在牌组中的位置的算法是什么