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.

Sign up for GitHub

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

Jump to bottom

Slots type resolution is broken in 2.2.0 #5082

Open
daniluk4000 opened this issue Dec 24, 2024 · 8 comments · May be fixed by #5083
Open

Slots type resolution is broken in 2.2.0 #5082

daniluk4000 opened this issue Dec 24, 2024 · 8 comments · May be fixed by #5083
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

@daniluk4000
Copy link
Contributor

daniluk4000 commented Dec 24, 2024 •
edited
Loading

Vue - Official extension or vue-tsc version

2.2.0

VSCode version

Not using it

Vue version

3.5.13

TypeScript version

5.6.3

System Info

System:
    OS: Linux 5.15 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish)
    CPU: (16) x64 12th Gen Intel(R) Core(TM) i7-1260P
    Memory: 10.44 GB / 11.68 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 20.12.2 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/bin/yarn
    npm: 10.5.0 - /usr/local/bin/npm
    pnpm: 9.9.0 - ~/.local/share/pnpm/pnpm

package.json dependencies

{
  "dependencies": {
    "vue": "^3.5.13"
  },
  "devDependencies": {
    "@tsconfig/node22": "^22.0.0",
    "@types/node": "^22.9.3",
    "@vitejs/plugin-vue": "^5.2.1",
    "@vue/tsconfig": "^0.7.0",
    "npm-run-all2": "^7.0.1",
    "typescript": "~5.6.3",
    "vite": "^6.0.1",
    "vite-plugin-vue-devtools": "^7.6.5",
    "vue-tsc": "^2.1.10"
  }
}

Steps to reproduce

Try to use useSlots/check for slots in template

What is expected?

No error is thrown

What is actually happening?

This condition will always return true since this function is always defined. Did you mean to call it instead? error

Also, I wasn't able to reproduce it in hello world, but I also had "any" resolution for useSlots and $slots.

image

Also this is obviously not valid code but the error is weird

image

We always had slots type resolution error in OAPI with "this assigment will always return true" even though it's by documentation

image

But it seems like this time it got more broken than before

image

Link to minimal reproduction

https://github.com/daniluk4000/vue-volar-slots-bug

Any additional comments?

Only happening since 2.2.0. 2.1.10 produces correct errors (if we assume $slots check in OAPI should return this always true error)

image
@KazariEX
Copy link
Collaborator

Circular reference occurred, it would be better to use defineSlots.

@daniluk4000
Copy link
Contributor Author

daniluk4000 commented Dec 24, 2024 •
edited
Loading

Circular reference occurred, it would be better to use defineSlots.

use for what specificly?

  1. I use defineSlots in HelloWorld.vue in my reproduction and it still throws error
  2. If we use defineSlots instead of useSlots for checking in HelloWorld.vue it will still throw error
  3. AFAIK OAPI is still a supported syntax and this should work anyways + it got worse in 2.2.0

@KazariEX
Copy link
Collaborator

  1. Does this work on you end?

image

@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 Dec 24, 2024
@daniluk4000
Copy link
Contributor Author

  1. Does this work on you end?

Yep, good as workaround, didn't think of that solution before. Still believe should work as in 2.1.10 (IMO) since this is not per-Vue doc and a bit counterintuitive since slots should always be optional.

@KazariEX
Copy link
Collaborator

This might be a core issue since its type is not processed here, please feel free to open an issue to the core repository.

About OAPI it was a mistake I made, will fix it :)

@daniluk4000
Copy link
Contributor Author

Thanks! I'll try to review core types, also noticed they didn't have possible-undefined for useSlots/$slots in CAPI, but thought was something vue-tsc -related

@KazariEX KazariEX linked a pull request Dec 24, 2024 that will close this issue
Open
@ayrtonandino
Copy link

  1. Does this work on you end?

image

Similar issue, on vue-tsc 2.2.0 and typescript 5.7.2 i get error TS2774: This condition will always return true since this function is always defined. Did you mean to call it instead? on this line:

<div v-if="$slots.after">
   <slot name="label" />
</div>

Adding the ? to the type definition in defineSlots fixes it, but it should be optional by default

defineSlots<{
   label?: () => any
}>()

@timbze
Copy link

timbze commented Dec 26, 2024

Just for the info, started receiving same error in vue-tsc 2.2.0

Gives lint error:

const slots = useSlots()

Work-around that works:

const slots: SetupContext['slots'] = useSlots()

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
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
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(language-core): intersect __VLS_slots with __VLS_ctx.$slots KazariEX/vuejs-language-tools
4 participants
@daniluk4000 @timbze @ayrtonandino @KazariEX