reactjs - Material-UI 的 Select 组件在关闭时是否使用 setTimeout？如果是，为什么？

Question

Material-UI的Select组件是否使用超时或其他时间功能然后关闭？我一直在努力寻找代码的实现，也尝试过调试，但我找不到答案。

我需要知道这一点，因为我在使用 Cypress 测试框架及其 Select 组件上的 clock() 方法编写 GUI 测试时遇到了一个问题。

时钟方法用于覆盖日期、setTimeout 和 clearTimeout (https://docs.cypress.io/api/commands/clock.html#Syntax) 等时间函数。

在未指定我只想覆盖 Date 的情况下使用它时，Select 组件不会按预期关闭。实际的下拉菜单关闭但不可见的背景 div (#menu-.presentation) 保持不变，因此当 cypress 想要继续测试运行时隐藏所有其他组件。

除了预期的与日期相关的错误之外，没有时钟，测试工作正常。这使我认为 Select 以某种方式使用了超时，即使我一直找不到任何证据。我真的很想了解这种行为。

我没有使用 native 选择。

相关依赖有以下版本:

"@material-ui/core": "4.3.2"

“ Cypress ”:“3.2.0”

“ Cypress 测试库”:“2.4.0”

Answer 1

查看代码因涉及的不同组件的数量而变得复杂，但如果您深入了解所有这些组件，您最终会找到 setTimeout。

• 选择 uses SelectInput
• 选择输入 uses Menu
• 菜单 uses Popover
• 弹出框 uses Grow作为其默认的 TransitionComponent。
• 成长 uses setTimeout
• Grow 还使用 react-transition-group 中的 Transition，这也是 uses setTimeout .