Issues when importing some functions from NcRichText.js

[julien-nc]

When importing registerWidget, registerCustomPickerElement or NcCustomPickerRenderResult from @nextcloud/vue/dist/Components/NcRichText.js the script fails and we get Uncaught TypeError: inspect is undefined in the browser console:

But this error goes away as soon as we import something from @nextcloud/vue-richtext, even an empty import like import {} from '@nextcloud/vue-richtext'.

This issue cannot be reproduced when linking with @nextcloud/vue (same with master or v7.8.0, it works fine).

So it seems there are some missing dependencies in the @nextcloud/vue package. Or can it be related with node-polyfill? I'm lost there.

To reproduce this bug, one can use this integration_tmdb branch: https://github.com/julien-nc/integration_tmdb/tree/enh/noid/replace-vue-richtext-by-vue , compile and enable the app in NC 26 or master and browse Talk or the Files app (with Text enabled).
The problematic import is in https://github.com/julien-nc/integration_tmdb/blob/enh/noid/replace-vue-richtext-by-vue/src/reference.js#L23-L24

cc @raimund-schluessler @juliushaertl

[raimund-schluessler]

I went through the (dev)dependencies list of vue-richtext again, and found that these packages

"mdast-util-from-markdown": "^1.2.0",
"mdast-util-gfm-autolink-literal": "^1.0.2",
"mdast-util-to-string": "^3.1.0",
"micromark-extension-gfm-autolink-literal": "^1.0.3",
"remark-disable-tokenizers": "^1.1.0",

are not present in nextcloud/vue anymore. I didn't install them in #3841 because I thought that they were unused (I didn't find where they were imported/used).
Maybe it helps adding them?

It would probably help to know which package includes inspect. Would it work to compare the bundles produced with and w/o the import from vue-richtext?

[mejo-]

@julien-nc I'm unable to reproduce this issue with either your branch of integration_tmdb and with collectives. I did the following:

• removed @nextcloud/vue-richtext from dependencies (completely gone from package-lock.json)
• upgraded to latest @nextcloud/vue
• used import { registerWidget } from '@nextcloud/vue/dist/Components/NcRichText.js'
• compiled the app
• tested using the smart picker and select elements found by the widget provided by collectives/integration_tmdb app

Anything I'm missing? 🤔

[julien-nc]

I've tried it with server stable26 and master in Talk and Text: not working.
I'm using npm v8.15.0 and node v16.17.0.
Weird indeed. What could be different between our contexts?

[juliusknorr]

Just sharing the screenshot I took when checking this a bit with @julien-nc

It was util -> console-browserify -> assert trying to call this

My first thought was that https://www.npmjs.com/package/node-polyfill-webpack-plugin was missing but adding didn't make any difference.

[juliusknorr]

Also worth to mention that this doesn't happen in server with nextcloud/server#33755