microsoft / microsoft/TypeScript
Declaration emit inlines types incorrectly
Nobody has claimed this yet.
- Dominant language
- Go
- Stars
- 111k
- Forks
- 14.4k
- Avg merge
- 1d 19h
- Merged PRs (30d)
- 117
Description
🔎 Search Terms
declaration emit inline
🕗 Version & Regression Information
I was unable to test this prior to 4.4 since React types are no longer compatible with that version.
⏯ Playground Link
No response
💻 Code
import * as React from "react";
export class Component extends React.Component<{ children: React.ReactNode }> {
render() {
if (Math.random()) {
return <div>{this.props.children}</div>;
} else {
return this.props.children;
}
}
}
Full repro: https://github.com/eps1lon/ts-module-auto-export/tree/bad-inline
🙁 Actual behavior
Return value from render() is not referencing React.ReactNode but inlines its (incomplete) union members:
import * as React from "react";
export declare class Component extends React.Component<{
children: React.ReactNode;
}> {
render(): string | number | boolean | Iterable<React.ReactNode> | import("react/jsx-runtime").JSX.Element;
}
🙂 Expected behavior
Return type references the type alias. Inlining union members is incorrect (we may add or remove members or treat members as internal, local types) generally and here specially not even using all members.
export declare class Component extends React.Component<{
children: React.ReactNode;
}> {
render(): React.ReactNode | import("react/jsx-runtime").JSX.Element;
}
Additional information about the issue
The fact that it inlines the type here is a special case of https://github.com/microsoft/TypeScript/issues/37151. https://github.com/microsoft/TypeScript/issues/37151 is a more general since it's not always clear when inlining is correct or not. I'd be curious to know what would break if TS would not stop inlining in this special case.
But this issue is also broader since the inline is incomplete.
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
Start with the linked ts-module-auto-export bad-inline reproduction and inspect TypeScript's declaration emit output for Component.render. Compare the emitted return type with the expected React.ReactNode reference, then use issue #37151 to understand the related inlining behavior; done means the union is emitted completely and through the type alias as shown.
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
- 38/100