Subscribe: Only the first required field has error message when all the required fields empty

[XiuJuanXia]

URL: https://hcdev.openplus.ca/en/form/subscribe User Agent: Chrome Language: Both

Issue Description: When leave all the three required fields empty and activate the “Submit” button, only one error message appears for the first required field. There is no error message appears for the other two required fields. Also the error message “Please fill out this field” is too generic and not specific to the input field. Please refer to the WET form validation: https://wet-boew.github.io/wet-boew/demos/formvalid/formvalid-en.html

Steps to reproduce:

1. Navigate through the forms and leave the forms empty
2. Activate the "Submit" button
3. Error message appears.

Expected results: When leave all the required fields empty and activate the "Submit" button, related error message should appear for all the required fields.

[echouin]

@XiuJuanXia from OpenPlus: "Actually there are no error messages on for submission. What you are seeing here are the browser defaults?"

[XiuJuanXia]

@echouin, tested in Chrome and Firefox, the three fields that have red asterisk * at the end are read "required" by screen readers. And also if checking the source code, required="required" for the input fields. In this case, if we leave the three fields empty and submit the form, error message should be triggered.

[echouin]

@XiuJuanXia From OP: this is done.

[ndolter]

Link used: https://rsams.dev.cloud.openplus.ca/en/form/subscribe This is still an issue in both French and English as the error messages are not handles the same as in WET. For example:

1. The Error message Summary box does not receive focus
2. No links are provided on each of the error messages within the Summary box so that the user can navigate to the field to make corrections
3. The heading 'Error message' needs to be more precise and indicate the number of errors
4. All error messages should also appear above the required fields
5. Error messages under the heading should be numbered Please refer to https://wet-boew.github.io/v4.0-ci/demos/formvalid/formvalid-en.html

[echouin]

@ndolter from OP: RSAMS isn't using the same error reporting as WET. The existing error report passes WCAG. Could you please evaluate against WCAG AA, not WET?

[mmiron-HC]

@echouin With public facing GoC sites, we need to ensure that we have the same common look and feel providing a consistent and trustworthy online experience. WET was established to help with this. The current example (screenshot Natalie last provided) does not pass WCAG AA. There is no way for a colourblind user to quickly see which of the fields are in error - you need the inline error message. You cannot rely on colour alone to indicate an error. New issue #135 Focus order is also another issues #136

[davidgotlieb]

@mmiron-HC We are using the default WxT error handling. From OP:

WxT is not 100% WET compliant. Currently, error message handling in WxT is not done the same as it WET. It hasn't been implemented yet. It will be a major undertaking to get the WET error message handling into WxT, when it does get there, it will be pulled into RSAMS as part of the regular WXT update.

[mmiron-HC]

@zimw7 Can you bring this one over to ART. We will need to chat as a group on this one. :)