fix(useInputAccessibility): current validation message is announced - FE-7522

[DipperTheDan]

We are seeing an accessibility issue in a form where the screen reader (VoiceOver or NVDA) announces the previous error message instead of the current one when the validation state of a field. This fix address the underlying cause of this issue by making sure the aria-describedby is updated if the validation message changes.

fix #7612

Proposed behaviour

When a validation message is dynamically updated in our input-based components, the new (or current) validation message should be announced.

Current behaviour

screen reader (VoiceOver or NVDA) announces the previous error message instead of the current one when the validation state of a field.

Checklist

• Commits follow our style guide
• Related issues linked in commit messages if required
• Screenshots are included in the PR if useful
• All themes are supported if required
• Unit tests added or updated if required
• Playwright automation tests added or updated if required
• Storybook added or updated if required
• Translations added or updated (including creating or amending translation keys table in storybook) if required
• Typescript d.ts file added or updated if required
• Related docs have been updated if required

QA

• Tested in provided StackBlitz sandbox/Storybook
• Add new Playwright test coverage if required
• Carbon implementation matches Design System/designs
• UI Tests GitHub check reviewed if required

Additional context

The commit message is not ideal but we are limited to 72 characters. Ideally I would like to have said "ensure that current validation message is read out by a screenreader when the message is dynamically updated"

Testing instructions

• There should be no regressions regarding screenreader behaviour with our input-based components.
• Ensure that the screenreader announces the latest validation message on the example in Form -> Test -> Dynamic validations.