handle certain cases in one pass

Author: TSMMark

lib/rules/jsx-one-element-per-line.js

@@ -23,6 +23,14 @@ module.exports = {
   create: function (context) {
     const sourceCode = context.getSourceCode();
 
+    function nodeKey (node) {
+      return `${node.loc.start.line},${node.loc.start.column}`;
+    }
+
+    function nodeDescriptor (n) {
+      return n.openingElement ? n.openingElement.name.name : sourceCode.getText(n).replace(/\n/g, '');
+    }
+
     return {
       JSXElement: function (node) {
         const children = node.children;
@@ -37,6 +45,7 @@ module.exports = {
         const closingElementStartLine = closingElement.loc.start.line;
 
         const childrenGroupedByLine = {};
+        const fixDetailsByNode = {};
 
         children.forEach(child => {
           let countNewLinesBeforeContent = 0;
@@ -105,28 +114,60 @@ module.exports = {
                 (child.type === 'Literal' && child.raw.match(/ $/)) ||
                 sourceCode.isSpaceBetweenTokens(child, nextChild);
             }
-            const leadingSpace = prevChild && spaceBetweenPrev() ? '\n{\' \'}' : '';
-            const trailingSpace = nextChild && spaceBetweenNext() ? '{\' \'}\n' : '';
-            const leadingNewLine = prevChild ? '\n' : '';
-            const trailingNewLine = nextChild ? '\n' : '';
 
             if (!prevChild && !nextChild) {
               return;
             }
 
             const source = sourceCode.getText(child);
+            const leadingSpace = !!(prevChild && spaceBetweenPrev());
+            const trailingSpace = !!(nextChild && spaceBetweenNext());
+            const leadingNewLine = !!(prevChild);
+            const trailingNewLine = !!(nextChild);
+
+            const key = nodeKey(child);
+
+            if (!fixDetailsByNode[key]) {
+              fixDetailsByNode[key] = {
+                node: child,
+                source: source,
+                descriptor: nodeDescriptor(child)
+              };
+            }
 
-            function nodeDescriptor (n) {
-              return n.openingElement ? n.openingElement.name.name : source.replace(/\n/g, '');
+            if (leadingSpace) {
+              fixDetailsByNode[key].leadingSpace = true;
+            }
+            if (leadingNewLine) {
+              fixDetailsByNode[key].leadingNewLine = true;
             }
+            if (trailingNewLine) {
+              fixDetailsByNode[key].trailingNewLine = true;
+            }
+            if (trailingSpace) {
+              fixDetailsByNode[key].trailingSpace = true;
+            }
+          });
+        });
 
-            context.report({
-              node: child,
-              message: `\`${nodeDescriptor(child)}\` must be placed on a new line`,
-              fix: function (fixer) {
-                return fixer.replaceText(child, `${leadingSpace}${leadingNewLine}${source}${trailingNewLine}${trailingSpace}`);
-              }
-            });
+        Object.keys(fixDetailsByNode).forEach(key => {
+          const details = fixDetailsByNode[key];
+
+          const nodeToReport = details.node;
+          const descriptor = details.descriptor;
+          const source = details.source;
+
+          const leadingSpaceString = details.leadingSpace ? '\n{\' \'}' : '';
+          const trailingSpaceString = details.trailingSpace ? '{\' \'}\n' : '';
+          const leadingNewLineString = details.leadingNewLine ? '\n' : '';
+          const trailingNewLineString = details.trailingNewLine ? '\n' : '';
+
+          context.report({
+            node: nodeToReport,
+            message: `\`${descriptor}\` must be placed on a new line`,
+            fix: function (fixer) {
+              return fixer.replaceText(nodeToReport, `${leadingSpaceString}${leadingNewLineString}${source}${trailingNewLineString}${trailingSpaceString}`);
+            }
           });
         });
       }

tests/lib/rules/jsx-one-element-per-line.js

@@ -707,6 +707,28 @@ ruleTester.run('jsx-one-element-per-line', rule, {
       {message: '` baz` must be placed on a new line'}
     ],
     parserOptions: parserOptions
+  }, {
+    // Would be nice to handle in one pass, but multipass works fine.
+    code: [
+      '<App>',
+      '  foo ',
+      '{\' \'}',
+      '{"bar"} baz',
+      '</App>'
+    ].join('\n'),
+    output: [
+      '<App>',
+      '  foo ',
+      '{\' \'}',
+      '{"bar"}',
+      '{\' \'}',
+      ' baz',
+      '</App>'
+    ].join('\n'),
+    errors: [
+      {message: '` baz` must be placed on a new line'}
+    ],
+    parserOptions: parserOptions
   }, {
     // Would be nice to handle in one pass, but multipass works fine.
     code: [
@@ -757,31 +779,11 @@ ruleTester.run('jsx-one-element-per-line', rule, {
     ],
     parserOptions: parserOptions
   }, {
-    // Would be nice to handle in one pass, but multipass works fine.
     code: [
       '<App>{',
       '  foo',
       '}</App>'
     ].join('\n'),
-    output: [
-      '<App>',
-      '{',
-      '  foo',
-      '}</App>'
-    ].join('\n'),
-    errors: [
-      {message: '`{  foo}` must be placed on a new line'},
-      {message: '`{  foo}` must be placed on a new line'}
-    ],
-    parserOptions: parserOptions
-  }, {
-    // Would be nice to handle in one pass, but multipass works fine.
-    code: [
-      '<App>',
-      '{',
-      '  foo',
-      '}</App>'
-    ].join('\n'),
     output: [
       '<App>',
       '{',
@@ -794,7 +796,6 @@ ruleTester.run('jsx-one-element-per-line', rule, {
     ],
     parserOptions: parserOptions
   }, {
-    // Would be nice to handle in one pass, but multipass works fine.
     code: [
       '<App> {',
       '  foo',
@@ -805,15 +806,15 @@ ruleTester.run('jsx-one-element-per-line', rule, {
       '{\' \'}',
       '{',
       '  foo',
-      '} </App>'
+      '}',
+      '{\' \'}',
+      ' </App>'
     ].join('\n'),
     errors: [
-      {message: '`{  foo}` must be placed on a new line'},
       {message: '`{  foo}` must be placed on a new line'}
     ],
     parserOptions: parserOptions
   }, {
-    // Would be nice to handle in one pass, but multipass works fine.
     code: [
       '<App> ',
       '{\' \'}',