microsoft / microsoft/TypeScript
Support for comments inside JSDoc @example comments
Nobody has claimed this yet.
- Dominant language
- Go
- Stars
- 111k
- Forks
- 14.3k
- Avg merge
- 1d 19h
- Merged PRs (30d)
- 117
Description
Suggestion
🔍 Search Terms:
comments inside jsdoc, jsdoc inception
✅ Viability Checklist
My suggestion meets these guidelines:
- This wouldn't be a breaking change in existing TypeScript/JavaScript code
- This wouldn't change the runtime behavior of existing JavaScript code
- This could be implemented without emitting different JS based on the types of the expressions
- This isn't a runtime feature (e.g. library functionality, non-ECMAScript syntax with JavaScript output, new syntax sugar for JS, etc.)
- This feature would agree with the rest of TypeScript's Design Goals.
⭐ Suggestion
I am writing a custom helper type that allows me to provide JSDoc comments for properties of any other object or interface that is inaccessible for changes.
I need to document the feature and usage, but I can't close a comment section inside JSDoc comment's.
Code:

/**
* This type allows to add JSDoc annotation to any type without causing conflicts.
*
* @example
* type IconButtonProps =
* & JSDoc
* & ShorthandVariantsAndSizes
*
* type JSDoc = Documentation<ShorthandVariantsAndSizes, {
* /**
* * **variant**: Color theme for the button.
* * - `light` variant is white on all themes.
* \*\/
* variant?: unknown // <- note: this `?: unknown` optional type is important
* }>
*/
type Documentation<T, TargetType extends { [K in keyof T]?: unknown }> = TargetType
JSDoc invoked:

💻 Use Cases
Desired:

Result:

📃 Motivating Example
const sizeKeys = ['small', 'large'] as const
// this is a mapped type and therefore doesn't allow to add JSDoc comments
type ExplodedSizes = { [key in typeof sizeKeys]?: unknown }
type JSDoc = Documentation<ExplodedSizes, {
/**
* **size**: Button size.
* - `64px`
*/
large?: unknown
/**
* **size**: Button size.
* - `32px`
*/
small?: unknown
}>
// this merges the jsdoc annotation with correct types
export type IconButtonProps =
& JSDoc
& ExplodedSizes
export const IconButton: React.FC<IconButtonProps> = (props) => <> </>
// later when using the component
const render = <IconButton /> // <- gets correct intellisense with JSDoc comments here

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
No source files or tests are named. Start by tracing how TypeScript handles JSDoc @example blocks and nested comment delimiters, then compare the shown input with the desired documentation rendering. Done means comments inside an @example block are preserved without changing existing JSDoc behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, typescript
- Domain
- compilers
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 25/100