Skip to content

Improve form validation accessibility - #934

Open
web3blind wants to merge 1 commit into
pkp:mainfrom
web3blind:fix/form-validation-a11y
Open

Improve form validation accessibility#934
web3blind wants to merge 1 commit into
pkp:mainfrom
web3blind:fix/form-validation-a11y

Conversation

@web3blind

Copy link
Copy Markdown

Summary

  • Moves focus to the visible form error summary when validation errors first appear on the current form page.
  • Removes aria-invalid from valid form controls and only renders aria-invalid="true" when the field has validation errors.
  • Adds the field error message id to aria-describedby when errors are present, so the invalid field is programmatically associated with its error text.

Related issues

Addresses the Vue form stack used by the OJS submission workflow:

Verification

  • npm test -- --run — 6 files / 58 tests passed.
  • npx eslint src/components/Form/FormErrors.vue src/components/Form/FormPage.vue src/components/Form/fields/FieldBase.vue src/components/Form/fields/FieldText.vue src/components/Form/fields/FieldTextarea.vue src/components/Form/fields/FieldSelect.vue src/components/Form/fields/FieldDate.vue src/components/Form/fields/FieldOptions.vue src/components/Form/fields/FieldRadioInput.vue src/components/Form/fields/FieldMetadataSetting.vue src/components/Form/fields/FieldPubId.vue src/components/Form/fields/FieldArchivingPn.vue — 0 errors; existing warnings only.
  • git diff --check — passed.

Note: npm run lint currently exits before linting because the upstream script passes --ignore-path while this checkout uses eslint.config.js; the targeted ESLint command above avoids that script-level blocker.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant