vue-devtools not recognizing components manually appended to DOM & $mounted

[matthewsunrise]

What problem does this feature solve?

Provide ability to debug manually appended & mounted components which is necessary in edge cases.

What does the proposed API look like?

import Mention from "./MentionSpan";

const ComponentClass = Vue.extend(Mention);
const instance = new ComponentClass({
   propsData: { id: result.id, removeFunction: this.
});
instance.$slots.default = [result.name];
instance.$mount();
vue-devtools.register(instance);

[LinusBorg]

Just make sure to define a parent when creating the component instance:

const instance = new ComponentClass({
   propsData: { id: result.id, removeFunction: this.
  parent: this, // assuming you do this in e.g. mounted() or a component method
});

That's enough to make it appear.

[matthewsunrise]

Thank you so much!

[skjnldsv]

Hum, this doesn't seems to work anymore :(