search

kitconcept / volto-form-builder

An interactive form builder for Volto, that allows editors to assemble forms via drag and drop.
4 stars 5 forks source link

check for accessibility violations #43

Open tisto opened 3 years ago

tisto commented 3 years ago

@iFlameing I added an accessiblity check to the Cypress tests (axe) that reports violations. I would like you to familiarize yourself with accessibility of forms (I send you some pointers to that already). Please make sure you understand what it takes to write accessible forms and make sure you stick to those rules and best practices. I want you to understand what you are doing before fixing those violations.

tisto commented 3 years ago

@iFlameing pls document this behavior of semantic ui properly.

iFlameing commented 3 years ago

@tisto I found that the ids present because of what we are doing in our widgets. It has nothing to do with semantic UI. If we don't provide fieldSet props to the widget then Form.Field(which is a div) gets the same id as labels. You can see this by visiting these two links.

https://github.com/plone/volto/blob/master/src/components/manage/Widgets/FormFieldWrapper.jsx#L106 https://github.com/plone/volto/blob/master/src/components/manage/Widgets/FormFieldWrapper.jsx#L113

That's why axe is failing. We have two solutions we can provide fieldsets to the widget or we can modify the Volto core for using a better approach of adding an id to Form.Field.

tisto commented 3 years ago

@iFlameing ok, then I guess we should fix this in Volto core.

iFlameing commented 3 years ago

@tisto created pr in volto core https://github.com/plone/volto/pull/2102