fix: correct message for functions in use-baseline rule (eslint#297)

Author: thecalamiity

src/data/baseline-data.js

@@ -583,7 +583,7 @@ export const mediaConditions = new Map([
 	["horizontal-viewport-segments", "0:"],
 	["vertical-viewport-segments", "0:"],
 ]);
-export const types = new Map([
+export const functions = new Map([
 	["abs", "5:2025"],
 	["sign", "5:2025"],
 	["anchor", "0:"],

src/rules/use-baseline.js

@@ -14,7 +14,7 @@ import {
 	propertyValues,
 	atRules,
 	mediaConditions,
-	types,
+	functions,
 	selectors,
 } from "../data/baseline-data.js";
 import { namedColors } from "../data/colors.js";
@@ -26,7 +26,7 @@ import { namedColors } from "../data/colors.js";
 /**
  * @import { CSSRuleDefinition } from "../types.js"
  * @import { Identifier, FunctionNodePlain } from "@eslint/css-tree"
- * @typedef {"notBaselineProperty" | "notBaselinePropertyValue" | "notBaselineAtRule" | "notBaselineType" | "notBaselineMediaCondition" | "notBaselineSelector"} UseBaselineMessageIds
+ * @typedef {"notBaselineProperty" | "notBaselinePropertyValue" | "notBaselineAtRule" | "notBaselineFunction" | "notBaselineMediaCondition" | "notBaselineSelector"} UseBaselineMessageIds
  * @typedef {[{
  *     available?: "widely" | "newly" | number,
  *     allowAtRules?: string[],
@@ -475,8 +475,8 @@ export default {
 				"Value '{{value}}' of property '{{property}}' is not a {{availability}} available baseline feature.",
 			notBaselineAtRule:
 				"At-rule '@{{atRule}}' is not a {{availability}} available baseline feature.",
-			notBaselineType:
-				"Type '{{type}}' is not a {{availability}} available baseline feature.",
+			notBaselineFunction:
+				"Function '{{function}}' is not a {{availability}} available baseline feature.",
 			notBaselineMediaCondition:
 				"Media condition '{{condition}}' is not a {{availability}} available baseline feature.",
 			notBaselineSelector:
@@ -537,7 +537,7 @@ export default {
 		 * @returns {void}
 		 **/
 		function checkPropertyValueFunction(child) {
-			const featureStatus = types.get(child.name);
+			const featureStatus = functions.get(child.name);
 
 			// if we don't know of any possible property values, just skip it
 			if (featureStatus === undefined) {
@@ -547,9 +547,9 @@ export default {
 			if (!baselineAvailability.isSupported(featureStatus)) {
 				context.report({
 					loc: child.loc,
-					messageId: "notBaselineType",
+					messageId: "notBaselineFunction",
 					data: {
-						type: child.name,
+						function: child.name,
 						availability: String(baselineAvailability.availability),
 					},
 				});

tests/rules/use-baseline.test.js

@@ -308,9 +308,9 @@ ruleTester.run("use-baseline", rule, {
 			code: "@supports (accent-color: auto) { a { accent-color: abs(20% - 10px); } }",
 			errors: [
 				{
-					messageId: "notBaselineType",
+					messageId: "notBaselineFunction",
 					data: {
-						type: "abs",
+						function: "abs",
 						availability: "widely",
 					},
 					line: 1,
@@ -340,9 +340,9 @@ ruleTester.run("use-baseline", rule, {
 			code: "a { width: abs(20% - 100px); }",
 			errors: [
 				{
-					messageId: "notBaselineType",
+					messageId: "notBaselineFunction",
 					data: {
-						type: "abs",
+						function: "abs",
 						availability: "widely",
 					},
 					line: 1,
@@ -356,9 +356,9 @@ ruleTester.run("use-baseline", rule, {
 			code: "a { color: color-mix(in hsl, hsl(200 50 80), coral 80%); }",
 			errors: [
 				{
-					messageId: "notBaselineType",
+					messageId: "notBaselineFunction",
 					data: {
-						type: "color-mix",
+						function: "color-mix",
 						availability: "widely",
 					},
 					line: 1,

tools/generate-baseline.js

@@ -109,7 +109,7 @@ function extractCSSFeatures(features) {
 	const propertyValues = {};
 	const atRules = {};
 	const mediaConditions = {};
-	const types = {};
+	const functions = {};
 	const selectors = {};
 
 	for (const [key, featureId] of Object.entries(features)) {
@@ -152,13 +152,13 @@ function extractCSSFeatures(features) {
 			continue;
 		}
 
-		// types
+		// functions
 		if ((match = cssTypePattern.exec(key)) !== null) {
 			const type = match.groups.type;
 			if (!(`${type}()` in mdnData.css.functions)) {
 				continue;
 			}
-			types[type] = mapFeatureStatus(status);
+			functions[type] = mapFeatureStatus(status);
 			continue;
 		}
 
@@ -174,7 +174,7 @@ function extractCSSFeatures(features) {
 		propertyValues,
 		atRules,
 		mediaConditions,
-		types,
+		functions,
 		selectors,
 	};
 }
@@ -210,7 +210,7 @@ export const BASELINE_FALSE = ${BASELINE_FALSE};
 export const properties = new Map(${JSON.stringify(Object.entries(cssFeatures.properties), null, "\t")});
 export const atRules = new Map(${JSON.stringify(Object.entries(cssFeatures.atRules), null, "\t")});
 export const mediaConditions = new Map(${JSON.stringify(Object.entries(cssFeatures.mediaConditions), null, "\t")});
-export const types = new Map(${JSON.stringify(Object.entries(cssFeatures.types), null, "\t")});
+export const functions = new Map(${JSON.stringify(Object.entries(cssFeatures.functions), null, "\t")});
 export const selectors = new Map(${JSON.stringify(Object.entries(cssFeatures.selectors), null, "\t")});
 export const propertyValues = new Map([${Object.entries(
 	cssFeatures.propertyValues,