Akryum / Akryum/floating-vue

BUG: Focus trigger won't work / Wrong implementation

未關閉
#641 2 則留言 4 個 reaction 已指派 0 人 在 GitHub 檢視
主要語言
TypeScript
星號
3.5k
分支
341
平均合併
14 分鐘
30 天內合併 PR
8

描述

First of all, thanks for maintaining this plugin 😸 !

Since the `v-popover` wraps the trigger element within a div, if the given trigger is `focus` it won't work. Here's an example:

```html

Enter a quantity

```
Will turn into

```html






```

Therefore, the trigger is not being applied to the first element given within the `` component but to the wrapper instead, which in my opinion is wrong, otherwise the `focus` trigger doesn't make any sense if the focus will be applied to the wrapper instead to the desired element.

Running example: [https://jsfiddle.net/juanpablobl/yjt9asez/](https://jsfiddle.net/juanpablobl/yjt9asez/)

A nasty workaround would be firing the popover when clicking the input, but this goes against accessibility principles, moreover, I'm focusing the input as soon as the page loads in order to make the popover appear, but that won't happen because of what I just described.

Hope this information helps! Is there any way I could help or do you want me to provide further info? Thank you in advance!

Warm regards,
Juan Pablo

*PS: Also noticed that the class `trigger` is not scoped. If it doesn't, it should be something like `v-popover__trigger` instead just `trigger` to avoid class name collision with the parent project/website since `trigger` is quite a common word and it could be the case that there are global styles applied to that. Just saying 😅 *

貢獻指南

開啟貢獻指南

評估

這個 Issue 還沒有評估資料。

把新 issue 寄到你的電子郵件信箱

精選適合新手參與的 GitHub issue 摘要。