Fix issue with computed props for functional components (#132)

Fixes issue #131.

The issue was that props that didn't have any defaults were still evaluated (since the prop was indeed referenced) and received { value: propName, computed: 'true' } as defaultProp. I also found an issue that imported values were not properly recognised by defaultprops for stateless components.

Author: CompuIves

src/handlers/__tests__/defaultPropsHandler-test.js

@@ -185,5 +185,33 @@ describe('defaultPropsHandler', () => {
       `;
       test(parse(src).get('body', 0, 'expression'));
     });
+
+    it('should find prop default values that are imported variables', () => {
+      var src = `
+        import ImportedComponent from './ImportedComponent';
+
+        ({
+          foo = ImportedComponent,
+        }) => <div />
+      `;
+      defaultPropsHandler(documentation, parse(src).get('body', 1, 'expression'));
+
+      expect(documentation.descriptors).toEqual({
+        foo: {
+          defaultValue: {
+            value: 'ImportedComponent',
+            computed: true,
+          },
+        },
+      });
+    });
+
+    it('should work with no defaults', () => {
+      var src = `
+        ({ foo }) => <div />
+      `;
+      defaultPropsHandler(documentation, parse(src).get('body', 0, 'expression'));
+      expect(documentation.descriptors).toEqual({});
+    });
   });
 });

src/handlers/defaultPropsHandler.js

@@ -86,15 +86,19 @@ function getDefaultPropsPath(componentDefinition: NodePath): ?NodePath {
 
 function getDefaultValuesFromProps(
   properties: NodePath,
-  documentation: Documentation
+  documentation: Documentation,
+  isStatelessComponent: boolean,
 ) {
   properties
     .filter(propertyPath => types.Property.check(propertyPath.node))
+    // Don't evaluate property if component is functional and the node is not an AssignmentPattern
+    .filter(propertyPath => !isStatelessComponent || types.AssignmentPattern.check(propertyPath.get('value').node))
     .forEach(function(propertyPath) {
       var propDescriptor = documentation.getPropDescriptor(
         getPropertyName(propertyPath)
       );
-      var defaultValue = getDefaultValue(propertyPath.get('value'));
+      var value = isStatelessComponent ? propertyPath.get('value', 'right') : propertyPath.get('value');
+      var defaultValue = getDefaultValue(value, isStatelessComponent);
       if (defaultValue) {
         propDescriptor.defaultValue = defaultValue;
       }
@@ -105,17 +109,17 @@ export default function defaultPropsHandler(
   documentation: Documentation,
   componentDefinition: NodePath
 ) {
-
   var statelessProps = null;
   var defaultPropsPath = getDefaultPropsPath(componentDefinition);
   if (isStatelessComponent(componentDefinition)) {
     statelessProps = getStatelessPropsPath(componentDefinition);
   }
 
+  // Do both statelessProps and defaultProps if both are available so defaultProps can override
   if (statelessProps && types.ObjectPattern.check(statelessProps.node)) {
-    getDefaultValuesFromProps(statelessProps.get('properties'), documentation);
+    getDefaultValuesFromProps(statelessProps.get('properties'), documentation, true);
   }
   if (defaultPropsPath && types.ObjectExpression.check(defaultPropsPath.node)) {
-    getDefaultValuesFromProps(defaultPropsPath.get('properties'), documentation);
+    getDefaultValuesFromProps(defaultPropsPath.get('properties'), documentation, false);
   }
 }