diff --git a/src/__tests__/__snapshots__/main-test.ts.snap b/src/__tests__/__snapshots__/main-test.ts.snap index 99041fe6d4f..01fdcf44668 100644 --- a/src/__tests__/__snapshots__/main-test.ts.snap +++ b/src/__tests__/__snapshots__/main-test.ts.snap @@ -1801,6 +1801,24 @@ Object { } `; +exports[`main fixtures processes component "component_41.tsx" without errors 1`] = ` +Object { + "description": "", + "displayName": "MyComponent", + "methods": Array [], + "props": Object { + "value": Object { + "description": "String value of a number", + "required": false, + "tsType": Object { + "name": "STRING_VALS[number]", + "raw": "typeof STRING_VALS[number]", + }, + }, + }, +} +`; + exports[`main fixtures processes component "flow-export-type.js" without errors 1`] = ` Object { "description": "This is a Flow class component", diff --git a/src/__tests__/fixtures/component_41.tsx b/src/__tests__/fixtures/component_41.tsx new file mode 100644 index 00000000000..ecdac2609ea --- /dev/null +++ b/src/__tests__/fixtures/component_41.tsx @@ -0,0 +1,24 @@ +import React from 'react'; + +export const STRING_VALS = [ + 'one', + 'two', + 'three' +]; + +interface IProps { + /** + * String value of a number + */ + value?: typeof STRING_VALS[number]; +} + +const MyComponent = (props: IProps) => { + return ( +
+ {props.value} +
+ ); +} + +export default MyComponent; diff --git a/src/utils/__tests__/getTSType-test.ts b/src/utils/__tests__/getTSType-test.ts index 8b239bca3c9..887e0cc397f 100644 --- a/src/utils/__tests__/getTSType-test.ts +++ b/src/utils/__tests__/getTSType-test.ts @@ -753,6 +753,26 @@ describe('getTSType', () => { }); }); + it('resolves indexed access of array', () => { + const typePath = statement(` + var x: typeof STRING_VALS[number]; + + const STRING_VALS = [ + 'one', + 'two', + 'three' + ]; + `) + .get('declarations', 0) + .get('id') + .get('typeAnnotation') + .get('typeAnnotation'); + expect(getTSType(typePath, null, noopImporter)).toEqual({ + name: 'STRING_VALS[number]', + raw: 'typeof STRING_VALS[number]', + }); + }); + it('can resolve indexed access to imported type', () => { const typePath = statement(` var x: A["x"] = 2; diff --git a/src/utils/getTSType.ts b/src/utils/getTSType.ts index bb24791d285..d3856661782 100644 --- a/src/utils/getTSType.ts +++ b/src/utils/getTSType.ts @@ -391,12 +391,14 @@ function handleTSIndexedAccessType( // We only get the signature if the objectType is a type (vs interface) if (!objectType.signature) return { - name: `${objectType.name}[${indexType.value.toString()}]`, + name: `${objectType.name}[${ + indexType.value ? indexType.value.toString() : indexType.name + }]`, raw: printValue(path), }; const resolvedType = objectType.signature.properties.find(p => { // indexType.value = "'foo'" - return p.key === indexType.value.replace(/['"]+/g, ''); + return indexType.value && p.key === indexType.value.replace(/['"]+/g, ''); }); if (!resolvedType) { return { name: 'unknown' };