Vue.js version 2 ignore customElement that extends form using is= syntax

Viewed 15

Vue.js version 2 is changing the original syntax of my native customElement and because of the change the browser will not render it on the page.

Expected html on the DOM <form is="esm-justification-form"></form>

Actual html on the DOM <esm-justification-form></esm-justification-form>

In my vue template:

<div v-if="isEsm">
  <form is="esm-justification-form"></form>
</div>

In my main app file, I have: Vue.config.ignoredElements = [/^esm-.*/]

In the browser where I register the component defineElement('esm-justification-form', justificationEle, 'form')

I've tested the regex expression outside of the app and it appears to be valid.

I could change from the 'is' syntax, but then 'this' would no longer be the form element. I have quite a few forms. I do not want to add extra code to select the form inside the component for events and such. There should be a way to prevent this.

0 Answers
Related