DRYD-2173: Accessibility > Administration: Add Users and Roles > Various Errors

[spirosdi]

What does this do?
Fixes a11y issues of Role and User Admin pages:

• Change border of PermissionsInput radio buttons, fixing color contrast
• Hide radio button labels with a clip-based rule instead of font-size: 1px, fixing very small text
• Render PermissionsInput and RolesInput as fieldset instead of as orphaned labels
• Set AuthRolePage and AccountPage headingLevel to 2, fixing skipped heading level
• Remove hidden text input that was used to stop Enter from submitting the form. Use an inline onSubmit handler instead. Fixing missing form label

Why are we doing this? (with JIRA link)
https://collectionspace.atlassian.net/browse/DRYD-2173. The Add Role and Add User pages failed the accessibility review with contrast, orphaned label, skipped heading, very small text, and missing form label errors.

How should this be tested? Do these changes have associated tests?
Automated tests have been updated

Manual test:
Please link

• DRYD-2173: Accessibility > Administration: Add Users and Roles > Various Errors cspace-input.js#31
• DRYD-2173: Accessibility > Administration: Add Users and Roles > Various Errors cspace-layout.js#12

into cspace-ui and follow the manual steps:

1. Go to Administration > Roles and click Create new. Run WAVE. There should be no contrast error on the radio buttons, no orphaned or missing form label, no skipped heading level, and no very small text alerts
2. With a display name entered, press Enter in the Name field. The page should not reload or add a query string to the URL.
3. Go to Administration > Users and click Create new. Run WAVE and confirm the Roles label is no longer orphaned.

Dependencies for merging? Releasing to production?
The

• DRYD-2173: Accessibility > Administration: Add Users and Roles > Various Errors cspace-input.js#31
• DRYD-2173: Accessibility > Administration: Add Users and Roles > Various Errors cspace-layout.js#12

are dependencies

Has the application documentation been updated for these changes?
Changelog has been updated

Did someone actually run this code to verify it works?
@spirosdi ran it locally using core.dev as backend.

Have any new accessibility violations been handled?
no new a11y violations

[spirosdi]

Please ignore the failing tests, the error is the missing labelToLegend function that is exported by the cspace-input dependency PR change. As soon as the dependency PRs are published, the tests should pass.

[mikejritter]

Tested both the Permissions and User pages to verify the Permissions and Role input changes.