yairEO / tagify

🔖 lightweight, efficient Tags input component in Vanilla JS / React / Angular / Vue
https://yaireo.github.io/tagify/
Other
3.55k stars 436 forks source link

Duplicate entry on hit Return for suggestion #1275

Closed jzohrab closed 10 months ago

jzohrab commented 10 months ago

Prerequisites

Explanation

With a whitelist of suggestions, hitting Return should enter the selected value as a tag only once.

The selected value is entered twice, and the extra entry is deleted after a short delay. Note this doesn't happen every time, I'm not sure why it occurs at all.

https://github.com/yairEO/tagify/assets/1637133/d3b79348-7c30-4091-94ab-2c4248384724

No error, just a dup.

This is not a critical issue! Just looks funny for users. Thank you very much!

yairEO commented 10 months ago

Hi, can you please add steps to reproduce? I don't understand how to get to this situation

jzohrab commented 10 months ago

Hi @yairEO -- I can't reproduce it all the time. Basically, I enter the full tag, and then at the end I hit "enter". My tagify settings use a suggestion list, but are not restricted.to the whitelist (user can add new entries).

I'm using the files from the CDN referenced on the README: https://github.com/yairEO/tagify?tab=readme-ov-file#option-1---import-from-cdn -- I downloaded these files and use them locally in my Flask project.

If there is something more up-to-date I should use, let me know.

ps - thank you so much for your responses. Running a free open source project of any time is a real investment of time, and a real contribution. Much appreciated!

yairEO commented 10 months ago

Thanks! Yeah I've invested probably a thousand hours at least for this codebase alone, and I have many other open-source projects as well :) it's very time consuming with no benefits what so ever except satisfaction for helping developers by creating good tools

Without steps-to-reproduce this is going to be difficult to fix.. does this happen often? I assume more would have complained if it's that big of a bug (which looks like a very annoying bug to me)

jzohrab commented 10 months ago

It hasn't happened for a while now, so I believe this should be closed. If it happens again, I'll try to collect more useful information. I'll assume it's a user error until proven otherwise.

Re the open-source and satisfaction: I hear you, I'm the same, though not on the scale of tagify. tagify will be helping me out on my project, Lute, a free open-source tool for people to learn languages through reading -- so you'll be having an impact there as well.

I'll close this issue, but perhaps in the meantime you can let me know what attribution is good for tagify. Would an "acknowledgements" page be sufficient for you, with a brief note about your work? Cheers and best wishes! jz

Biszu commented 10 months ago

I was facing the same issue. It is caused by a combination of having the whitelist fetched with Ajax and dropdown.hide().

@jzohrab I see that you use Ajax for fetching the whitelist as well, and I assume you do it in a similar manner as the example in README.md (which, unfortunately, is causing issues) — see if not calling dropdown.hide() before making the whitelist request helps.

Kudos to @bdteo for figuring it out in https://github.com/yairEO/tagify/issues/884

jzohrab commented 10 months ago

Thank you @Biszu , I changed tagify.loading(true).dropdown.hide() to tagify.loading(true) and this may have addressed the issue. That changed also fixed a very small hiccup: before, I used to have to press the down arrow twice in order to get into the suggestion list; after making the change, I only have to press the down arrow once. A small fix, but still nice.