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

type of useTemplateRef on generic components only contains exposed functions #5120

Open
markbrockhoff opened this issue Jan 9, 2025 · 1 comment
Labels
bug Something isn't working good reproduction ✨ This issue provides a good reproduction, we will be able to investigate it first 🔨 p3-minor-bug

Comments

@markbrockhoff
Copy link

Vue - Official extension or vue-tsc version

2.2.0

VSCode version

1.96.2

Vue version

3.5.13

TypeScript version

5.7.3

System Info

No response

package.json dependencies

No response

Steps to reproduce

Hi, I noticed that the type of a template ref created on a generic component is different from normal components. I have a specific usecase where I need to access the underlying component of the template ref using $el on it. This works as expected for all components except if the component is generic. In this case the type of the template ref will only contain the functions exposed from the component using defineExpose.

I created a reproduction inside a newly created vue app: https://github.com/markbrockhoff/vue-bug-repros/blob/main/src/App.vue

Steps to reproduce:

  1. Clone the repo
  2. Install the dependencies (pnpm i)
  3. Run pnpm type-check to see the TS error when trying to access $el on the template ref
  4. Make the component components/Example.vue not generic by removing generic="T" from its script tag
  5. Run pnpm type-check again and see that the types are now as expected

What is expected?

I'd expect that the type for a template ref created on a generic component behaves the same was as when creating one. It should at least be of type HtmlElement & ExposedFunctions instead of just ExposedFunctions.

What is actually happening?

Only the functions exposed from the generic component using defineExpose are present inside the type of the template ref.

Link to minimal reproduction

https://github.com/markbrockhoff/vue-bug-repros/blob/main/src/App.vue

Any additional comments?

No response

@KazariEX KazariEX added bug Something isn't working good reproduction ✨ This issue provides a good reproduction, we will be able to investigate it first 🔨 p3-minor-bug and removed pending triage labels Jan 9, 2025
@KazariEX
Copy link
Collaborator

KazariEX commented Jan 9, 2025

Since generic components need to be treated as function components in terms of their types, they cannot be processed with defineComponent. It is currently challenging to access the properties and their types on ComponentPublicInstance.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working good reproduction ✨ This issue provides a good reproduction, we will be able to investigate it first 🔨 p3-minor-bug
Projects
None yet
Development

No branches or pull requests

2 participants