vuejs / core

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
https://vuejs.org/
MIT License
47.76k stars 8.35k forks source link

PropType with Interface with all optional properties leads to unknown type #11272

Closed Cherry closed 2 months ago

Cherry commented 4 months ago

Vue version

3.4.31

Link to minimal reproduction

https://play.vuejs.org/#eNqNVMtu2zAQ/JUFL04A10KbnhTFQVvkkB7qIM1RQKHHyqYjkSxJOW4N/3t3KVl+pHkYBkzuLoczu0NvxBdjJqsWRSwSV1hpPDj0rYE6U/OrVHiXimmqZGO09fBNNwYqqxsYTSLe8NHRZaqGig1YrGDbF3GWk4VWzoP02MAVF5xtUgVQaR2Dty2OeZdnNoZPqdqeB7wk6ujQ5bShk6bOPNIOIOGbeQGw+pBLVcaMTGT5JxVHGe0XaG9P09MksCe0JDqAFmPSS1wrOZ8snVbUlEA0FQVVyxrtzHhJWlIRQ8hwLqtr/fQ9xAYx4cwCi8f/xJduzbFU3Fl0aFeYiiHnMztH36Vvfv7ANa2HZKPLtqbqV5L36HTdMseu7GurSqJ9UBfY3oZhSTV/cDdrj8rtRDFRrtyG+lTQALlRL0nf072YfA7naH7UxZ013nAVQO8a/8cgWefOavPAy0P/kBuGug14fX/ir+AWqlAebZUVCDztHUWy2HUMudY1ZiogsdH+Uky1TY42hIj0McJsZ5oDmPeidFY3pMSR10uspELW5TrP0zWEO7QQgvQYZvkSCw+ZG3qQ8P3TfmxAj+Z3Ky2WR17qpgQwmPw9uIO4t8CDqO4x7mT1LzgM4SxoHMOIg6PzS4iibo6VtuAX0gF9W/Wo9JO63kMMXJ/hDJkeLG97YxwCko1e/28o5SosaGlsF+NP351NJ2EbxFFJtK85Kg9N2h/ak35+Mom6K0//SX6t0PK7ojdAj2Ny8VFs/wEOa8gQ

Steps to reproduce

What is expected?

The type for item on line 26 should be the Item interface defined on line 5.

What is actually happening?

The type for item is returning unknown.

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (16) x64 AMD Ryzen 7 3700X 8-Core Processor
    Memory: 10.01 GB / 31.91 GB
  Binaries:
    Node: 20.15.0 - C:\Program Files\nodejs\node.EXE
    npm: 10.8.1 - C:\Program Files\nodejs\npm.CMD
    pnpm: 9.1.2 - C:\Program Files\nodejs\pnpm.CMD
  Browsers:
    Edge: Chromium (126.0.2592.81)
    Internet Explorer: 11.0.22621.3527
  npmPackages:
    vue: 3.4.31 => 3.4.31

Any additional comments?

It seems that whenever an Interface/type contains only optional properties, the type that's inferred is always unknown.

jh-leong commented 4 months ago

as a workaround use defineProps<Props>(): playground

jh-leong commented 4 months ago

FYI: This doesn't seem to be a Vue type issue, ref TypeScript playground

yyx990803 commented 4 months ago

This seems to only happen in the playground, maybe due to outdated Volar used?

I can't reproduce this locally in VSCode either.

Cherry commented 4 months ago

That's very interesting, thank you for taking a look.

With a fresh npm create vue@latest project, I'm also unable to reproduce this. But in a project at work, I still am able to when using vue@3.4.31, @vue/language-core@2.0.26 and VSCode extension vue.volar at v2.0.26 within VSCode, all latest versions.

I didn't think to test this way since I was able to repro quickly in the playground. Let me see if I can do some more digging and get back to you.

yyx990803 commented 2 months ago

Closing as a duplicate of #11733 - neither can be reproduced on my end so let's keep only one open.

danielroe commented 2 months ago

Here's a minimal reproduction (just vue + vue-tsc) showing the issue:

https://stackblitz.com/edit/stackblitz-starters-zu6gov

To be clear, this issue is only reproducible with strict: false. It's not reproducible on the SFC playground for some reason, even when updating tsconfig.json.