Fix depth of JSX siblings in a JSXEpressionContainer

Resolves #1762
jsx-eslint · Jun 14, 2018 · f53e781 · f53e781
1 parent c82746c
commit f53e781
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 1 deletion.
diff --git a/lib/rules/jsx-max-depth.js b/lib/rules/jsx-max-depth.js
@@ -103,12 +103,12 @@ module.exports = {
     }
 
     function checkDescendant(baseDepth, children) {
+      baseDepth++;
       children.forEach(node => {
         if (!hasJSX(node)) {
           return;
         }
 
-        baseDepth++;
         if (baseDepth > maxDepth) {
           report(node, baseDepth);
         } else if (!isLeaf(node)) {

diff --git a/tests/lib/rules/jsx-max-depth.js b/tests/lib/rules/jsx-max-depth.js
@@ -61,6 +61,19 @@ ruleTester.run('jsx-max-depth', rule, {
   }, {
     code: 'const foo = (x) => <div><em>{x}</em></div>;',
     options: [{max: 2}]
+  }, {
+    code: `
+      const x = (
+        <tr>
+          <td>1</td>
+          <td>2</td>
+        </tr>
+      );
+      <tbody>
+        {x}
+      </tbody>
+    `,
+    options: [{max: 2}]
   }],
 
   invalid: [{
@@ -122,5 +135,22 @@ ruleTester.run('jsx-max-depth', rule, {
       '</div>'
     ].join('\n'),
     errors: [{message: 'Expected the depth of nested jsx elements to be <= 2, but found 3.'}]
+  }, {
+    code: `
+      const x = (
+        <tr>
+          <td>1</td>
+          <td>2</td>
+        </tr>
+      );
+      <tbody>
+        {x}
+      </tbody>
+    `,
+    options: [{max: 1}],
+    errors: [
+      {message: 'Expected the depth of nested jsx elements to be <= 1, but found 2.'},
+      {message: 'Expected the depth of nested jsx elements to be <= 1, but found 2.'}
+    ]
   }]
 });