Description
Vue version
3.4.16
Link to minimal reproduction
Steps to reproduce
You can test it at the link above. Choose Element Plus version 2.5.5 and Vue version 3.4.16. After selecting, you will notice that clicking the el-select dropdown does not display anything. Checking the console, it's observed that the popup layer is set to display: none , causing it not to show. Switching Vue version to 3.4.15 restores normal functionality.
After investigation, it's found that the following two changes under v3.4.16 caused this issue. I tested locally and directly reverted these two changes in the code under node_modules runtime-dom/dist , which restored normal functionality.
Besides el-select, there are many other components that are not displayed properly, such as el-container, el-menu, el-scrollbar, el-overlay, etc. After examining the code, it's noticed that these components are all implemented using rendering functions. Components using template seem to display correctly.
updated(el, { value, oldValue }, { transition }) {
- if (!value === !oldValue) return
+ if (!value === !oldValue && el.style.display === el[vShowOldKey]) return
if (transition) {
if (value) {
transition.beforeEnter(el) // indicates that the `display` of the element is controlled by `v-show`,
// so we always keep the current `display` value regardless of the `style`
// value, thus handing over control to `v-show`.
if (vShowOldKey in el) {
+ el[vShowOldKey] = style.display
style.display = currentDisplay
}v3.4.16 版本会导致 element-plus 所有用渲染函数创建的组件都无法显示
可以在上面的链接测试，Element Plus版本选择2.5.5，Vue版本选择3.4.16，选择后可以发现点击 el-select 下拉框无法显示，看控制台发现是弹出层被设为了 display: none 导致无法显示，将Vue版本切换为 3.4.15 后恢复正常。
排查后发现是 v3.4.16 这两个改动导致的，我本地测试直接改了 node_modules下的 runtime-dom/dist 的代码还原这两个改动后就恢复正常。
除了 el-select， 无法显示的组件还有很多，比如 el-container 、el-menu 、el-scrollbar 、 el-overlay 等，看了下代码，发现这些组件都是用渲染函数实现的，使用 template 的组件好像都正常显示。
What is expected?
Displayed normally.
What is actually happening?
Not displayed.
System Info
No response
Any additional comments?
No response