@atlaskit/eslint-plugin-platform 2.2.0 → 2.2.1

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/eslint-plugin-platform
 
+## 2.2.1
+
+### Patch Changes
+
+- [#103444](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/103444)
+  [`5d5006fe81146`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5d5006fe81146) -
+  AFB-822 Refactor ESLint rule and added an extra case for when ESLint rule should throw error but
+  not provide a fix
+
 ## 2.2.0
 
 ### Minor Changes

package/dist/cjs/rules/compiled/expand-spacing-shorthand/index.js

@@ -46,31 +46,74 @@ var parseTemplateLiteral = function parseTemplateLiteral(templateLiteral, contex
   }
   return propertyValues;
 };
-var checkValidPropertyValues = function checkValidPropertyValues(propertyValues) {
+
+/**
+ * Checks if the parsed property values are valid (i.e. no rule violation will be thrown). Cases are, the property values:
+ * 1. Do not contain a token
+ * 2. Have length that are not in the range [1, 4]
+ * 3. Includes `calc(...)`
+ * Then, the rule will return with no error
+ * @param propertyValues property values parsed as list of strings
+ * @returns boolean
+ */
+var isPropertyValueExempted = function isPropertyValueExempted(propertyValues) {
   if (!propertyValues.some(function (str) {
     return str.includes('token(');
   })) {
-    return false;
+    return true;
   }
   if (propertyValues.length < 1 || propertyValues.length > 4) {
-    return false;
+    return true;
   }
   if (propertyValues.some(function (str) {
     return str.includes('calc(');
   })) {
-    return false;
+    return true;
   }
-  return true;
+  return false;
 };
 
-// Check that all expressions in TemplateLiteral are token expressions
-// If true: create an autofix
-// If false: report violation without autofix
-var hasOnlyTokens = function hasOnlyTokens(templateLiteral) {
+/**
+ * Checks if the parsed property values are invalid (i.e. rule violation thrown) and autofix required. Cases are when:
+ *  1. All expressions in TemplateLiteral are token expressions
+ *  2. Property values must have a format which includes -> e.g. 2, '2(rem|em|px)', auto, initial, inherit, token(...)
+ *  The rule will return with error and provide a fix
+ * @param templateLiteral TemplateLiteral AST Node
+ * @param propertyValues property values parsed as list of strings
+ * @returns boolean
+ */
+var isPropertyValuesInvalidFix = function isPropertyValuesInvalidFix(templateLiteral, propertyValues) {
   var expressions = templateLiteral.expressions;
-  return expressions.every(function (expr) {
+  if (!expressions.every(function (expr) {
     return expr.type === 'CallExpression' && isTokenCallExpression(expr);
-  });
+  })) {
+    return false;
+  }
+  var _iterator = _createForOfIteratorHelper(propertyValues),
+    _step;
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var propValue = _step.value;
+      if (propValue === '0') {
+        continue;
+      }
+      if (['auto', 'initial', 'inherit'].includes(propValue.slice(1, -1))) {
+        continue;
+      }
+      if (/^token\(.*\)$/.test(propValue)) {
+        continue;
+      }
+      if (/^['"]\d+(\.\d+)?((rem)|(em)|(px))['"]$/.test(propValue)) {
+        continue;
+      }
+      return false;
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+  return true;
 };
 
 // To fix spacing shorthands, given a list of spacing property values, expands the spacing property and adds autofix fixes
@@ -92,11 +135,11 @@ var expandSpacingProperties = function expandSpacingProperties(_ref) {
   var fixes = [];
   var parentNode = node.parent;
   if (parentNode && parentNode.type === 'ObjectExpression') {
-    var _iterator = _createForOfIteratorHelper(parentNode.properties),
-      _step;
+    var _iterator2 = _createForOfIteratorHelper(parentNode.properties),
+      _step2;
     try {
-      for (_iterator.s(); !(_step = _iterator.n()).done;) {
-        var prop = _step.value;
+      for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+        var prop = _step2.value;
         if (prop.type !== 'Property') {
           continue;
         }
@@ -121,9 +164,9 @@ var expandSpacingProperties = function expandSpacingProperties(_ref) {
         }
       }
     } catch (err) {
-      _iterator.e(err);
+      _iterator2.e(err);
     } finally {
-      _iterator.f();
+      _iterator2.f();
     }
   }
   fixes.push(fixer.insertTextAfter(node, "".concat(propertyShorthand, "Top: ").concat(spacing[0], ",\n")));
@@ -138,8 +181,30 @@ var executeExpandSpacingRule = function executeExpandSpacingRule(context, node,
     return;
   }
   if (node.value.type === 'TemplateLiteral') {
-    // Value of spacing property is a TemplateLiteral type that contains a token, e.g. padding: `0 token('a')`
-    if (!hasOnlyTokens(node.value)) {
+    var propertyValues = parseTemplateLiteral(node.value, context);
+    if (isPropertyValueExempted(propertyValues)) {
+      // Valid, so no error should be thrown
+      return;
+    }
+    if (isPropertyValuesInvalidFix(node.value, propertyValues)) {
+      // Invalid, so error should be thrown and fix provided
+      context.report({
+        node: node,
+        messageId: 'expandSpacingShorthand',
+        data: {
+          property: propertyShorthand
+        },
+        fix: function fix(fixer) {
+          return expandSpacingProperties({
+            context: context,
+            node: node,
+            propertyValues: propertyValues,
+            fixer: fixer,
+            propertyShorthand: propertyShorthand
+          });
+        }
+      });
+    } else {
       context.report({
         node: node,
         messageId: 'expandSpacingShorthand',
@@ -149,26 +214,6 @@ var executeExpandSpacingRule = function executeExpandSpacingRule(context, node,
       });
       return;
     }
-    var propertyValues = parseTemplateLiteral(node.value, context);
-    if (!checkValidPropertyValues(propertyValues)) {
-      return;
-    }
-    context.report({
-      node: node,
-      messageId: 'expandSpacingShorthand',
-      data: {
-        property: propertyShorthand
-      },
-      fix: function fix(fixer) {
-        return expandSpacingProperties({
-          context: context,
-          node: node,
-          propertyValues: propertyValues,
-          fixer: fixer,
-          propertyShorthand: propertyShorthand
-        });
-      }
-    });
   } else if (node.value.type === 'CallExpression' && isTokenCallExpression(node.value)) {
     // Value of spacing property is a token CallExpression type, e.g. margin: token('space.100', '8px')
     var _propertyValues2 = [(0, _contextCompat.getSourceCode)(context).getText(node.value)];

package/dist/es2019/rules/compiled/expand-spacing-shorthand/index.js

@@ -35,25 +35,59 @@ const parseTemplateLiteral = (templateLiteral, context) => {
   }
   return propertyValues;
 };
-const checkValidPropertyValues = propertyValues => {
+
+/**
+ * Checks if the parsed property values are valid (i.e. no rule violation will be thrown). Cases are, the property values:
+ * 1. Do not contain a token
+ * 2. Have length that are not in the range [1, 4]
+ * 3. Includes `calc(...)`
+ * Then, the rule will return with no error
+ * @param propertyValues property values parsed as list of strings
+ * @returns boolean
+ */
+const isPropertyValueExempted = propertyValues => {
   if (!propertyValues.some(str => str.includes('token('))) {
-    return false;
+    return true;
   }
   if (propertyValues.length < 1 || propertyValues.length > 4) {
-    return false;
+    return true;
   }
   if (propertyValues.some(str => str.includes('calc('))) {
-    return false;
+    return true;
   }
-  return true;
+  return false;
 };
 
-// Check that all expressions in TemplateLiteral are token expressions
-// If true: create an autofix
-// If false: report violation without autofix
-const hasOnlyTokens = templateLiteral => {
+/**
+ * Checks if the parsed property values are invalid (i.e. rule violation thrown) and autofix required. Cases are when:
+ *  1. All expressions in TemplateLiteral are token expressions
+ *  2. Property values must have a format which includes -> e.g. 2, '2(rem|em|px)', auto, initial, inherit, token(...)
+ *  The rule will return with error and provide a fix
+ * @param templateLiteral TemplateLiteral AST Node
+ * @param propertyValues property values parsed as list of strings
+ * @returns boolean
+ */
+const isPropertyValuesInvalidFix = (templateLiteral, propertyValues) => {
   const expressions = templateLiteral.expressions;
-  return expressions.every(expr => expr.type === 'CallExpression' && isTokenCallExpression(expr));
+  if (!expressions.every(expr => expr.type === 'CallExpression' && isTokenCallExpression(expr))) {
+    return false;
+  }
+  for (const propValue of propertyValues) {
+    if (propValue === '0') {
+      continue;
+    }
+    if (['auto', 'initial', 'inherit'].includes(propValue.slice(1, -1))) {
+      continue;
+    }
+    if (/^token\(.*\)$/.test(propValue)) {
+      continue;
+    }
+    if (/^['"]\d+(\.\d+)?((rem)|(em)|(px))['"]$/.test(propValue)) {
+      continue;
+    }
+    return false;
+  }
+  return true;
 };
 
 // To fix spacing shorthands, given a list of spacing property values, expands the spacing property and adds autofix fixes
@@ -104,8 +138,30 @@ const executeExpandSpacingRule = (context, node, propertyShorthand) => {
     return;
   }
   if (node.value.type === 'TemplateLiteral') {
-    // Value of spacing property is a TemplateLiteral type that contains a token, e.g. padding: `0 token('a')`
-    if (!hasOnlyTokens(node.value)) {
+    const propertyValues = parseTemplateLiteral(node.value, context);
+    if (isPropertyValueExempted(propertyValues)) {
+      // Valid, so no error should be thrown
+      return;
+    }
+    if (isPropertyValuesInvalidFix(node.value, propertyValues)) {
+      // Invalid, so error should be thrown and fix provided
+      context.report({
+        node,
+        messageId: 'expandSpacingShorthand',
+        data: {
+          property: propertyShorthand
+        },
+        fix(fixer) {
+          return expandSpacingProperties({
+            context,
+            node,
+            propertyValues,
+            fixer,
+            propertyShorthand
+          });
+        }
+      });
+    } else {
       context.report({
         node,
         messageId: 'expandSpacingShorthand',
@@ -115,26 +171,6 @@ const executeExpandSpacingRule = (context, node, propertyShorthand) => {
       });
       return;
     }
-    const propertyValues = parseTemplateLiteral(node.value, context);
-    if (!checkValidPropertyValues(propertyValues)) {
-      return;
-    }
-    context.report({
-      node,
-      messageId: 'expandSpacingShorthand',
-      data: {
-        property: propertyShorthand
-      },
-      fix(fixer) {
-        return expandSpacingProperties({
-          context,
-          node,
-          propertyValues,
-          fixer,
-          propertyShorthand
-        });
-      }
-    });
   } else if (node.value.type === 'CallExpression' && isTokenCallExpression(node.value)) {
     // Value of spacing property is a token CallExpression type, e.g. margin: token('space.100', '8px')
     const propertyValues = [getSourceCode(context).getText(node.value)];

package/dist/esm/rules/compiled/expand-spacing-shorthand/index.js

@@ -39,31 +39,74 @@ var parseTemplateLiteral = function parseTemplateLiteral(templateLiteral, contex
   }
   return propertyValues;
 };
-var checkValidPropertyValues = function checkValidPropertyValues(propertyValues) {
+
+/**
+ * Checks if the parsed property values are valid (i.e. no rule violation will be thrown). Cases are, the property values:
+ * 1. Do not contain a token
+ * 2. Have length that are not in the range [1, 4]
+ * 3. Includes `calc(...)`
+ * Then, the rule will return with no error
+ * @param propertyValues property values parsed as list of strings
+ * @returns boolean
+ */
+var isPropertyValueExempted = function isPropertyValueExempted(propertyValues) {
   if (!propertyValues.some(function (str) {
     return str.includes('token(');
   })) {
-    return false;
+    return true;
   }
   if (propertyValues.length < 1 || propertyValues.length > 4) {
-    return false;
+    return true;
   }
   if (propertyValues.some(function (str) {
     return str.includes('calc(');
   })) {
-    return false;
+    return true;
   }
-  return true;
+  return false;
 };
 
-// Check that all expressions in TemplateLiteral are token expressions
-// If true: create an autofix
-// If false: report violation without autofix
-var hasOnlyTokens = function hasOnlyTokens(templateLiteral) {
+/**
+ * Checks if the parsed property values are invalid (i.e. rule violation thrown) and autofix required. Cases are when:
+ *  1. All expressions in TemplateLiteral are token expressions
+ *  2. Property values must have a format which includes -> e.g. 2, '2(rem|em|px)', auto, initial, inherit, token(...)
+ *  The rule will return with error and provide a fix
+ * @param templateLiteral TemplateLiteral AST Node
+ * @param propertyValues property values parsed as list of strings
+ * @returns boolean
+ */
+var isPropertyValuesInvalidFix = function isPropertyValuesInvalidFix(templateLiteral, propertyValues) {
   var expressions = templateLiteral.expressions;
-  return expressions.every(function (expr) {
+  if (!expressions.every(function (expr) {
     return expr.type === 'CallExpression' && isTokenCallExpression(expr);
-  });
+  })) {
+    return false;
+  }
+  var _iterator = _createForOfIteratorHelper(propertyValues),
+    _step;
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var propValue = _step.value;
+      if (propValue === '0') {
+        continue;
+      }
+      if (['auto', 'initial', 'inherit'].includes(propValue.slice(1, -1))) {
+        continue;
+      }
+      if (/^token\(.*\)$/.test(propValue)) {
+        continue;
+      }
+      if (/^['"]\d+(\.\d+)?((rem)|(em)|(px))['"]$/.test(propValue)) {
+        continue;
+      }
+      return false;
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+  return true;
 };
 
 // To fix spacing shorthands, given a list of spacing property values, expands the spacing property and adds autofix fixes
@@ -85,11 +128,11 @@ var expandSpacingProperties = function expandSpacingProperties(_ref) {
   var fixes = [];
   var parentNode = node.parent;
   if (parentNode && parentNode.type === 'ObjectExpression') {
-    var _iterator = _createForOfIteratorHelper(parentNode.properties),
-      _step;
+    var _iterator2 = _createForOfIteratorHelper(parentNode.properties),
+      _step2;
     try {
-      for (_iterator.s(); !(_step = _iterator.n()).done;) {
-        var prop = _step.value;
+      for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+        var prop = _step2.value;
         if (prop.type !== 'Property') {
           continue;
         }
@@ -114,9 +157,9 @@ var expandSpacingProperties = function expandSpacingProperties(_ref) {
         }
       }
     } catch (err) {
-      _iterator.e(err);
+      _iterator2.e(err);
     } finally {
-      _iterator.f();
+      _iterator2.f();
     }
   }
   fixes.push(fixer.insertTextAfter(node, "".concat(propertyShorthand, "Top: ").concat(spacing[0], ",\n")));
@@ -131,8 +174,30 @@ var executeExpandSpacingRule = function executeExpandSpacingRule(context, node,
     return;
   }
   if (node.value.type === 'TemplateLiteral') {
-    // Value of spacing property is a TemplateLiteral type that contains a token, e.g. padding: `0 token('a')`
-    if (!hasOnlyTokens(node.value)) {
+    var propertyValues = parseTemplateLiteral(node.value, context);
+    if (isPropertyValueExempted(propertyValues)) {
+      // Valid, so no error should be thrown
+      return;
+    }
+    if (isPropertyValuesInvalidFix(node.value, propertyValues)) {
+      // Invalid, so error should be thrown and fix provided
+      context.report({
+        node: node,
+        messageId: 'expandSpacingShorthand',
+        data: {
+          property: propertyShorthand
+        },
+        fix: function fix(fixer) {
+          return expandSpacingProperties({
+            context: context,
+            node: node,
+            propertyValues: propertyValues,
+            fixer: fixer,
+            propertyShorthand: propertyShorthand
+          });
+        }
+      });
+    } else {
       context.report({
         node: node,
         messageId: 'expandSpacingShorthand',
@@ -142,26 +207,6 @@ var executeExpandSpacingRule = function executeExpandSpacingRule(context, node,
       });
       return;
     }
-    var propertyValues = parseTemplateLiteral(node.value, context);
-    if (!checkValidPropertyValues(propertyValues)) {
-      return;
-    }
-    context.report({
-      node: node,
-      messageId: 'expandSpacingShorthand',
-      data: {
-        property: propertyShorthand
-      },
-      fix: function fix(fixer) {
-        return expandSpacingProperties({
-          context: context,
-          node: node,
-          propertyValues: propertyValues,
-          fixer: fixer,
-          propertyShorthand: propertyShorthand
-        });
-      }
-    });
   } else if (node.value.type === 'CallExpression' && isTokenCallExpression(node.value)) {
     // Value of spacing property is a token CallExpression type, e.g. margin: token('space.100', '8px')
     var _propertyValues2 = [getSourceCode(context).getText(node.value)];

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@atlaskit/eslint-plugin-platform",
 	"description": "The essential plugin for use with Atlassian frontend platform tools",
-	"version": "2.2.0",
+	"version": "2.2.1",
 	"author": "Atlassian Pty Ltd",
 	"atlassian": {
 		"team": "Build Infra",

package/src/rules/compiled/expand-spacing-shorthand/__tests__/rule.test.ts

@@ -272,6 +272,36 @@ const invalidTestCases = (property: string) => {
 			`,
 			errors: Array.from(Array(3), () => ({ messageId: 'expandSpacingShorthand' })),
 		},
+		// Strings that are not valid property values should not be autofixed (e.g. !important)
+		{
+			name: `${property}: Don't autofix if not able to handle all the string values, e.g !important`,
+			code: outdent`
+			import {css} from '@compiled/react';
+			const styles = css({
+				${property}: \`0 \${token('space.200', '16px')} !important\`,
+			});
+			`,
+			errors: [{ messageId: 'expandSpacingShorthand' }],
+		},
+		{
+			name: `${property}: Autofix if able to handle all string values`,
+			code: outdent`
+			import {css} from '@compiled/react';
+			const styles = css({
+				${property}: \`0 auto \${token('space.300', '24px')}\`,
+			});
+			`,
+			output: outdent`
+			import {css} from '@compiled/react';
+			const styles = css({
+				${property}Top: 0,
+				${property}Right: 'auto',
+				${property}Bottom: token('space.300', '24px'),
+				${property}Left: 'auto',
+			});
+			`,
+			errors: [{ messageId: 'expandSpacingShorthand' }],
+		},
 		// Miscellaneous
 		{
 			name: `${property}: new property should not be created if existing property already exists`,
@@ -383,7 +413,7 @@ const invalidTestCases = (property: string) => {
 			`,
 			errors: Array.from(Array(2), () => ({ messageId: 'expandSpacingShorthand' })),
 		},
-		// TODO (AFB-1022): Resolve this failing test
+		// // TODO (AFB-1022): Resolve this failing test
 		// {
 		//  name: `${property}: styled components with prop input`,
 		//  code: outdent`

package/src/rules/compiled/expand-spacing-shorthand/index.ts

@@ -49,26 +49,52 @@ const parseTemplateLiteral = (templateLiteral: TemplateLiteral, context: Rule.Ru
 	return propertyValues;
 };
 
-const checkValidPropertyValues = (propertyValues: string[]) => {
+/**
+ * Checks if the parsed property values are valid (i.e. no rule violation will be thrown). Cases are, the property values:
+ * 1. Do not contain a token
+ * 2. Have length that are not in the range [1, 4]
+ * 3. Includes `calc(...)`
+ * Then, the rule will return with no error
+ * @param propertyValues property values parsed as list of strings
+ * @returns boolean
+ */
+const isPropertyValueExempted = (propertyValues: string[]) => {
 	if (!propertyValues.some((str) => str.includes('token('))) {
-		return false;
+		return true;
 	}
 	if (propertyValues.length < 1 || propertyValues.length > 4) {
-		return false;
+		return true;
 	}
 	if (propertyValues.some((str) => str.includes('calc('))) {
-		return false;
+		return true;
 	}
-	return true;
+	return false;
 };
 
-// Check that all expressions in TemplateLiteral are token expressions
-// If true: create an autofix
-// If false: report violation without autofix
-const hasOnlyTokens = (templateLiteral: TemplateLiteral) => {
+/**
+ * Checks if the parsed property values are invalid (i.e. rule violation thrown) and autofix required. Cases are when:
+ *  1. All expressions in TemplateLiteral are token expressions
+ *  2. Property values must have a format which includes -> e.g. 2, '2(rem|em|px)', auto, initial, inherit, token(...)
+ *  The rule will return with error and provide a fix
+ * @param templateLiteral TemplateLiteral AST Node
+ * @param propertyValues property values parsed as list of strings
+ * @returns boolean
+ */
+const isPropertyValuesInvalidFix = (templateLiteral: TemplateLiteral, propertyValues: string[]) => {
 	const expressions = templateLiteral.expressions;
-	return expressions.every((expr) => expr.type === 'CallExpression' && isTokenCallExpression(expr));
-};
+	if (!expressions.every((expr) => expr.type === 'CallExpression' && isTokenCallExpression(expr))) {
+		return false;
+	}
+	
+	for (const propValue of propertyValues) {
+		if (propValue === '0') { continue; }
+		if (['auto', 'initial', 'inherit'].includes(propValue.slice(1, -1))) { continue; }
+		if ((/^token\(.*\)$/).test(propValue)) { continue; }
+		if ((/^['"]\d+(\.\d+)?((rem)|(em)|(px))['"]$/).test(propValue)) { continue; }
+		return false;
+	}
+	return true;
+}
 
 // To fix spacing shorthands, given a list of spacing property values, expands the spacing property and adds autofix fixes
 const expandSpacingProperties = ({
@@ -130,8 +156,24 @@ const executeExpandSpacingRule = (
 		return;
 	}
 	if (node.value.type === 'TemplateLiteral') {
-		// Value of spacing property is a TemplateLiteral type that contains a token, e.g. padding: `0 token('a')`
-		if (!hasOnlyTokens(node.value)) {
+		const propertyValues = parseTemplateLiteral(node.value, context);
+		if (isPropertyValueExempted(propertyValues)) {
+			// Valid, so no error should be thrown
+			return;
+		}
+		if (isPropertyValuesInvalidFix(node.value, propertyValues)) {
+			// Invalid, so error should be thrown and fix provided
+			context.report({
+				node,
+				messageId: 'expandSpacingShorthand',
+				data: {
+					property: propertyShorthand,
+				},
+				fix(fixer) {
+					return expandSpacingProperties({ context, node, propertyValues, fixer, propertyShorthand });
+				},
+			});
+		} else {
 			context.report({
 				node,
 				messageId: 'expandSpacingShorthand',
@@ -141,20 +183,6 @@ const executeExpandSpacingRule = (
 			});
 			return;
 		}
-		const propertyValues = parseTemplateLiteral(node.value, context);
-		if (!checkValidPropertyValues(propertyValues)) {
-			return;
-		}
-		context.report({
-			node,
-			messageId: 'expandSpacingShorthand',
-			data: {
-				property: propertyShorthand,
-			},
-			fix(fixer) {
-				return expandSpacingProperties({ context, node, propertyValues, fixer, propertyShorthand });
-			},
-		});
 	} else if (node.value.type === 'CallExpression' && isTokenCallExpression(node.value)) {
 		// Value of spacing property is a token CallExpression type, e.g. margin: token('space.100', '8px')
 		const propertyValues = [getSourceCode(context).getText(node.value)];