From e6bfd5cb7c060fcaf54ede85a1be74ebe2f60d1e Mon Sep 17 00:00:00 2001
From: gorohash <hayato-shimoji@cybozu.co.jp>
Date: Mon, 6 Jul 2020 22:15:31 +0900
Subject: [PATCH] [New] `anchor-has-content`: Allow title attribute OR
 aria-label attribute

---
 __tests__/src/rules/anchor-has-content-test.js | 3 +++
 docs/rules/anchor-has-content.md               | 4 ++++
 src/rules/anchor-has-content.js                | 5 +++++
 3 files changed, 12 insertions(+)

diff --git a/__tests__/src/rules/anchor-has-content-test.js b/__tests__/src/rules/anchor-has-content-test.js
index 0935395e0..eb47e8e55 100644
--- a/__tests__/src/rules/anchor-has-content-test.js
+++ b/__tests__/src/rules/anchor-has-content-test.js
@@ -36,6 +36,9 @@ ruleTester.run('anchor-has-content', rule, {
       code: '<Link>foo</Link>',
       settings: { 'jsx-a11y': { components: { Link: 'a' } } },
     },
+    { code: '<a title={title} />' },
+    { code: '<a aria-label={ariaLabel} />' },
+    { code: '<a title={title} aria-label={ariaLabel} />' },
   ].map(parserOptionsMapper),
   invalid: [
     { code: '<a />', errors: [expectedError] },
diff --git a/docs/rules/anchor-has-content.md b/docs/rules/anchor-has-content.md
index f49937e57..03082fbb9 100644
--- a/docs/rules/anchor-has-content.md
+++ b/docs/rules/anchor-has-content.md
@@ -6,6 +6,8 @@
 
 Enforce that anchors have content and that the content is accessible to screen readers. Accessible means that it is not hidden using the `aria-hidden` prop. Refer to the references to learn about why this is important.
 
+Alternatively, you may use the `title` prop or the `aria-label` prop.
+
 ## Rule options
 
 This rule takes one optional object argument of type object:
@@ -45,6 +47,8 @@ return (
 <a>Anchor Content!</a>
 <a><TextWrapper /></a>
 <a dangerouslySetInnerHTML={{ __html: 'foo' }} />
+<a title='foo' />
+<a aria-label='foo' />
 ```
 
 ### Fail
diff --git a/src/rules/anchor-has-content.js b/src/rules/anchor-has-content.js
index fb9386fb3..3381b4f6b 100644
--- a/src/rules/anchor-has-content.js
+++ b/src/rules/anchor-has-content.js
@@ -7,6 +7,8 @@
 // Rule Definition
 // ----------------------------------------------------------------------------
 
+import { hasAnyProp } from 'jsx-ast-utils';
+
 import getElementType from '../util/getElementType';
 import { arraySchema, generateObjSchema } from '../util/schemas';
 import hasAccessibleChild from '../util/hasAccessibleChild';
@@ -40,6 +42,9 @@ export default {
         if (hasAccessibleChild(node.parent, elementType)) {
           return;
         }
+        if (hasAnyProp(node.attributes, ['title', 'aria-label'])) {
+          return;
+        }
 
         context.report({
           node,