对选定组件进行单元测试:
<FormControl fullWidth>
<InputLabel id="demo-simple-select-label">
{t("StrategyManager.Select_Action_Origin")}
</InputLabel>
<Select
name="actionOrigin"
label="Select Action Origin"
id="operator-select"
value={formik.values.actionOrigin}
onChange={(event) => handleFormDataChange(event)}
fullWidth
inputProps={{
id: "actionOrigin",
"data-testid": "actionOrigin",
}}
>
<MenuItem value={strategyActions.communications.value}>
{t(strategyActions.communications.label)}
</MenuItem>
<MenuItem value={strategyActions.timer.value}>
{t(strategyActions.timer.label)}
</MenuItem>
<MenuItem value={strategyActions.socials.value}>
{t(strategyActions.socials.label)}
</MenuItem>
</Select>
</FormControl>;
字符串
我似乎只能使用fireEvent.change(actionOriginSelect, { target: { value: strategyActions.timer.value } });
在单元测试中更改值,我更喜欢使用user.selectOptions(actionOriginSelect, strategyActions.timer.value)
,但由于某种原因,这不会更新目标输入的值,所以我只能使用第一个实现。
测试通过,但它导致控制台错误,指出更新未 Package 在act(...)
中
完整的测试在这里:
it("selects the timer option and reveals the action selector without showing a popup", async () => {
const user = userEvent.setup();
render(
<ActionsDrawer/>,
);
const actionOriginSelect = screen.getByTestId("actionOrigin");
expect(actionOriginSelect).toBeInTheDocument();
// selects value and inputs it in the field but causes console error in process?
fireEvent.change(actionOriginSelect, {
target: { value: strategyActions.timer.value },
});
// ideally would prefer to use the below line of code but for some reason actionOriginSelect won't change value
// await user.selectOptions(actionOriginSelect, strategyActions.timer.value);
const actionTypeSelect = screen.getByTestId("actionType");
expect(actionTypeSelect).toBeInTheDocument();
// Ensure no confirmation modal is displayed
const changeOriginModal = screen.queryByText(
"StrategyManager.Confirm_Change_Origin",
);
expect(changeOriginModal).toBeNull();
});
型
我试过以下方法:
- 在act()中 Package 上述测试的不同部分,希望找到需要 Package 的部分
- 已尝试等待我认为导致错误的起火事件已尝试
- 尝试在fireEvent之后的Assert上实现waitfor
- 尝试jest定时器建议的文章对上述行为警告
似乎没有一个可以从终端删除或清除控制台警告。
任何关于如何改进测试或实现user.selectOptions的帮助或建议都将非常感谢。如果失败,帮助上述哪些部分需要 Package 在act中以删除控制台错误将是有益的,因为我很高兴与测试,如果这是最好的,我可以得到,但显然多个测试导致此控制台警告不是很好,我想更好地了解这个问题以避免它在未来。
1条答案
按热度按时间zazmityj1#
经过几天的尝试和错误,我终于找到了答案,我遇到了这个question,它修复了我得到的错误。我必须在fire事件周围添加await act(alloc()=> {}),并添加一个await
字符串