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' };