Regression in generic inference with JSX in v5.7+

🔎 Search Terms

tsx generic

🕗 Version & Regression Information

• This changed between versions 5.6.3 and 5.7.3

⏯ Playground Link

https://www.typescriptlang.org/play/?jsx=1&ts=5.8.3#code/JYWwDg9gTgLgBAbzgEwKYDNgDtUAUoRgDOcAhiQG4CuqAIhtngcXAL5zoEhwDk1qPANwAoYWgDGAG1JRUccRCxF4AYQjgAXImFw4OAO5wAPAH0TANQCiAJQAqNs7YDKjuKgAeMVFmQllUbABzOABeXh4APgAKAEotBB1dOAASMGYiLTRMHHxCIlMLG3trRxcTWwjE1hFWUSjEozVwPVIQVBCAInQICA7E3UUAOVb2hDkQiO0kpIB6GbgAARgiAFoPMFRxGDWoAig4GAALYD9DiCpJZD1UClR9w9IwDax+pOB0OCi5AEIQsJ5kMgeDEptM2K9WOwZpUYiJRMJBBwqFgtsBFHBbKhwNIvAAhbDIIIAMUGRlsbk83l8cH8QWiIISugUSnguRYYX49GyTDyRkZSSwIy0thE0yGQs+WGFIImcAoEGAyFFbHpol0shgVCgWEQKAYOXSWjZJHIBwAnhsIB9jeDqqJ1tB4DALXIsoxjWSKV4fH4YAEsIFJmFrKhNdrbC6jM7LR9MdjSHiCcTSRUIgBtAH6nnEHgAXSAA

💻 Code

import { defineProps as vueDefineProps } from 'vue';

declare const Comp: {
  new <__VERTER__TS__T extends string = ''>(): {
    $props: defineProps<__VERTER__TS__T>
  };
}

(
  <Comp name="foo"
    onName={e => {
      // @ts-expect-error this should never happen
      if (e !== 'dd') {
      }
    }} />
);



; function TemplateBindingFN<T extends string>() {
  const Props = vueDefineProps<{
    name: T;
    onName: (n: T) => void;
  }>()

  return { defineProps: Props as typeof Props }
};

export type defineProps<T extends string> = ReturnType<typeof TemplateBindingFN<T>>['defineProps']

🙁 Actual behavior

In later version the onName argument does not get the generic information resolved, defaulting to string, earlier versions 5.x infer e as 'foo'

🙂 Expected behavior

e should be implicitly inferred based on the generic passed in name

Additional information about the issue

It seems to be caused by the type mutation of DefineProps

export type DefineProps<T, BKeys extends keyof T> = Readonly<T> & {
  readonly [K in BKeys]-?: boolean
}

Commencez par la reproduction TypeScript Playground liée et comparez le comportement de l’inférence entre les versions 5.6.3 et 5.7.3, puis examinez la mutation de type Vue DefineProps référencée. La correction est terminée lorsque le paramètre du callback JSX est inféré comme la valeur générique littérale transmise via name plutôt que comme string, tout en maintenant la validité de la reproduction.