VueRenderer's ref is undefined when in production mode

[thechrisoshow]

I created a version of the Mention extension, heavily based on the example code when I noticed an issue, the keydown handler didn't work.

(Sample repo of the code not working: https://github.com/thechrisoshow/tiptap-mentions
Running at: https://determined-minsky-6136aa.netlify.app/ )

This was because of how we're sending messages from the parent component to the child using the VueRenderer's ref.

e.g.

onKeyDown(props) {
  // this fails with error on production like:
  // "Uncaught TypeError: Cannot read property '3573854894' of undefined"
  return component.ref?.onKeyDown(props);
},

It would work perfectly on development, but it looks like on production the underlying ctx object has the $refs stripped away, so the following wouldn't work (from VueRenderer.ts)

  get ref(): any {
    // On production, ctx no longer has a $refs object
    return this.editor.contentComponent?.ctx.$refs[this.id]
  }

I noticed though that ComponentInternalInstance has a refs object, so we can fix this problem by using this instead:

  get ref(): any {
    // Works on both production and development
    return this.editor.contentComponent?.refs[this.id]
  }

[philippkuehn]

oh great, thank you! 🙌