search

CharlesStover / use-clippy

React Hook for reading from and writing to the user's clipboard.
https://www.npmjs.com/package/use-clippy
MIT License
179 stars 11 forks source link

Input looses focus #56

Open abubakir1997 opened 3 months ago

abubakir1997 commented 3 months ago

For some reason using useClippy hook in a component causes the body to be set as the focus element when that component is initially rendered. This causes the input field to loose focus. Test in blueprintjs popover

abubakir1997 commented 3 months ago

It seems the issue is caused by creating an element in body to copy the text using the old copy method. The navigator clipboard API should be used first if available. And the element should be created inside the focus item instead of body could potentially resolve the issue.

CharlesStover commented 3 months ago

This is a great find. I'm not positive that I'll have bandwidth to address it though, but a PR would be welcome.

I'd have one concern with putting the new input inside the currently focused element, being that that may not work if the currently focused element is a text input. The best bet may be to remember the previously-focused element, then focus it again after the copy action is complete.