Race condition with loadOriginalValues

[gitgitwhat]

Prerequisites

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

💥 Demo Page

Not something I can easily demo in JSBin.

Explanation

• What is the expected behavior?
  There appears to be a race condition with loadOriginalValues during loading. Here's what I'm seeing. My PHP page generates a number of addTags calls to populate a Tagify list. There is also a lot of other dynamically generated Javascript that that gets created and executed. The tags get added but then the original values observer executes for the first time and removes all the existing tags via this.removeAllTags(); on line 2599.

To fix this problem, I just need to change the position of my Tagify addTag initialization to run before all other generated Javascript. So, it seems like there's a race condition, under heavy Javascript load, with tags being added and the initial original value check.

• What is happening instead?
  Existing tags should be saved if they exist and added back instead they are just simply cleared.

• What error message are you getting?
  None

[yairEO]

why would PHP generate addTags function calls? you should render the page with the input elements already filled with their correct value. do not call addTags unless you are doing an async call to the server AFTER the page has been rendered in order to fetch the fields' data.

[gitgitwhat]

Fundamentally, it doesn't matter why. The issue is still valid. The library shouldn't clear any values that already exist in the list.

[yairEO]

The Tagify component and the (hidden) input element it's fundamentally bound to must always be in-sync. if some code somehow manipulates the input element then the Tagify component will adapt accordingly:

https://github.com/yairEO/tagify/blob/master/src/parts/events.js#L680-L688

The observeOriginalInputValue function runs every 500ms

You should make sure your code does not change the Tagified input's value in any way.
on Tagify should handle the input field once it has been "tagified".

Make sure you don't have a form reset code running after input fields have been tagified which is a possibility if you say all your tags are removed.