Merge pull request #1983 from alexzherdev/1982-destructuring-class-pr…

…operty [Fix] `destructuring-assignment`: handle nested props usage
jsx-eslint · Sep 14, 2018 · 60b5642 · 60b5642
2 parents f0e2e1e + 089d545
commit 60b5642
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 1 deletion.
diff --git a/lib/rules/destructuring-assignment.js b/lib/rules/destructuring-assignment.js
@@ -82,6 +82,17 @@ module.exports = {
       }
     }
 
+    function isInClassProperty(node) {
+      let curNode = node.parent;
+      while (curNode) {
+        if (curNode.type === 'ClassProperty') {
+          return true;
+        }
+        curNode = curNode.parent;
+      }
+      return false;
+    }
+
     function handleClassUsage(node) {
       // this.props.Aprop || this.context.aProp || this.state.aState
       const isPropUsed = (
@@ -92,7 +103,7 @@ module.exports = {
 
       if (
         isPropUsed && configuration === 'always' &&
-        !(ignoreClassFields && node.parent.type === 'ClassProperty')
+        !(ignoreClassFields && isInClassProperty(node))
       ) {
         context.report({
           node: node,

diff --git a/tests/lib/rules/destructuring-assignment.js b/tests/lib/rules/destructuring-assignment.js
@@ -173,6 +173,17 @@ ruleTester.run('destructuring-assignment', rule, {
     `,
     options: ['always', {ignoreClassFields: true}],
     parser: 'babel-eslint'
+  }, {
+    code: [
+      'class Input extends React.Component {',
+      '  id = `${this.props.name}`;',
+      '  render() {',
+      '    return <div />;',
+      '  }',
+      '}'
+    ].join('\n'),
+    options: ['always', {ignoreClassFields: true}],
+    parser: 'babel-eslint'
   }],
 
   invalid: [{