Removing data after removed from DOM

[nblackburn]

I am currently implementing drag and drop functionality into a project of mine and have run into an issue where the library i am using removes the node from the DOM but upon syncing that action in the model, i am getting the following error...

Uncaught TypeError: Cannot read property 'removeChild' of null

This is because Vue is trying to remove a node that has already been removed by a third party plugin. I imagine it would be fixed by the inclusion of additional checks that the node exists which seems to be blocking the data from being removed.

Edit: I have added a gif mimicking the behavior of the third party library to showcase the error.

[yyx990803]

Vue's update algorithm is built upon the assumption that the DOM structure is not to be altered by arbitrary 3rd party code. It's unlikely that the code could work even if a additional guard is added.

I have no intention to support this, but if you are willing to dig into the code and open a PR I'll review it.

[nblackburn]

@yyx990803 I am going to look into this further, in the mean time if you are aware of any better way of implementing such functionality in a more Vue friendly manner, i would appreciate it.

[nblackburn]

/**
 * Remove el from DOM
 *
 * @param {Element} el
 */

function remove(el) {

  if (!inDoc(el)) return false;

  el.parentNode.removeChild(el);
}

@yyx990803 Added a quick hack in to see if it was the cause of the issue and this seems to have resolved it, shall i create a PR?