Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Wrong type for vue custom element #12789

Open
lejunyang opened this issue Jan 30, 2025 · 0 comments
Open

Wrong type for vue custom element #12789

lejunyang opened this issue Jan 30, 2025 · 0 comments

Comments

@lejunyang
Copy link

Vue version

3.5.13

Link to minimal reproduction

https://play.vuejs.org/#eNqNVd9v20YM/lcIYZgdwLNnb0+q4q3LvPVX2qB1+xLlQZZoV+3pTrg7uQ0C/+8lj5ItN3HaBwPy8SP5kfyOdxc9revxtsEojhKX27L24NA3NahMb87TyLs0mqe6rGpjPdxBgetS40XjvKkWCivUHnawtqaCAYUZ9KBGX5pGeyyOAE96iEVV+v/0CJ4tL1899d6Wq8ajG8FVs1JlfmVN7U76Ng6XWNUq8/gW1ydgF3hhqro1jSf8Z5wj18ugVOdGO0LR8ULB+UPFDe9SDVAzlRjCN0DlNjG8I7p6M5KTnAuN4XVTrdDy0S4YkOo7uDV1QWRjGG4zFYMO2DM4n9OnUsEp1buze7xmJ4hJbYL3tzXCYkvHl1lN+JDxGvkgBheY3sQCIPyOfsHjQ4M8gmQJ+NWjLtw+xpyCyHQSifUSSg2f8dasYUmhhm3s5fXLm1DD1pQFh553sf8NlCnDEeuEg8lgu5R3OyYsDQvpD6Z+RQxgVhq/wDCkZNV0EvxVSv6lHdSxoMh6lVlfZioJqed8cJAYMSZPnlW874gQ4WK4WakuMFeZRahM0SgUmUnKkhRu11mO8L8yq0zxUIwOZbRzH+T4W06ngxi4M9RBGV3IS+bqNpinPXsY/Hf2GdlPNLVN1CpT5v2kE6UIrQ22G3WsDnpsY3HFiYDpwgcw1y+yPIgS1e80hePbNySOA1ZiB5k+CJkOzg4QlvV9yIwhqd6vjqGMWjq9HlLyMd2eBs+6MiYTUkuNHkoP3sBKRC19acmzJwlWTR92zYmNtcaOgMQC2gQ3ursdfmz0+9ApIsxXNxDKFFof/n2XZPZ4ki52C/u52Dv6SCaynWk09Me3XQuDSlp9wd8yUdraFG8OOC7QZ6VKI7C4ptPqlj4n4tOJ7iecpve8Zo94kQTptCiKXoRZGyGZ9IhHI3pcSA3rcjP+5IymFyj0LI04RUlNeFP7ktSSRvsVmkaZUubLi3DmbYPt/iWfj5h/fuD8k/vKZ2l0ZdGh3WIa7W0+sxv0Yl68e01bp2eUm/6o8S06oxrmKLB/Gl0Q7R4usH0e3iK6kku34MXmuqKY6OGxSCNaKnzzT5V+oPvH+M9OGtTF3qv2g1dcnpGw9GRnhBXxV7cjeH0P5UERJK/CFtkti+ug287jRlwel2dRbtuFkjhlfKeliZwfa2L3DZYE3hA=

Steps to reproduce

  1. ref type of component is incorrect
    According to vue official guide, we should use typeof SomeComponent for GlobalComponents interface. But if we do so, the ref type is incorrect as it should be VueElement

Image

Also, the event parameter is wrong, it should be CustomEvent<number>

Image

  1. ReturnType of defineCustomElement is incorrect
    We can see events are included in the type, but similarly the event parameter is wrong. Also, having onXXX in type may lead to wrong usage like below (But it's needed for JSX, I'm not sure about this)
// expect error, but not
el1.value.onUpdate = (val) => alert(val)

Besides, the ReturnType doesn't include $props and $emit, which are needed for vue template type inference, so we can see there is no autocompletion for both props and events
I think VueElementConstructor should include that like in official guide does, so that we can directly use that type for GlobalComponents

What is expected?

Typescript should work well.
I think we can fix defineCustomElement, and use its return type for GlobalComponents instead of using typeof VueComponent, and then update the official doc

What is actually happening?

Not working well

System Info

Any additional comments?

No response

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant