Empty type name in warning when expected prop type is a custom class

[dotSILENT]

Vue version

3.2.45

Link to minimal reproduction

https://sfc.vuejs.org/#__DEV____SSR__eNp9UstO6zAQ/ZW53rRI1Na9FzZRi0CwYIPEoktvQjJtA/FDHqcFRfl3Jm5SoEA3iWbO8Zwzj1bceC+3DYpMzKkIlY9AGBt/pW1lvAsRWgi4gg5WwRmYMHVygB7ebuucaICkGmL5TB+cW2f8gdAHvRrD2hbOUoTKbvO6Kh+D88s3j7AAizu4yyNOz0bOT4xBazpZbiqCtUOCHdb1hB/N1b4T7oGDiMbXXI4jgPnmb/oD3DPZwc6FuvyTEDVAKUius4gUF1ocWdRCMXGuDoXFudg3OzO55+ad5Wm2qdYAkBYZpEyf4wH0sRabGD1lSjXWv6xl4Yy6ZkyFxsbK4Kx05vq//CcvLlVZUfycl0hm9hTcjjCwohbnn4orTm4xzALaEgOGk2JH3C+CR9g30V6z07bjAYyb/f2OTh7Lfs+eJ0y83xJXlcV+3jRNU+sXkY0VWPDUknVcMhvadl9O9m+loTV0bPXr1j4ssG18TTZZO2/qCEUyO5pOLpLJ0BTRhSkXPBs3GvkCk8IC+HsYSvcOOMAsfg==

Steps to reproduce

Juggle between passing the invalidPropType and validPropType to the component and observe the warning message

What is expected?

The warning message should contain the expected class' name

What is actually happening?

Warning message contains an empty string

System Info

No response

Any additional comments?

The issue comes from the getType function (

core/packages/runtime-core/src/componentProps.ts

Line 560 in 54b6ba3

const match = ctor && ctor.toString().match(/^\s*function (\w+)/)

) attempting to match the toString() result for a function keyword. This fails for classes since they return a class [NAME] {} when stringified. Couldn't we just use ctor.name here? It returns Object when passed an object, Array when passed an array etc, I don't know if it's widely supported though

[LinusBorg]

https://vuejs.org/guide/typescript/composition-api.html#syntax-limitations
Also see #4294

[dotSILENT]

This happens when TS is not used and this method of defining props with custom classes is even referenced in Vue's guide to prop validation: https://vuejs.org/guide/components/props.html#runtime-type-checks

[LinusBorg]

Already realized my mistake, sorry about that.

[LinusBorg]

This function returns an empty string for custom classes because MyClass.toString() does not match the regexp when using real native ES6 classes. Should be easy enough to extend this to also work for custom classes.

core/packages/runtime-core/src/componentProps.ts

Lines 559 to 562 in f3e4f03

	function getType(ctor: Prop<any>): string {
	const match = ctor && ctor.toString().match(/^\s*function (\w+)/)
	return match ? match[1] : ctor === null ? 'null' : ''
	}