[BUG] Character Count component removes error attributes from server-side rendered components

[lewisdorigo]

Description of the issue

When the Character Count component initialises, if the length of a field value's length is less than the max length, it will remove the ds_input--error class from the field, and set aria-invalid to false.

This causes issues when the field should display with an initial error, e.g. when form page submission triggers a full-page refresh to display server-side form validation errors.

When the Character Count is initialised, the initial ds_input--error class is removed, and aria-invalid is set to false.

Steps to reproduce the issue

On an HTML page using the design system, add the following:

<div
    class="ds_question ds_question--error"
    id="firstName-question"
    data-module="ds-character-count"
    data-threshold="50"
>
    <label class="ds_label" for="firstName">First name</label>
    <p class="ds_question__error-message">Enter first name</p>
    <input
        type="text"
        name="firstName"
        id="firstName"
        class="ds_input ds_input--fixed-20 ds_input--error"
        maxlength="65"
        value=""
        aria-invalid="true"
    />
</div>

Expected behaviour

When the Character Count component initialises, the ds_input--error class remains, and the aria-invalid attribute remains set to true.

When updating the the field, if container has an error message, the class name and aria-invalid attribute should not be changed.

Actual results

The ds_input--error class is removed, and the aria-invalid attribute is changed to false.

Environment

• Operating system: macOS 15.0 Sequoia
• Browser: All
• Browser version: All
• Design System version: v2.3.0

[jsutcliffe]

This is an interesting oversight that brings a larger issue to light. We can say that exceeding the character limit makes a field invalid, but reducing that back to an allowed number of characters won't necessarily mean that the field is valid -- there could be other validation rules to consider.

[lewisdorigo]

A short term fix could be that — if the field has aria-invalid set when the character count is initialised — it won’t be removed.

That would help resolve our issue in the short term while more robust, long-term solution is considered.

[jsutcliffe]

We'll be putting that fix out in the next release.

[dkindnes]

@lewisdorigo this should now be fixed in the latest release v2.3.2