Skip to content

fix: show session delete button after the list shifts under the cursor - #771

Open
killersteps wants to merge 1 commit into
agegr:mainfrom
killersteps:fix/session-delete-hover-actions
Open

fix: show session delete button after the list shifts under the cursor#771
killersteps wants to merge 1 commit into
agegr:mainfrom
killersteps:fix/session-delete-hover-actions

Conversation

@killersteps

Copy link
Copy Markdown
Contributor

Problem

Rename and delete on a session row only appear while that row is hovered. Hover is tracked with JS mouseenter.

After you delete a session, the row below it moves up into the same place. The pointer often has not moved. Browsers do not fire mouseenter (and often do not update :hover) when layout moves an element under a stationary pointer, so the row now under the cursor has hovered === false.

The delete button is then missing until the pointer leaves the row and comes back. This is intermittent: it happens when you delete one session and immediately hover the next one, or when the next row is already under the cursor.

Solution

Keep the existing per-row mouseenter / mouseleave behavior, and additionally:

  1. Record the pointer position on the session list.
  2. After the list reflows, hit-test row geometry (data-session-id) and treat the row under the cursor as hovered.
  3. Ignore pointerleave / mouseleave when the coordinates are still inside the list. Unmounting the deleted row synthesizes leave even though the cursor never left.

Tests

  • components/SessionSidebar.test.mjs asserts the geometry probe, the synthetic-leave guard, and showHover = hovered || pointerActive.

node --experimental-strip-types --test components/SessionSidebar.test.mjs passes.


问题

会话行的重命名 / 删除按钮只在悬停时出现,悬停状态靠 JS 的 mouseenter

删掉一条会话后,下面那一行会顶上来,占原来的位置。这时指针往往没动。元素是被布局挪到指针下面的,浏览器不会触发 mouseenter:hover 也经常不更新),于是现在指针底下的那一行 hovered === false

删除按钮就不会出现,直到指针先离开再移回来。这是偶现的:删掉一个以后立刻悬停到下一条,或者下一条已经在指针下面时,就会踩中。

解决方案

保留原有的逐行 mouseenter / mouseleave,并额外:

  1. 在会话列表上记录指针位置。
  2. 列表回流后,按行几何(data-session-id)做命中检测,把指针下面的行当作已悬停。
  3. 坐标仍在列表内时忽略 pointerleave / mouseleave。被删的那一行卸载时会合成 leave,但指针其实没离开列表。

测试

  • components/SessionSidebar.test.mjs 覆盖几何探测、合成 leave 防护,以及 showHover = hovered || pointerActive

node --experimental-strip-types --test components/SessionSidebar.test.mjs 通过。

Deleting a session unmounts that row so the next row slides up into the
same place. The pointer often has not moved, so mouseenter/:hover do not
fire and the rename/delete buttons intermittently never appear.

Track the pointer against row geometry, ignore synthetic pointerleave
from the removed row, and treat the row under the cursor as hovered
after the list reflows.
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.

1 participant