Smart picker issues when opened from Text

[julien-nc]

We get TypeError: link.sub.notify is not a function in some occasions when opening the smart picker in Text.

The stack points to https://github.com/nextcloud/text_templates/blob/feat/vue3/src/views/TemplateCustomPickerElement.vue#L139 which is just an affectation to a data prop. It seems like the upper Vue context of the Text app is complaining about what the Vue 3 picker component does.

Steps to reproduce the issue with the text_templates app

• Context: Use the master branch of server and text. Use the feat/vue3 branch of text_templates. Build the text_templates assets with npm
• Go to the personal settings, in the Additional settings section, add at least one text template
• Open a text file with Text
• Type /text and select the Text templates
• Check the browser console

@ShGKme It reminds me of something we discussed a while back but I can't remember the details. I think it was related with build options and nested Vue instances. At the time, the nc/vue lib was still in Vue 2 and Text as well.
Now text_templates is using @nextcloud/vue 9 but Text is still using Vue 2 and @nextcloud/vue 8.

cc @janepie

[julien-nc]

Could we try mounting the custom picker in a DOM element that is outside the smart picker stuff?
If the issue is caused by the Vue 3 reactivity being different the the Vue 2 one, moving the Vue 3 instance could help, right?

[susnux]

I checked this and for me this looks not like a problem with text.
It seems more like your Vue view does try to access reactive scope when its not available anymore.

For me it is fixed when I properly await the async template loading (make the mounted async) and use proper async component for the views:
https://github.com/nextcloud/text_templates/pull/82/changes