[New] Support shorthand fragment syntax

lib/rules/jsx-curly-brace-presence.js

@@ -6,6 +6,7 @@
 'use strict';
 
 const docsUrl = require('../util/docsUrl');
+const jsxUtil = require('../util/jsx');
 
 // ------------------------------------------------------------------------------
 // Constants
@@ -168,13 +169,12 @@ module.exports = {
     function lintUnnecessaryCurly(JSXExpressionNode) {
       const expression = JSXExpressionNode.expression;
       const expressionType = expression.type;
-      const parentType = JSXExpressionNode.parent.type;
 
       if (
         (expressionType === 'Literal' || expressionType === 'JSXText') &&
           typeof expression.value === 'string' &&
           !needToEscapeCharacterForJSX(expression.raw) && (
-          parentType === 'JSXElement' ||
+          jsxUtil.isJSX(JSXExpressionNode.parent) ||
           !containsQuoteCharacters(expression.value)
         )
       ) {
@@ -183,32 +183,30 @@ module.exports = {
         expressionType === 'TemplateLiteral' &&
           expression.expressions.length === 0 &&
           !needToEscapeCharacterForJSX(expression.quasis[0].value.raw) && (
-          parentType === 'JSXElement' ||
+          jsxUtil.isJSX(JSXExpressionNode.parent) ||
           !containsQuoteCharacters(expression.quasis[0].value.cooked)
         )
       ) {
         reportUnnecessaryCurly(JSXExpressionNode);
       }
     }
 
-    function areRuleConditionsSatisfied(parentType, config, ruleCondition) {
+    function areRuleConditionsSatisfied(parent, config, ruleCondition) {
       return (
-        parentType === 'JSXAttribute' &&
+        parent.type === 'JSXAttribute' &&
           typeof config.props === 'string' &&
           config.props === ruleCondition
       ) || (
-        parentType === 'JSXElement' &&
+        jsxUtil.isJSX(parent) &&
           typeof config.children === 'string' &&
           config.children === ruleCondition
       );
     }
 
     function shouldCheckForUnnecessaryCurly(parent, config) {
-      const parentType = parent.type;
-
       // If there are more than one JSX child, there is no need to check for
       // unnecessary curly braces.
-      if (parentType === 'JSXElement' && parent.children.length !== 1) {
+      if (jsxUtil.isJSX(parent) && parent.children.length !== 1) {
         return false;
       }
 
@@ -220,7 +218,7 @@ module.exports = {
         return false;
       }
 
-      return areRuleConditionsSatisfied(parentType, config, OPTION_NEVER);
+      return areRuleConditionsSatisfied(parent, config, OPTION_NEVER);
     }
 
     function shouldCheckForMissingCurly(parent, config) {
@@ -232,7 +230,7 @@ module.exports = {
         return false;
       }
 
-      return areRuleConditionsSatisfied(parent.type, config, OPTION_ALWAYS);
+      return areRuleConditionsSatisfied(parent, config, OPTION_ALWAYS);
     }
 
     // --------------------------------------------------------------------------

lib/rules/jsx-curly-spacing.js

@@ -331,6 +331,7 @@ module.exports = {
           break;
 
         case 'JSXElement':
+        case 'JSXFragment':
           config = childrenConfig;
           break;
 

lib/rules/jsx-filename-extension.js

@@ -43,38 +43,41 @@ module.exports = {
   },
 
   create: function(context) {
+    let invalidExtension;
+    let invalidNode;
+
     function getExtensionsConfig() {
       return context.options[0] && context.options[0].extensions || DEFAULTS.extensions;
     }
 
-    let invalidExtension;
-    let invalidNode;
+    function handleJSX(node) {
+      const filename = context.getFilename();
+      if (filename === '<text>') {
+        return;
+      }
 
-    // --------------------------------------------------------------------------
-    // Public
-    // --------------------------------------------------------------------------
+      if (invalidNode) {
+        return;
+      }
 
-    return {
-      JSXElement: function(node) {
-        const filename = context.getFilename();
-        if (filename === '<text>') {
-          return;
-        }
+      const allowedExtensions = getExtensionsConfig();
+      const isAllowedExtension = allowedExtensions.some(extension => filename.slice(-extension.length) === extension);
 
-        if (invalidNode) {
-          return;
-        }
+      if (isAllowedExtension) {
+        return;
+      }
 
-        const allowedExtensions = getExtensionsConfig();
-        const isAllowedExtension = allowedExtensions.some(extension => filename.slice(-extension.length) === extension);
+      invalidNode = node;
+      invalidExtension = path.extname(filename);
+    }
 
-        if (isAllowedExtension) {
-          return;
-        }
+    // --------------------------------------------------------------------------
+    // Public
+    // --------------------------------------------------------------------------
 
-        invalidNode = node;
-        invalidExtension = path.extname(filename);
-      },
+    return {
+      JSXElement: handleJSX,
+      JSXFragment: handleJSX,
 
       'Program:exit': function() {
         if (!invalidNode) {

lib/rules/jsx-max-depth.js

@@ -6,6 +6,7 @@
 
 const has = require('has');
 const variableUtil = require('../util/variable');
+const jsxUtil = require('../util/jsx');
 const docsUrl = require('../util/docsUrl');
 
 // ------------------------------------------------------------------------------
@@ -39,16 +40,12 @@ module.exports = {
     const option = context.options[0] || {};
     const maxDepth = has(option, 'max') ? option.max : DEFAULT_DEPTH;
 
-    function isJSXElement(node) {
-      return node.type === 'JSXElement';
-    }
-
     function isExpression(node) {
       return node.type === 'JSXExpressionContainer';
     }
 
     function hasJSX(node) {
-      return isJSXElement(node) || isExpression(node) && isJSXElement(node.expression);
+      return jsxUtil.isJSX(node) || isExpression(node) && jsxUtil.isJSX(node.expression);
     }
 
     function isLeaf(node) {
@@ -60,9 +57,9 @@ module.exports = {
     function getDepth(node) {
       let count = 0;
 
-      while (isJSXElement(node.parent) || isExpression(node.parent)) {
+      while (jsxUtil.isJSX(node.parent) || isExpression(node.parent)) {
         node = node.parent;
-        if (isJSXElement(node)) {
+        if (jsxUtil.isJSX(node)) {
           count++;
         }
       }
@@ -82,18 +79,18 @@ module.exports = {
       });
     }
 
-    function findJSXElement(variables, name) {
+    function findJSXElementOrFragment(variables, name) {
       function find(refs) {
         let i = refs.length;
 
         while (--i >= 0) {
           if (has(refs[i], 'writeExpr')) {
             const writeExpr = refs[i].writeExpr;
 
-            return isJSXElement(writeExpr)
+            return jsxUtil.isJSX(writeExpr)
               && writeExpr
               || writeExpr.type === 'Identifier'
-              && findJSXElement(variables, writeExpr.name);
+              && findJSXElementOrFragment(variables, writeExpr.name);
           }
         }
 
@@ -119,24 +116,28 @@ module.exports = {
       });
     }
 
+    function handleJSX(node) {
+      if (!isLeaf(node)) {
+        return;
+      }
+
+      const depth = getDepth(node);
+      if (depth > maxDepth) {
+        report(node, depth);
+      }
+    }
+
     return {
-      JSXElement: function(node) {
-        if (!isLeaf(node)) {
-          return;
-        }
+      JSXElement: handleJSX,
+      JSXFragment: handleJSX,
 
-        const depth = getDepth(node);
-        if (depth > maxDepth) {
-          report(node, depth);
-        }
-      },
       JSXExpressionContainer: function(node) {
         if (node.expression.type !== 'Identifier') {
           return;
         }
 
         const variables = variableUtil.variablesInScope(context);
-        const element = findJSXElement(variables, node.expression.name);
+        const element = findJSXElementOrFragment(variables, node.expression.name);
 
         if (element) {
           const baseDepth = getDepth(node);