From d0dc3c4d3faf15c9bc2328b410a383f9f1c52919 Mon Sep 17 00:00:00 2001
From: aoelen <aoelen@users.noreply.github.com>
Date: Wed, 19 Aug 2020 15:54:37 +0200
Subject: [PATCH] fix(FormField): fix aria-invalid on error false (#4043)

---
 src/collections/Form/FormField.js             |  2 +-
 test/specs/collections/Form/FormField-test.js | 31 +++++++++++++++++++
 2 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/src/collections/Form/FormField.js b/src/collections/Form/FormField.js
index a99f3e465a..9c90e5099d 100644
--- a/src/collections/Form/FormField.js
+++ b/src/collections/Form/FormField.js
@@ -100,7 +100,7 @@ function FormField(props) {
   const ariaDescribedBy = id && error ? `${id}-error-message` : null
   const ariaAttrs = {
     'aria-describedby': ariaDescribedBy,
-    'aria-invalid': error !== undefined ? true : undefined,
+    'aria-invalid': error ? true : undefined,
   }
   const controlProps = { ...rest, content, children, disabled, required, type, id }
 
diff --git a/test/specs/collections/Form/FormField-test.js b/test/specs/collections/Form/FormField-test.js
index 017414f4fe..b41d6324d1 100644
--- a/test/specs/collections/Form/FormField-test.js
+++ b/test/specs/collections/Form/FormField-test.js
@@ -215,4 +215,35 @@ describe('FormField', () => {
       expect(fieldId).to.equal('testId')
     })
   })
+
+  describe('aria-invalid', () => {
+    it('is not set by default', () => {
+      shallow(<FormField control='input' />)
+        .find('input')
+        .should.not.have.prop('aria-invalid')
+    })
+    it('is not set when error is false', () => {
+      shallow(<FormField control='input' error={false} />)
+        .find('input')
+        .should.not.have.prop('aria-invalid')
+    })
+    it('is set when error is true', () => {
+      shallow(<FormField control='input' error />)
+        .find('input')
+        .should.have.prop('aria-invalid', true)
+    })
+    it('is is set when error object is provided', () => {
+      shallow(
+        <FormField
+          control='input'
+          error={{
+            content: 'Error message',
+            pointing: 'left',
+          }}
+        />,
+      )
+        .find('input')
+        .should.have.prop('aria-invalid', true)
+    })
+  })
 })