Attribute 'is' is not working as described in documentation

[Dalisra]

Version

3.1.1

Reproduction link

https://codepen.io/GuruVytautas/pen/WNpgZmL

Steps to reproduce

If following codepen uses vue version 3.0.11 labels are beeing displayed correctly

https://codepen.io/GuruVytautas/pen/WNpgZmL

However if you change version to latest or starting from 3.1.0 "is" attribute will replace the current component instead of beeing sent as property to the component.

Documentation: https://v3.vuejs.org/api/special-attributes.html#is

What is expected?

Custom component should be rendered with "is" attribute sent inn as property.

What is actually happening?

Custom component is beeing replaced with what is defined in "is" attribute.

---

Not sure if documentation is outdated and it is working as intented, or some changes in 3.1.0 triggered a bug.
Release notes: https://github.com/vuejs/vue-next/releases/tag/v3.1.0

[posva]

I would say this is expected as is is a special attribute and shall not be used as a prop. Otherwise it would still not work with a dynamic is

[LinusBorg]

I disagree. There's been an explicit change in Vue 3 that you can only use is in combination with <component>, so that user-defined components can use is as an attribute name.

The behaviour in 3.1 is a side effect of the changes introduced for the compat build, as in Vue 2, is could be used without <component> as well. In that code, it's explicit that the intention is to only allow this during compat mode, but it has found its way into the normal mode as well:

https://github.com/vuejs/vue-next/blob/b228abb72fcdb4fc9dced907f3614abcaaacdce5/packages/compiler-core/src/parse.ts#L611-L621

The problem is, I assume, that we lack a __COMPAT__ check here: nope, wrong place apparently

https://github.com/vuejs/vue-next/blob/b228abb72fcdb4fc9dced907f3614abcaaacdce5/packages/compiler-core/src/transforms/transformElement.ts#L246-L251