重复问题
- 我搜索了现有的问题
最新版本
- 我测试了最新版本
重现步骤 🕹
链接到实时示例: https://codesandbox.io/p/sandbox/reverent-worker-y7dtfw
步骤:
- 使用带有 renderInput prop 的 Autocomplete 组件,如下所示:
renderInput={(params) => (
<Tooltip title="Tooltip">
<TextField {...params} />
</Tooltip>
)}
- 使用 "react-test-renderer": "18.2.0" 对带有此 Autocomplete 的快照进行测试
当前行为 😯
快照创建正确。
在创建快照时出现以下错误:
"MUI: 无法找到输入元素。它在预期为 HTMLInputElement 时解析为 null。
相反,Autocomplete 需要一个输入元素。
确保您已正确自定义输入组件。"
预期行为 🤔
快照创建正确。
在创建快照时没有错误。
上下文 🔦
我想自定义 Autocomplete,以便在值太长并以省略号结尾时显示输入/TextFileld值的工具提示。我认为这对用户很有用,以便在输入中截断的情况下查看完整的标签。
您的环境 🌎
npx @mui/envinfo
System:
OS: Linux 5.15 Ubuntu 22.04.3 LTS 22.04.3 LTS (Jammy Jellyfish)
Binaries:
Node: 20.4.0 - ~/.nvm/versions/node/v20.4.0/bin/node
Yarn: 1.22.4 - ~/.nvm/versions/node/v20.4.0/bin/yarn
npm: 9.7.2 - ~/.nvm/versions/node/v20.4.0/bin/npm
Browsers:
Chrome: session.
使用的 Chrome 版本:版本 119.0.6045.200(官方构建)(64位)
2条答案
按热度按时间djmepvbi1#
@pgrabo 您的沙箱无法复现该问题🤔,
input
元素似乎已正确快照并记录到控制台:rjee0c152#
是的,它是快照并且记录得很好,但问题实际上是在执行快照时记录到控制台的错误:
您可以在上面的屏幕截图中看到此错误的最后一行。实际上,您已经重现了这个问题。
是的,您说得对,快照看起来没问题。但是为什么mui会打印出这个错误呢?
mui告诉我我误用了输入元素,我自定义它的方式是错误的:/
在我的测试环境中,任何控制台错误都会导致测试失败(尽管快照可能没问题)
这就是为什么这个错误让我担心的原因。