microsoft / TypeScript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
https://www.typescriptlang.org
Apache License 2.0
100.47k stars 12.42k forks source link

Incorrect type handing/reduction #58591

Open phistuck opened 4 months ago

phistuck commented 4 months ago

🔎 Search Terms

withTranslation, reduxForm, IntrinsicAttributes

🕗 Version & Regression Information

⏯ Playground Link

https://www.typescriptlang.org/play/?#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wG4AoUSWOAbziIBMBXADwDFoQAaOASQB2AKyQYkjTlBAAFHGADOcAL5xsuAkzYBaTFzKVw0ePQDuwGAAsAKlBQD5AGxQxgEAbwDq567ftOXbsqqOHiExDBawACMABwCSKww+uQwAJ5gSHBWshAKcAC8dHBgAFxwAswgAEZIUMoUaRlZkiDswEgOjIqF9ADWAPxlFdW19SnpmVYAgg4OOXmF2XKKAGRwXpY2do7OrgINE1lWBVkzc8twa4IiYhJc8-IAPFYtbR1dvNOzDwB8FORoNzyeAAcROAAppGUrFYAJQFH5wR6gADmcBQDhg+VoAGUYFBgAIUZCAHRgWEqAD0fwBQNBLXEJ00HC4z1e7U68k+Z1+4PouikZXwmHwylh4JBsIogPs9K4JzMm18OwCAnB4pBDMYUvI5AS1HgMuBcHYEPh+URj018rA2KiVL+QA

💻 Code

import React from 'react';
import { reduxForm, InjectedFormProps } from 'redux-form';
import { withTranslation, WithTranslation } from 'react-i18next';

type TProps = { p: number };
type TFormFields = { k?: number };
type TAllProps = TProps & WithTranslation;
type TT = TAllProps & InjectedFormProps<TFormFields, TAllProps>;

const G = (P: TT) => <img alt={String(P.p)} />;
const GFormed = reduxForm<TFormFields, TAllProps>({ form: 'f' })(G);
const GForm = withTranslation()(GFormed);

export const F = () => <GForm p={1} />;

🙁 Actual behavior

It complains about the last line, about p={1} -

Type '{ p: number; }' is not assignable to type 'IntrinsicAttributes & Omit<Subtract<DecoratedFormProps<TFormFields, TAllProps, string> | undefined, WithTranslationProps>, keyof WithTranslation<...>> & WithTranslationProps'. Property 'p' does not exist on type 'IntrinsicAttributes & Omit<Subtract<DecoratedFormProps<TFormFields, TAllProps, string> | undefined, WithTranslationProps>, keyof WithTranslation<...>> & WithTranslationProps'.

It is wrong or non-sensical, as all of those types I used add or omit their high-order-component types from the type I pass, so ComponentType<TProps> should end up being the type of GForm, but it is not

🙂 Expected behavior

No type errors

Additional information about the issue

No response

phistuck commented 4 months ago

Changing the const GForm = line to const GForm = withTranslation()(GFormed) as ComponentType<TProps>; silences the error

RyanCavanaugh commented 4 months ago

This might be an issue with the types in one of those dependencies. Please provide a reduced (isolated) repro -- it's really not possible to look at that target type (as a human) and assess if something about this is wrong or not.

phistuck commented 4 months ago

I hopefully managed to reduce it further, is this more debuggable? https://www.typescriptlang.org/play/?#code/JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wG4Aoc0SWOAbzgGFdIA7JVmAGiZYnc4AVAJ5gkcAL5xsuOACIi6GHIrkAJkjQAbFETjBOSKJnTiAkqwBWmmEjUAxaCAAKOMAGd65OD+lOAIprQKDDA-PbASFpqAFz0EuQJ6po6ega2xqZwjlAgFu4wKKxoSAA8zgB8cEgAHrasap7M4PwcMOVVdN6+mE75hcVIcXQJScnauuIwouKBaMG2Dk4AyoW2cAC8Xr5+uXMLYawRUbHxiaoaE3rTYnD7UCF2OS5u7uWb8VUb3T4AZHDOH5wf7OXShFBaUr3R5LXKrR4VC4pSb6QyZEp3IIPRbNNhtRg6dxvSrbXzsADuAAowK8APxxZw8eaGOr0uBFYQASjiz36RRKHQoSUuqSmM2yASxIWgHQ+lKB8xaAhgcVxrSEM3e-ws1gwTycrggHgqXHInM2VWhOL4yoJKCJUKli2eho8HURlBFKMwAFdiqF+HAiGofTVnu8tiMKvLuRK9k6ZZVVFQWrQbuIuj5gABGAAcrFNPkE9j9GEOpqkMjw+Bz+dqMDIlHGotRGRMGIA6sAYAALQQPVjuHQB1iklVwYulkcULN51hxWusGdwGDIFBqYRxABGEAgWlQS8SnuRaTR7fEXd7-aKQ5Ch1dnkz+jnbMXy597iQyw-YkHSDZO57geQrHlc4i+v6hxwOS3Z9gOt4juQ8o+EaI7uGyT4+DBvbIJgAG7vuRTLhIpqxqU3SMNUdQcI0iDEDAAB0arKiIYilGuGBMTabQPqUHJVP8l5wTew73q8JrdMg7h7gAbnYD4fAAUssAAaDEADLAFuDxQMIACyRQoAA5nYACCMAwFAWk+rYbxAowha+AA8iA3bsfRXFKjxrylIwJpwAA1kgwgQJgcBCdeg6ifwD4VN0EnRt0ip4pwqqkRadFKJ5KUwKxZQuW5UmyfJrw8EFIVhRF8HRawAnhbBkUIWJRruB6TaUOmE4KZGcBgHErA+iAW5GJIFCdYIplaFo3Vda8wL1Ve1V3vwY3ioIggfBNU0KdqVg2PquQPqozIFHAADicrOHE63mhsnQnUBDFaBARmUqsVmsK9zgMWAnKcqQQZIDAPpQKOA1TQDCQnfAZ3PHYHzBqG4ZbdN4mUpylJnf95DQ+dzwfNhwlRctrDo5jcNqNj5C1DQ8C4-Ycq3VUpSw04vUbHQ2ZSAA9IiQA