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

[BUG] Safari 浏览器下,Select 组件下拉框闪烁 #1698

Open
1 task done
nekocode opened this issue Jul 11, 2023 · 12 comments · May be fixed by #1961 or #2240
Open
1 task done

[BUG] Safari 浏览器下,Select 组件下拉框闪烁 #1698

nekocode opened this issue Jul 11, 2023 · 12 comments · May be fixed by #1961 or #2240
Labels
need more info Can't reproduce the problem, need to provide more context

Comments

@nekocode
Copy link
Contributor

Is there an existing issue for this?

  • I have searched the existing issues

Which Component

Select

Semi Version

2.38.2

Current Behavior

Safari 浏览器下,Select 组件的下拉框某些情况下会闪烁:

20230711-165337.mp4

Expected Behavior

No response

Steps To Reproduce

  1. 使用 Safari 打开 http://semi.design/zh-CN/input/select
  2. 逐个点击页面中的 Select 演示组件,偶尔能复现闪烁

ReproducibleCode

No response

Environment

- OS: MacOS
- browser: Safari

Anything else?

No response

@pointhalo
Copy link
Collaborator

which version of safari ?

@pointhalo pointhalo added the need more info Can't reproduce the problem, need to provide more context label Jul 11, 2023
@nekocode
Copy link
Contributor Author

which version of safari ?

Version 16.5.1 (18615.2.9.11.7)

@pointhalo
Copy link
Collaborator

@DaiQiangReal 实测了一下,v >2.37.1 在 safari下有会问题,跟这个PR #1676 可能相关

@pointhalo
Copy link
Collaborator

@DaiQiangReal 实测了一下,v >2.37.1 在 safari下有会问题,跟这个PR #1676 可能相关

我的 safari v15.1

@DaiQiangReal
Copy link
Collaborator

低版本 safari 确实会闪,但升级到 16.3 后,没有复现。包括 Version 16.5.1 (18615.2.9.11.7)

@DaiQiangReal
Copy link
Collaborator

@nekocode 你是 ARM 的 mac 还是 Intel 的? ARM 的 Safari 16.5.1 复现了,但 intel 没有。。

@nekocode
Copy link
Contributor Author

nekocode commented Jul 13, 2023

@DaiQiangReal 我的 Mac 是 ARM 的。目前我们这边测试人员反馈这个问题主要是影响到 iOS 端的用户,因为 iOS 下只能使用 Safari 的 Webkit 内核

@nekocode nekocode linked a pull request Dec 2, 2023 that will close this issue
15 tasks
@nekocode
Copy link
Contributor Author

nekocode commented Dec 2, 2023

@pointhalo @DaiQiangReal

我这边最近有空排查了下,发现 Select 在初始化的时候会触发一次 rePositionDropdown:

this._adapter.rePositionDropdown();

最终会导致 Tooltip 的 isPositionUpdated 被置为 true:

isPositionUpdated: true

这个值应该是用来标志是否计算 & 更新完成位置的。一开始就为 true 会在位置还是 -9999 时把 motion 给打开,然后在 safari 下貌似就会导致闪烁了。

image

第二次打开下拉菜单时就正常了:

image

感觉应该在 insertPortal 时把 isPositionUpdated 重置为 false?我提交了 #1961 ,你们可以帮忙看下是否会有其他问题(我本地在 story 下测试不闪烁了

@haecheonlee
Copy link

Hi, do you have any update for this?

@pointhalo
Copy link
Collaborator

这个PR没有处理是因为我本地没有办法复现,在更新版本的 safari(v17.0)里没有再复现这个问题。我手上没有更旧版本的设备了,我也没有办法验证这个改动。
同时我们不倾向于改 Tooltip,这个补丁打在tooltip上是不合理的,它的影响范围会有点不可控。

@pointhalo
Copy link
Collaborator

我单独改了一下 Select init时 collectionOptions -> rePositionDropdown 的逻辑,在init时不做调用,但是我没办法验证,先单独发一个 alpha包给你们测试吧。

你们可以尝试使用这个版本,看看表现是否有所不同(在没有确认有效之前,这个修改仅会在该alpha测试版存在,不会合入主分支版本中)

@douyinfe/[email protected]

@nekocode
Copy link
Contributor Author

nekocode commented May 15, 2024

我单独改了一下 Select init时 collectionOptions -> rePositionDropdown 的逻辑,在init时不做调用,但是我没办法验证,先单独发一个 alpha包给你们测试吧。

你们可以尝试使用这个版本,看看表现是否有所不同(在没有确认有效之前,这个修改仅会在该alpha测试版存在,不会合入主分支版本中)

@douyinfe/[email protected]

@pointhalo 2.59.0-alpha.0 我这测试是没问题了 🎉 能在 insertPortal 之前保证 isPositionUpdated 不是 true 应该就没问题。

你那没法复现应该是因为你用的不是 ARM 芯片(这确实很奇怪),我这 Safari 17.4.1 在你们官网上测试还是会有这个问题。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
need more info Can't reproduce the problem, need to provide more context
Projects
None yet
4 participants