[jsx-wrap-multiline] fix: check for nested JSX expressions (#240)

palantir · Jul 24, 2019 · 6f907b5 · 6f907b5
1 parent e8f4d0f
commit 6f907b5
Show file tree

Hide file tree

Showing 2 changed files with 66 additions and 10 deletions.
diff --git a/src/rules/jsxWrapMultilineRule.ts b/src/rules/jsxWrapMultilineRule.ts
@@ -51,9 +51,8 @@ class JsxWrapMultilineWalker extends Lint.AbstractWalker<void> {
         const cb = (node: ts.Node): void => {
             if (isJsxElement(node) || isJsxSelfClosingElement(node) || isJsxFragment(node)) {
                 this.checkNode(node, sourceFile);
-            } else {
-                return ts.forEachChild(node, cb);
             }
+            return ts.forEachChild(node, cb);
         };
 
         return ts.forEachChild(sourceFile, cb);

diff --git a/test/rules/jsx-wrap-multiline/test.tsx.lint b/test/rules/jsx-wrap-multiline/test.tsx.lint
@@ -21,7 +21,7 @@ const badMultiline = <div
     {children}
 ~~~~~~~~~~~~~~~
 </div>;
-~~~~~~   [Multiline JSX elements must be wrapped in parentheses]
+~~~~~~   [FAILURE_NOT_WRAPPED]
 
 const goodSelfClosingMultiline = (
     <div
@@ -37,18 +37,18 @@ const badSelfClosingMultiline = <div
     tabIndex={-1}
 ~~~~~~~~~~~~~~~~~~
 />;
-~~   [Multiline JSX elements must be wrapped in parentheses]
+~~   [FAILURE_NOT_WRAPPED]
 
 const badWrappedWithoutNewLines = (<div
-                                  ~      [New line required after open parenthesis when wrapping multiline JSX elements]
+                                  ~      [FAILURE_MISSING_NEW_LINE_AFTER_OPEN]
     className="my-class"
 >
     {children}
 </div>);
-      ~   [New line required before close parenthesis when wrapping multiline JSX elements]
+      ~   [FAILURE_MISSING_NEW_LINE_BEFORE_CLOSE]
 
 const badWrappedWithoutNewLineAtOpen = (<div
-                                       ~      [New line required after open parenthesis when wrapping multiline JSX elements]
+                                       ~      [FAILURE_MISSING_NEW_LINE_AFTER_OPEN]
     className="my-class"
 >
     {children}
@@ -61,7 +61,7 @@ const badWrappedWithoutNewLineAtClose = (
     >
         {children}
     </div>);
-          ~   [New line required before close parenthesis when wrapping multiline JSX elements]
+          ~   [FAILURE_MISSING_NEW_LINE_BEFORE_CLOSE]
 
 const goodSingleLineWrappedWithoutNewLines = (<div className="my-class">{children}</div>);
 
@@ -82,7 +82,7 @@ const badNestedElements = <div>
     />
 ~~~~~~~
 </div>;
-~~~~~~  [Multiline JSX elements must be wrapped in parentheses]
+~~~~~~  [FAILURE_NOT_WRAPPED]
 
 const goodFunctionWrap = mount<ITestComponentProps, {}>(
     <TestComponent
@@ -116,7 +116,7 @@ const badMultilineWithFragments = <>
     </div>
 ~~~~~~~~~~~
 </>;
-~~~   [Multiline JSX elements must be wrapped in parentheses]
+~~~   [FAILURE_NOT_WRAPPED]
 
 shallowRender(
     <TestComponent2 />
@@ -127,3 +127,60 @@ shallowRender(
         <span />
     </TestComponent3>
 );
+
+const myCondition = true;
+const component = () => (
+    <div>
+        Some Text
+
+        {myCondition && <div>
+                        ~~~~~
+            Some Text.
+~~~~~~~~~~~~~~~~~~~~~~
+        </div>}
+~~~~~~~~~~~~~~ [FAILURE_NOT_WRAPPED]
+
+        {myCondition && (<div>
+                        ~ [FAILURE_MISSING_NEW_LINE_AFTER_OPEN]
+            Some Text.
+        </div>)}
+              ~ [FAILURE_MISSING_NEW_LINE_BEFORE_CLOSE]
+
+        {myCondition && (
+            <div>
+                Some Text.
+            </div>
+        )}
+
+        {myCondition
+            ? <div>
+              ~~~~~
+                Some Text.
+~~~~~~~~~~~~~~~~~~~~~~~~~~
+            </div>
+~~~~~~~~~~~~~~~~~~ [FAILURE_NOT_WRAPPED]
+            : <div>
+              ~~~~~
+                Some Text.
+~~~~~~~~~~~~~~~~~~~~~~~~~~
+            </div>
+~~~~~~~~~~~~~~~~~~ [FAILURE_NOT_WRAPPED]
+        }
+
+        {myCondition
+            ? (
+                <div>
+                    Some Text.
+                </div>
+            ) : (
+                <div>
+                    Some Text.
+                </div>
+            )
+        }
+    </div>
+);
+
+[FAILURE_NOT_WRAPPED]: Multiline JSX elements must be wrapped in parentheses
+[FAILURE_MISSING_NEW_LINE_AFTER_OPEN]: New line required after open parenthesis when wrapping multiline JSX elements
+[FAILURE_MISSING_NEW_LINE_BEFORE_CLOSE]: New line required before close parenthesis when wrapping multiline JSX elements