{"action":"opened","issue":{"url":"https://api.github.com/repos/peteryates/govuk_elements_form_builder/issues/2","repository_url":"https://api.github.com/repos/peteryates/govuk_elements_form_builder","labels_url":"https://api.github.com/repos/peteryates/govuk_elements_form_builder/issues/2/labels{/name}","comments_url":"https://api.github.com/repos/peteryates/govuk_elements_form_builder/issues/2/comments","events_url":"https://api.github.com/repos/peteryates/govuk_elements_form_builder/issues/2/events","html_url":"https://github.com/peteryates/govuk_elements_form_builder/issues/2","id":395253469,"node_id":"MDU6SXNzdWUzOTUyNTM0Njk=","number":2,"title":"Error message attributes don't work for radio_button_fieldset","user":{"login":"peteryates","id":128088,"node_id":"MDQ6VXNlcjEyODA4OA==","avatar_url":"https://avatars2.githubusercontent.com/u/128088?v=4","gravatar_id":"","url":"https://api.github.com/users/peteryates","html_url":"https://github.com/peteryates","followers_url":"https://api.github.com/users/peteryates/followers","following_url":"https://api.github.com/users/peteryates/following{/other_user}","gists_url":"https://api.github.com/users/peteryates/gists{/gist_id}","starred_url":"https://api.github.com/users/peteryates/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/peteryates/subscriptions","organizations_url":"https://api.github.com/users/peteryates/orgs","repos_url":"https://api.github.com/users/peteryates/repos","events_url":"https://api.github.com/users/peteryates/events{/privacy}","received_events_url":"https://api.github.com/users/peteryates/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2019-01-02T13:48:33Z","updated_at":"2019-01-02T13:48:33Z","closed_at":null,"author_association":"OWNER","body":"When using the `#radio_button_fieldset` method on an invalid object, somewhere along the way `aria-describedby=\"error_message_person_gender_yes\"` is added to the radio button inputs (see `.add_error_to_html_tag!`, `.add_error_to_input!` and `.add_error_to_label!` private class methods).\r\n\r\nThis is *probably* fine for most inputs but in the case of a radio button fieldset, the error message only makes sense *at the fieldset level*, rather than for each input within.\r\n\r\nHere's the default output at the moment (from per the original test, of course `gender` isn't boolean!)\r\nAs we can see, the `aria-describedby` target doesn't exist and therefore [this is invalid](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute).\r\n\r\n```html\r\n<div class=\"form-group form-group-error\" id=\"error_person_gender\">\r\n    <fieldset>\r\n        <legend><span class=\"form-label-bold\">Gender</span><span class=\"error-message\">Gender is required</span><span class=\"form-hint\">Select→\r\n        <div class=\"multiple-choice\">\r\n            <input aria-describedby=\"error_message_person_gender_yes\" type=\"radio\" value=\"yes\" name=\"person[gender]\" id=\"person_gender_yes\" />\r\n            <label for=\"person_gender_yes\">Yes</label>\r\n        </div>\r\n        <div class=\"multiple-choice\">\r\n            <input aria-describedby=\"error_message_person_gender_no\" type=\"radio\" value=\"no\" name=\"person[gender]\" id=\"person_gender_no\" />\r\n            <label for=\"person_gender_no\">No</label>\r\n        </div>\r\n    </fieldset>\r\n</div>\r\n```\r\nSo, this shouldn't happen. It's likely that the logic in `.add_error_to_html_tag!`, *especially* the following case statement needs to be re-jigged and made to be compliant both with the GDS guidelines and the [Web Accessibility Initiative – Accessible Rich Internet Applications](https://www.w3.org/TR/wai-aria/#aria-describedby) spec.\r\n\r\n```ruby\r\ncase html_tag\r\nwhen /^<label/\r\n  add_error_to_label! html_tag, object_name, object\r\nwhen /^<input/\r\n  add_error_to_input! html_tag, 'input'\r\nwhen /^<textarea/\r\n  add_error_to_input! html_tag, 'textarea'\r\nelse\r\n  html_tag\r\nend\r\n```"}}
{"actor":{"display_login":"peteryates"}}