Skip to content

fix(client): hide empty status tooltip popper to remove stray arrow artifact - #373

Merged
shigma merged 1 commit into
koishijs:mainfrom
Oppenheymu:fix/status-tooltip-empty-arrow
Oct 8, 2026
Merged

shigma merged 1 commit into
koishijs:mainfrom
Oppenheymu:fix/status-tooltip-empty-arrow

Conversation

@Oppenheymu

Copy link
Copy Markdown
Contributor

Fixes #372

问题:状态栏状态项没有 tooltip 内容时(如未配置任何机器人时悬停「↑ 0/min ↓ 0/min」),空弹层的 .el-popper__arrow 会残留为一枚黑色菱形,详见 #372。

根因:空占位标记 <span class="el-popper__empty"> 嵌在 el-scrollbar 内层,而 Element Plus 把箭头 span 渲染为 #content 插槽输出的平级后继(对照 element-plus@2.7.7 的 packages/components/tooltip/src/tooltip.vue,showArrow 默认开启),二者不是相邻兄弟节点,原有的相邻选择器 .el-popper__empty + .el-popper__arrow 永远匹配不上——空弹层本体因零尺寸不可见,可见的就只剩那枚箭头。

修复:改用 :has(.el-popper__empty) 在无内容时整体隐藏弹层。零尺寸弹体(padding: 0 0)本就不可见,整体隐藏与原意图等价且更彻底。凡未传 #tooltip 插槽的 <k-status> 使用方(加载进度、插件市场下载进度等)一并受益。

已在本地实测:修复前悬停空状态项出现黑菱形;修复后消失,且不改变有内容 tooltip(版本信息、系统负载)的弹出表现。:has() 为 Baseline 特性(Chrome 105+ / Safari 15.4+ / Firefox 121+)。

@ilharp ilharp left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

注释去掉吧,这里代码自己就能表达清楚

@Oppenheymu
Oppenheymu force-pushed the fix/status-tooltip-empty-arrow branch from 4da2182 to 39c07d0 Compare September 19, 2026 15:42
@shigma
shigma merged commit 1dc5c0e into koishijs:main Oct 8, 2026
1 check failed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Bug: 鼠标悬停无内容的底部状态项时出现黑色菱形(空 tooltip 的箭头残留)

3 participants