microsoft / microsoft/TypeScript
Template decorators.
Nobody has claimed this yet.
- Dominant language
- Go
- Stars
- 111k
- Forks
- 14.3k
- Avg merge
- 2d 4h
- Merged PRs (30d)
- 132
Description
TypeScript Version: 3.7.5
Search Terms: Decorators, Templates
I know decorators a experimental feature, so this issue is just to push it closer to production ready status.
Notice, I tried typescript version 3.8 beta in the playground.
For local check with tsc only two following flags are essential: "--experimentalDecorators --strict".
It seems like typescript cant pass complex props type. Instead of passing A | B, it just pass A. Using a more simple type A will not produce any errors.
Code
import { Component, ComponentClass } from "react"
const components = new Set<ComponentClass<any, any>>()
function dec<P, S>(component: ComponentClass<P, S>)
{
components.add(component)
}
type Props = { x: number } & ( { y: number } | { z: number } )
@dec
class C extends Component<Props>
{
}
Expected behavior:
Everything works.
Actual behavior:
Following error:
Argument of type 'typeof C' is not assignable to parameter of type 'ComponentClass<{ x: number; } & { y: number; }, {}>'.
Construct signature return types 'C' and 'Component<{ x: number; } & { y: number; }, {}, any>' are incompatible.
The types of 'props' are incompatible between these types.
Type '(Readonly<{ x: number; } & { y: number; }> & Readonly<{ children?: ReactNode; }>) | (Readonly<{ x: number; } & { z: number; }> & Readonly<{ children?: ReactNode; }>)' is not assignable to type 'Readonly<{ x: number; } & { y: number; }> & Readonly<{ children?: ReactNode; }>'.
Type 'Readonly<{ x: number; } & { z: number; }> & Readonly<{ children?: ReactNode; }>' is not assignable to type 'Readonly<{ x: number; } & { y: number; }> & Readonly<{ children?: ReactNode; }>'.
Property 'y' is missing in type 'Readonly<{ x: number; } & { z: number; }> & Readonly<{ children?: ReactNode; }>' but required in type 'Readonly<{ x: number; } & { y: number; }>'.(2345)
Related Issues:
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Reproduce the provided example with tsc using --experimentalDecorators and --strict, then compare it with the linked TypeScript Playground using the 3.8 beta. Start from decorator type checking and the ComponentClass generic in the example. Done means determining whether the reported 2345 diagnostic is incorrect for the union props case and validating the expected behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- compilers
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100