reactjs / reactjs/react-docgen
[TS] parse returns props without type field.
Open
Nobody has claimed this yet.
typescript
- Dominant language
- TypeScript
- Stars
- 3.8k
- Forks
- 316
- Avg merge
- 5h 7m
- Merged PRs (30d)
- 4
Description
the input code
import React from 'react';
import './button.css';
export interface ButtonProps {
/**
* Is this the principal call to action on the page?
*/
primary?: boolean;
/**
* What background color to use
*/
backgroundColor?: string;
/**
* How large should the button be?
*/
size?: 'small' | 'medium' | 'large';
/**
* Button contents
*/
label: string;
/**
* Optional click handler
*/
onClick?: () => void;
}
/**
* Primary UI component for user interaction
*/
export const Button: React.FC<ButtonProps> = ({
primary = false,
size = 'large',
backgroundColor,
label,
...props
}) => {
const mode = primary ? 'storybook-button--primary' : 'storybook-button--secondary';
return (
<button
type="button"
className={['storybook-button', `storybook-button--${size}`, mode].join(' ')}
style={{ backgroundColor }}
{...props}
>
{label}
</button>
);
};
the parse code
const rawReactDocs = parse(context.code, null, null, {
filename: context.fileName, //path.resolve(),
babelrc: false,
});
console.log("rawReactDocs", rawReactDocs)
const rawProps = rawReactDocs.props || {};
const props = Object.keys(rawProps)
.filter(name => name !== "children")
// .filter(name => rawProps[name].type || rawProps[name].tsType || rawProps[name].flowType)
.map(name => ({ name, value: rawProps[name] }));
console.log("props", props)

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 supplied TSX input through the parse(context.code, ...) entry point and inspect rawReactDocs.props, then compare the returned prop metadata with the expected type field. Trace why the parser output omits that field and add coverage showing the corrected metadata for this example.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- documentation, tooling
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100