Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: disabled switch can't trigger mouseLeave, tooltip can't hide #1333

Merged
merged 1 commit into from
Dec 9, 2022

Conversation

pointhalo
Copy link
Collaborator

@pointhalo pointhalo commented Dec 8, 2022

中文模板 / Chinese Template

What kind of change does this PR introduce? (check at least one)

  • Bugfix
  • Feature
  • Code style update
  • Refactor
  • Test Case
  • TypeScript definition update
  • Document improve
  • CI/CD improve
  • Branch sync
  • Other, please describe:

PR description

现状

  • React本身对于 disabled input/ button 只会触发 onMouseEnter、不会触发 onMouseLeave 4251,在 disabled switch 被 Tooltip包裹的情况下,虽然tooltip已经自动 wrap了一个span元素 在外层,并且 onMouseEnter、onMouseLeave等事件监听器也是加在 span上的。但由于 disabled input 的宽高 与 span 完全相等。此时 span 依然无法触发 onMouseLeave事件
    • 仅在chrome和 safari下无法触发,在火狐下一切正常(即火狐下不存在该bug)
    • 如果我们将span的padding从0 -> 任意正数,此时onMouseLeave 是可以触发的

修改方案

  • 对 disabled input增加 point-event: none 与 cursor: not-allowed。让span的事件监听能正常工作

Changelog

🇨🇳 Chinese

  • Fix: 修复 disabled switch 被 Tooltip或 Popover等组件包裹,且trigger为hover时,在chrome浏览器下,鼠标移开后未能正确隐藏的问题

🇺🇸 English

  • Fix: Fix the problem that when the disabled switch is wrapped by components such as Tooltip or Popover, and the trigger is hover, it cannot be hidden correctly after the mouse is moved under the chrome browser

Checklist

  • Test or no need
  • Document or no need
  • Changelog or no need

Other

  • Skip Changelog

Additional information

@github-actions github-actions bot added the codeball:approved Codeball label Dec 8, 2022
@codesandbox-ci
Copy link

codesandbox-ci bot commented Dec 8, 2022

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit da33c48:

Sandbox Source
pr-story Configuration
Semi Design: Simple Story Configuration

@codecov-commenter
Copy link

Codecov Report

Base: 88.93% // Head: 88.93% // No change to project coverage 👍

Coverage data is based on head (da33c48) compared to base (1c7e615).
Patch has no changes to coverable lines.

Additional details and impacted files
@@           Coverage Diff            @@
##           release    #1333   +/-   ##
========================================
  Coverage    88.93%   88.93%           
========================================
  Files          431      431           
  Lines        24538    24538           
  Branches      6141     6141           
========================================
  Hits         21822    21822           
  Misses        2716     2716           

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

☔ View full report at Codecov.
📢 Do you have feedback about the report comment? Let us know in this issue.

@czm1290433700
Copy link

👍

@pointhalo pointhalo merged commit 5ab3e8b into release Dec 9, 2022
@pointhalo pointhalo deleted the fix-disabledSwitch branch December 9, 2022 09:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants