我正在尝试使用 Cypress 触发 MUI Select，但无法让它工作。
我已阅读 MUI SelectInput 源代码，很明显它们是在“mousedown”事件上触发的。我分析了一次点击，发现这是真的。然而，调用cy.find(input).trigger('mousedown', { force: true })不触发弹出窗口，也不触发cy.find('label').trigger('mousedown', { force: true })，也不抓取任何包含的div元素并在它们上触发 mousedown。
如果我进入 MUI 示例页面：https://material-ui.com/components/selects/ https://material-ui.com/components/selects/我检查那里的 DOM 并查看元素，它们都没有 onmousedown 处理程序，并将它们作为全局变量并调用temp<n>.dispatchEvent(new MouseEvent('mousedown'))不会触发弹出窗口打开。所以我无法弄清楚 mousedown 处理程序被挂接到哪里。
我缺少什么？
提前致谢。
让 Cypress 填写 Material-UI ReactSelect组件，这对我有用：
cy.get('#fooID')
.parent()
.click()
.get('ul > li[data-value="FooBar"]')
.click();
更换：
-
Foo使用您的 MUI Select 组件Id
-
FooBar以及您想要在下拉栏中选择的文本。
This post https://medium.com/@kevpkra/testing-material-ui-components-with-cypress-and-the-react-testing-library-349bedb12ccf帮助我指明了正确的方向。
在 Material-UI React 中Select组件表单标签的ID由外部 div 包裹/控制。 So .get('#fooID')通过ID抓取内部标签，.parent().click()点击根组件 div显示下拉菜单，并且.get('ul > li[data-value="FooBar"]').click()在下拉栏中找到并单击正确的项目。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
