Subscribe on changes!

Type guard not working on v-else

avatar
May 30th 2023

Vue version

3.3.4

Link to minimal reproduction

https://play.vuejs.org/#eNp9U12O2jAQvsrUfWCRIHnYvjQK1a62B6gqpD4QHgwMwSWxLduhi2ju0Bv0DH3puXqEjh0nm6UqD4jMzzfzzTfjC3vUOjk1yDKW260R2oFF12iouCwXBXO2YB8KCSBqrYyDCxjcQwt7o2qYEHAyCj6pWsdIknrDV6YEn+LOGuGjKmFBNSSvMQPrjJDlLIQymOxUOZnBgdslF1UGG6Uq5BLaAf3E3f/RW+4IXYkT2gxkU2/QjKCPUtS8IrRn8N1X8iH/2zdy64SSICx573hIzCJgmkHnoGhof/EQIA1cYyTEbOAhOE1Cd3izWEAjd7gXEnc+P9Dwv62S1sWKxLLrsVoTrVVXt5+tYJ/xuWD9cAUjbbw5iONMg9DOrlFfDsIe0dDOXqAkjDejMu87NutC5mm3b9ouGQ5rXXGHYdd5WGQWidIVxK94CpTQp8PbLjTkDClE6xJHTTw9aEPjgLaa9nqaiz3BxrJPCf3n549fI2gnadsSWwINtfsSWFn0kN8jSBTpGpSnr2cMB0qfIz+bsf5qb70HKFGiEVsyl3HebtufjNL2Lt7Iy5qN4Wd/Iz68pK3ky9U6oNrpjTUULm+qnnslaNi9MtQyajUDQTf2PKW/vhUxy4549qL60GgVua2UC1cyWhRV3FDi2JMOWlUiqhQ4vNaoe+3zmuvkq1WSpAojU9sQIB5Z/1AKRlp6u2AH57TN0rSR+lgmW1WnDxRLTSOdqHG+U/XDfXKfvEt3wrqxO0FbzzdGfbNoqCEd86h2Ss4TmrlBGtmgudnrKnfc7yr0T8/4jlvW/gWc3r0o

Steps to reproduce

  1. create a type with union types (A and B)
  2. create a type guard to check if the union type is of type A
  3. in a scoped slot use the type guard in a v-if
  4. add a v-else

What is expected?

in both v-if and v-else I expect Typescript to detect types A and B respectively

What is actually happening?

type A is correctly detected on v-if, but type B isn't on v-else and I get the union type instead

System Info

No response

Any additional comments?

I created a reproducible code, however I didn't know how to show the problem by hovering the "animal" in the v-else as the Vue Playground doesn't show Typescript errors, but I get it in VSCode

avatar
May 30th 2023

nevermind, it was my bad