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()
+ .find('input')
+ .should.not.have.prop('aria-invalid')
+ })
+ it('is not set when error is false', () => {
+ shallow()
+ .find('input')
+ .should.not.have.prop('aria-invalid')
+ })
+ it('is set when error is true', () => {
+ shallow()
+ .find('input')
+ .should.have.prop('aria-invalid', true)
+ })
+ it('is is set when error object is provided', () => {
+ shallow(
+ ,
+ )
+ .find('input')
+ .should.have.prop('aria-invalid', true)
+ })
+ })
})