add lint/accessibleEmoji for jsx-a11y

packages/@romejs/diagnostics/categories.ts

@@ -92,6 +92,7 @@ export type DiagnosticCategoryPrefix =
 // EVERYTHING BELOW IS AUTOGENERATED. SEE SCRIPTS FOLDER FOR UPDATE SCRIPTS
 
 type LintDiagnosticCategory =
+  | 'lint/accessibleEmoji'
 	| "lint/js/camelCase"
 	| "lint/js/caseSingleStatement"
 	| "lint/js/confusingLanguage"

packages/@romejs/diagnostics/descriptions.ts

@@ -292,13 +292,11 @@ export const descriptions = createMessages({
 	},
 	// @romejs/js-compiler
 	LINT: {
-		JSX_A11Y_MOUSE_EVENTS_HAVE_KEY_EVENTS: (
-			mouseEvent: string,
-			keyboardEvent: string,
-		) => ({
-			category: "lint/jsx-a11y/mouseEventsHaveKeyEvents",
-			message: `The mouse event <emphasis>${mouseEvent}</emphasis> should be paired with the event <emphasis>${keyboardEvent}</emphasis>`,
-		}),
+		ACCESSIBLE_EMOJI: {
+			category: 'lint/accessibleEmoji',
+			message:
+				'Emojis should be wrapped in a span tag with aria-label and role="img"',
+		},
 		REACT_NO_WILL_UPDATE_SET_STATE: {
 			category: "lint/react/noWillUpdateSetState",
 			message: "Avoid <emphasis>this.setState</emphasis> in <emphasis>componentWillUpdate</emphasis>",

packages/@romejs/js-compiler/lint/rules/index.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-// EVERYTHING BELOW IS AUTOGENERATED. SEE SCRIPTS FOLDER FOR UPDATE SCRIPTS
+import accessibleEmoji from './jsx-a11y/accessibleEmoji';
 import camelCase from "./js/camelCase";
 import caseSingleStatement from "./js/caseSingleStatement";
 import confusingLanguage from "./js/confusingLanguage";

packages/@romejs/js-compiler/lint/rules/jsx-a11y/accessibleEmoji.test.md

@@ -0,0 +1,95 @@
+# `accessibleEmoji.test.ts`
+
+**DO NOT MODIFY**. This file has been autogenerated. Run `rome test packages/@romejs/js-compiler/lint/rules/jsx-a11y/accessibleEmoji.test.ts --update-snapshots` to update.
+
+## `accessible emoji`
+
+### `0`
+
+```
+
+ unknown:1 lint/accessibleEmoji ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ✖ Emojis should be wrapped in a span tag with aria-label and role="img"
+
+    <span>🐼</span>
+    ^^^^^^^^^^^^^^^
+
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+✖ Found 1 problem
+
+```
+
+### `0: formatted`
+
+```
+<span>🐼</span>;
+
+```
+
+### `1`
+
+```
+
+ unknown:1 lint/accessibleEmoji ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+  ✖ Emojis should be wrapped in a span tag with aria-label and role="img"
+
+    <i role="img" aria-label="Panda">🐼</i>
+    ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+✖ Found 1 problem
+
+```
+
+### `1: formatted`
+
+```
+<i role="img" aria-label="Panda">🐼</i>;
+
+```
+
+### `2`
+
+```
+✔ No known problems!
+
+```
+
+### `2: formatted`
+
+```
+<span role="img" aria-label="Panda">🐼</span>;
+
+```
+
+### `3`
+
+```
+✔ No known problems!
+
+```
+
+### `3: formatted`
+
+```
+<span role="img" aria-labelledby="panda1">🐼</span>;
+
+```
+
+### `4`
+
+```
+✔ No known problems!
+
+```
+
+### `4: formatted`
+
+```
+<span role="img" aria-label="Snowman">☃</span>;
+
+```

packages/@romejs/js-compiler/lint/rules/jsx-a11y/accessibleEmoji.test.ts

@@ -0,0 +1,25 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { test } from "rome";
+import { testLintMultiple } from "../testHelpers";
+
+test("accessible emoji", async (t) => {
+  await testLintMultiple(
+    t,
+    [
+      // INVALID
+      '<span>🐼</span>',
+      '<i role="img" aria-label="Panda">🐼</i>',
+      // VALID
+      '<span role="img" aria-label="Panda">🐼</span>',
+      '<span role="img" aria-labelledby="panda1">🐼</span>',
+      '<span role="img" aria-label="Snowman">&#9731;</span>',
+    ],
+    { category: "lint/accessibleEmoji" }
+  );
+});

packages/@romejs/js-compiler/lint/rules/jsx-a11y/accessibleEmoji.ts

@@ -0,0 +1,65 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { Path } from '@romejs/js-compiler';
+import { AnyNode, JSXAttribute, JSXSpreadAttribute } from '@romejs/js-ast';
+import { descriptions } from '@romejs/diagnostics';
+function containsImageRole(
+  attribute: JSXAttribute | JSXSpreadAttribute
+): boolean {
+  return (
+    attribute.type === 'JSXAttribute' &&
+    attribute.name.type === 'JSXIdentifier' &&
+    attribute.name.name === 'role' &&
+    !!attribute.value &&
+    attribute.value.type === 'StringLiteral' &&
+    attribute.value.value === 'img'
+  );
+}
+
+function containsAriaLabel(
+  attribute: JSXAttribute | JSXSpreadAttribute
+): boolean {
+  return (
+    attribute.type === 'JSXAttribute' &&
+    attribute.name.type === 'JSXIdentifier' &&
+    (attribute.name.name === 'aria-label' ||
+      attribute.name.name === 'aria-labelledby') &&
+    !!attribute.value &&
+    attribute.value.type === 'StringLiteral' &&
+    attribute.value.value.length > 0
+  );
+}
+
+function containsEmoji(value: string): boolean {
+  return (/(?:[\u2700-\u27bf]|(?:\ud83c[\udde6-\uddff]){2}|[\ud800-\udbff][\udc00-\udfff]|[\u0023-\u0039]\ufe0f?\u20e3|\u3299|\u3297|\u303d|\u3030|\u24c2|\ud83c[\udd70-\udd71]|\ud83c[\udd7e-\udd7f]|\ud83c\udd8e|\ud83c[\udd91-\udd9a]|\ud83c[\udde6-\uddff]|\ud83c[\ude01-\ude02]|\ud83c\ude1a|\ud83c\ude2f|\ud83c[\ude32-\ude3a]|\ud83c[\ude50-\ude51]|\u203c|\u2049|[\u25aa-\u25ab]|\u25b6|\u25c0|[\u25fb-\u25fe]|\u00a9|\u00ae|\u2122|\u2139|\ud83c\udc04|[\u2600-\u26FF]|\u2b05|\u2b06|\u2b07|\u2b1b|\u2b1c|\u2b50|\u2b55|\u231a|\u231b|\u2328|\u23cf|[\u23e9-\u23f3]|[\u23f8-\u23fa]|\ud83c\udccf|\u2934|\u2935|[\u2190-\u21ff])/g).test(value)
+}
+
+export default {
+  name: 'accessibleEmoji',
+  enter(path: Path): AnyNode {
+    const { node } = path;
+
+    if (node.type === 'JSXElement' && node.children.length === 1) {
+      if (
+        (node.children[0].type === 'JSXText' &&
+          containsEmoji(node.children[0].value) &&
+          node.name.type === 'JSXIdentifier' &&
+          (!(node.name.name === 'span') ||
+            !node.attributes.find(containsImageRole) ||
+            !node.attributes.find(containsAriaLabel)))
+      ) {
+        path.context.addNodeDiagnostic(
+          node,
+          descriptions.LINT.ACCESSIBLE_EMOJI
+        );
+      }
+    }
+
+    return node;
+  },
+};