setReadonly/setDisabled will blur any element that is not related to Tagify - Githubissues

yairEO / tagify

🔖 lightweight, efficient Tags input component in Vanilla JS / React / Angular / Vue

https://yaireo.github.io/tagify/

Other

3.52k stars 433 forks source link

setReadonly/setDisabled will blur any element that is not related to Tagify #1328

Closed Maxime117 closed 5 months ago

Maxime117 commented 5 months ago

Prerequisites

[x] I am running the latest version
[x] I checked the documentation and found no answer
[x] I checked to make sure that this issue has not already been filed

💥 Demo Page

https://jsbin.com/yododahodi/edit?html,js,output

Explanation

What is the expected behavior? It should verify if document.activeElement is an element related to tagify before calling blur()
What is happening instead? The blur() method is called on document.activeElement regardless of whether the active element is part of Tagify. This leads to a scenario where any focused element will lose focus, disrupting user interactions outside of the Tagify context.

https://github.com/yairEO/tagify/blob/3ecfbc2ed1de444bdcdbb10d8b62a61ae2fdc8fa/src/tagify.js#L1011 I'm unsure what this line is meant to do. I guess it's here to exit edit-mode on tags, as the tagify input should loose focus naturally when it has the readonly/disabled attribute.