vuejs / language-tools

⚡ High-performance Vue language tooling based-on Volar.js
https://marketplace.visualstudio.com/items?itemName=Vue.volar
MIT License
5.56k stars 373 forks source link

fix: hint not working with slash in slot name #4478

Open KermanX opened 1 week ago

KermanX commented 1 week ago

WIP. Want to fix #3819.

The related TypeScript issue (https://github.com/microsoft/TypeScript/issues/58908) indicates that this TypeScript behavior might not be fixed in a short time on TypeScriript's side. So this PR means to solve this on Volar's side.

Previously, the virtual code for

<Comp> <template #a-b="s" /> <Comp>

was

__VLS_elementAsFunction(__VLS_intrinsicElements.template, __VLS_intrinsicElements.template)({});
{
const [s] = __VLS_getSlotParams((__VLS_4.slots!)["a-b"]);
}

Now, is should be

__VLS_elementAsFunction(__VLS_intrinsicElements.template, __VLS_intrinsicElements.template)({});
{
const {["a-b"]:__VLS_thisSlot} = __VLS_4.slots!;
//        ^T1
const [s] = __VLS_getSlotParams(__VLS_thisSlot);
}

The information should be provided by T1.

However, because I am new to Volar, I can't figure out how to make this work correctly. The generated virtual code is OK now, but the hint for #a-b still doesn't show (If a-b is not a defined slot). This is quite strange.