Add function-name-arguments-allowed-list

lib/rules/function-name-arguments-whitelist/README.md

@@ -0,0 +1,96 @@
+# function-name-arguments-whitelist
+
+Specify a whitelist of allowed property and value pairs within declarations.
+
+<!-- prettier-ignore -->
+```css
+a { text-transform: uppercase; }
+/** ↑               ↑
+ * These properties and these values */
+```
+
+## Options
+
+`object`: `{"unprefixed-function-name": ["string", "/regex/", /regex/] }`
+
+If a property name is found in the object, only its whitelisted property values are allowed. This rule complains about all non-matching values. (If the property name is not included in the object, anything goes.)
+
+If a property name is surrounded with `"/"` (e.g. `"/^animation/"`), it is interpreted as a regular expression. This allows, for example, easy targeting of shorthands: `/^animation/` will match `animation`, `animation-duration`, `animation-timing-function`, etc.
+
+The same goes for values. Keep in mind that a regular expression value is matched against the entire value of the declaration, not specific parts of it. For example, a value like `"10px solid rgba( 255 , 0 , 0 , 0.5 )"` will _not_ match `"/^solid/"` (notice beginning of the line boundary) but _will_ match `"/\\s+solid\\s+/"` or `"/\\bsolid\\b/"`.
+
+Be careful with regex matching not to accidentally consider quoted string values and `url()` arguments. For example, `"/red/"` will match value such as `"1px dotted red"` as well as `"\"red\""` and `"white url(/mysite.com/red.png)"`.
+
+Given:
+
+```
+{
+  "transform": ["/scale/"],
+  "whitespace": ["nowrap"],
+  "/color/": ["/^green/"]
+}
+```
+
+The following patterns are considered violations:
+
+<!-- prettier-ignore -->
+```css
+a { whitespace: pre; }
+```
+
+<!-- prettier-ignore -->
+```css
+a { transform: translate(1, 1); }
+```
+
+<!-- prettier-ignore -->
+```css
+a { -webkit-transform: translate(1, 1); }
+```
+
+<!-- prettier-ignore -->
+```css
+a { color: pink; }
+```
+
+<!-- prettier-ignore -->
+```css
+a { background-color: pink; }
+```
+
+The following patterns are _not_ considered violations:
+
+<!-- prettier-ignore -->
+```css
+a { color: pink; }
+```
+
+<!-- prettier-ignore -->
+```css
+a { whitespace: nowrap; }
+```
+
+<!-- prettier-ignore -->
+```css
+a { transform: scale(1, 1); }
+```
+
+<!-- prettier-ignore -->
+```css
+a { -webkit-transform: scale(1, 1); }
+```
+
+<!-- prettier-ignore -->
+```css
+a { color: green; }
+```
+
+<!-- prettier-ignore -->
+```css
+a { background-color: green; }
+```
+
+<!-- prettier-ignore -->
+```css
+a { background: pink; }
+```

lib/rules/function-name-arguments-whitelist/__tests__/index.js

@@ -0,0 +1,78 @@
+'use strict';
+
+const { messages, ruleName } = require('..');
+
+testRule({
+	ruleName,
+
+	config: [
+		{
+			transform: ['/scale/'],
+			whitespace: ['nowrap'],
+			'/color/': ['/^green/'],
+		},
+	],
+
+	accept: [
+		{
+			code: 'div { whitespace: nowrap; }',
+		},
+		{
+			code: 'a { transform: scale(1, 1); }',
+		},
+		{
+			code: 'a { -webkit-transform: scale(1, 1); }',
+		},
+		{
+			code: 'a { color: green; }',
+		},
+		{
+			code: 'a { background-color: green; }',
+		},
+	],
+
+	reject: [
+		{
+			code: 'div { whitespace: pre; }',
+			message: messages.rejected('whitespace', 'pre'),
+			line: 1,
+			column: 7,
+		},
+		{
+			code: 'a { transform: translate(1, 1); }',
+			message: messages.rejected('transform', 'translate(1, 1)'),
+			line: 1,
+			column: 5,
+		},
+		{
+			code: 'a { -webkit-transform: translate(1, 1); }',
+			message: messages.rejected('-webkit-transform', 'translate(1, 1)'),
+			line: 1,
+			column: 5,
+		},
+		{
+			code: 'a { color: pink; }',
+			message: messages.rejected('color', 'pink'),
+			line: 1,
+			column: 5,
+		},
+		{
+			code: 'a { background-color: pink; }',
+			message: messages.rejected('background-color', 'pink'),
+			line: 1,
+			column: 5,
+		},
+	],
+});
+
+testRule({
+	ruleName,
+	config: { position: ['static'] },
+	skipBasicChecks: true,
+	accept: [
+		{
+			code: 'a { font-size: 1em; }',
+			description: 'irrelevant CSS',
+		},
+	],
+});

lib/rules/function-name-arguments-whitelist/index.js

@@ -0,0 +1,58 @@
+// @ts-nocheck
+
+'use strict';
+
+const _ = require('lodash');
+const matchesStringOrRegExp = require('../../utils/matchesStringOrRegExp');
+const postcss = require('postcss');
+const report = require('../../utils/report');
+const ruleMessages = require('../../utils/ruleMessages');
+const validateOptions = require('../../utils/validateOptions');
+
+const ruleName = 'function-name-arguments-whitelist';
+
+const messages = ruleMessages(ruleName, {
+	rejected: (property, value) => `Unexpected arguments "${value}" for function "${property}"`,
+});
+
+function rule(whitelist) {
+	return (root, result) => {
+		const validOptions = validateOptions(result, ruleName, {
+			actual: whitelist,
+			possible: [_.isObject],
+		});
+
+		if (!validOptions) {
+			return;
+		}
+
+		root.walkDecls((decl) => {
+			const prop = decl.prop;
+			const value = decl.value;
+
+			const unprefixedProp = postcss.vendor.unprefixed(prop);
+			const propWhitelist = _.find(whitelist, (list, propIdentifier) =>
+				matchesStringOrRegExp(unprefixedProp, propIdentifier),
+			);
+
+			if (_.isEmpty(propWhitelist)) {
+				return;
+			}
+
+			if (matchesStringOrRegExp(value, propWhitelist)) {
+				return;
+			}
+
+			report({
+				message: messages.rejected(prop, value),
+				node: decl,
+				result,
+				ruleName,
+			});
+		});
+	};
+}
+
+rule.ruleName = ruleName;
+rule.messages = messages;
+module.exports = rule;