Merge pull request #51 from rackt/no-label-required-for-presentation-…

…role Elements with a role of presentation should not require a label
reactjs · Jun 8, 2015 · e6b3df5 · e6b3df5
2 parents 1239d62 + 2c47c8d
commit e6b3df5
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/lib/__tests__/index-test.js b/lib/__tests__/index-test.js
@@ -194,6 +194,12 @@ describe('labels', () => {
     });
   });
 
+  it('does not warn when the ARIA role is presentation', () => {
+    doNotExpectWarning(assertions.render.NO_LABEL.msg, () => {
+      <span role="presentation" />;
+    });
+  });
+
   it('does not warn if the element is not interactive', () => {
     doNotExpectWarning(assertions.render.NO_LABEL.msg, () => {
       <div />;

diff --git a/lib/assertions.js b/lib/assertions.js
@@ -180,11 +180,16 @@ exports.render = {
   NO_LABEL: {
     msg: 'You have an unlabled element or control. Add `aria-label` or `aria-labelled-by` attribute, or put some text in the element.',
     test (tagName, props, children, failureCB) {
-      if (!(isInteractive(tagName, props) || props.role))
+      var labelRequired = (
+          isInteractive(tagName, props) ||
+          props.role && props.role != 'presentation'
+        );
+
+      if (!labelRequired)
         return;
 
       var failed = !(
-        (isInteractive(tagName, props) || props.role) &&
+        labelRequired &&
         (
           props['aria-label'] ||
           props['aria-labelled-by'] ||