Vuetify 3 and Altcha

[lenn1]

Hi,

i got your example working with Vue3 and a Java Spring Backend. No Problems.

We use Vuetify3 as our Frontend Components Library and if i try to use Altcha with that nothing will render. In my Browser Console following Error pops up:

index.ts:17 [Vue warn]: Component is missing template or render function: <!----> at <Anonymous ref="altchaWidget" style= {--altcha-max-width: '50%'} debug="" ... > at <Altcha payload="" onUpdate:payload=fn > at <VContainer class="fill-height" > at <HelloWorld> at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< Proxy(Object) {__v_skip: true} > > at <RouterView> at <VMain> at <VApp> at <App>

Steps to reproduce:

• npm create vuetify@latest.
• npm install altcha --save
• Add the given Altcha.vue and the code to call it in the HelloWorld.vue.
• npm run dev
• open browser: localhost:3000
• see browser console.

[ovx]

Hi, sorry for the late reply. I believe it's an issue with configuration, in vite you have to enable support for web components (https://github.com/altcha-org/altcha-starter-vue-ts/blob/main/vite.config.ts, isCustomComponent), there should be something similar for vuetify.