Typescript conditional checks seem to fail on v-for (vite, vue-ts, vue-tsc)

[waldi]

When checking for a variable being null using v-if, the check does not seem to follow through to v-for elements.

Error:

Type 'string | null' is not assignable to type 'string'.
  Type 'null' is not assignable to type 'string'.ts(2322)
HelloWorld.vue(1, 1): The expected type comes from property 'foo' which is declared here on type 'IntrinsicAttributes & Partial<{}> & Omit<Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{ msg: string; foo: string; }>>> & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>'

Example Code:

App.vue

<script setup lang="ts">
import { ref } from "vue";
import HelloWorld from "./components/HelloWorld.vue";

const msgs = ["Msg 01", "Msg 02", "Msg 03"];

const foo = ref<string | null>("Foo");
</script>

<template>
  <template v-if="foo">
    <HelloWorld v-for="msg in msgs" :msg="msg" :foo="foo" />
  </template>
</template>

HelloWorld.vue

<script setup lang="ts">
import { ref } from "vue";

defineProps<{ msg: string; foo: string }>();

const count = ref(0);
</script>

<template>{{ msg }} - {{ foo }}</template>

<style scoped></style>

package.json

{
  "name": "vue-ts-bug",
  "private": true,
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "vue-tsc --noEmit && vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "vue": "^3.2.25"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^2.3.3",
    "typescript": "^4.5.4",
    "vite": "^2.9.9",
    "vue-tsc": "^0.34.7"
  }
}

[johnsoncodehk]

Thanks for the report! This is regression from v0.34.15, you could use v0.34.14 for now.