Subscribe on changes!

Prop type conversion fails on custom element if attribute is not initialized on element

avatar
Nov 10th 2022

Vue version

3.2.44

Link to minimal reproduction

https://stackblitz.com/edit/vitejs-vite-8fqcef?file=src/components/MyCustomElement.ce.vue

Steps to reproduce

Click "Increment Page".

What is expected?

All "pages" and "page numbers" displayed on the page should be of type Number, and no warning should appear in console.

What is actually happening?

The custom element without attributes initialized does not convert the provided attribute values to Numbers. The following warnings appear in console:

[Vue warn]: Invalid prop: type check failed for prop "page". Expected Number with value 9, got String with value "9". 
  at <MyCustomElement title="Custom Element (do not init attrs)" pageNumber="9" page="9" >

[Vue warn]: Invalid prop: type check failed for prop "pageNumber". Expected Number with value 9, got String with value "9". 
  at <MyCustomElement title="Custom Element (do not init attrs)" pageNumber="9" page="9" >

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
Binaries:
    Node: 16.14.2 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 7.17.0 - /usr/local/bin/npm
npmPackages:
    vue: ^3.2.44 => 3.2.44

Any additional comments?

I ran into the same issue mentioned here, and after the fix was released in Vue v3.2.42, discovered type conversion still fails in the situation mentioned above.

avatar
Nov 11th 2022

fixed via 89f37ceb