Tags: /Node & JS/   Date Created:

How to Inspect a Disappearing  react drop down list element?

众所周知，一个React drop down list 组件，当我们点击后，会弹出一个下拉框，如下图：

但是，当我们用浏览器的F12(Debug Mode)，调试模式，想通过 Find Eleme（Ctrl+Shift+C）功能来定位下拉框元素的时候，会发现下拉框自动消失了，从而无法得到下拉框元素的 xpath, id, 等信息。

解决办法：

先定位到该元素，然后到调试窗口中，找到 Event Listeners，勾选【上级】和【Framework 侦听器】

找到focusout，然后删除下面所有的 event listener，如下图：

此后，下拉框弹出后，就不会自动消失了，我们就可以来查找和定位下拉框的元素了：