Render abp-select info as <div class="form-text"> with aria-describedby#25352
Render abp-select info as <div class="form-text"> with aria-describedby#25352
abp-select info as <div class="form-text"> with aria-describedby#25352Conversation
- Replace <small> with <div> to match abp-input and the Bootstrap 5 form-text guidance - Add aria-describedby on the select so screen readers announce the description
There was a problem hiding this comment.
Pull request overview
This PR updates the Bootstrap UI rendering for <abp-select> info text to align with <abp-input> and Bootstrap 5 guidance, aiming to improve accessibility by linking the <select> to its description via aria-describedby.
Changes:
- Render select info text using
<div class="form-text">instead of<small class="form-text">. - Attempt to add
aria-describedbyto the<select>pointing at the info text element id.
- Verify info text is rendered as <div class="form-text"> (not <small>) - Verify aria-describedby is set on the select tag
…rendering - Move inputTag.Render after GetInfoAsHtml so aria-describedby reaches the final HTML - Replace Attributes.Add with Attributes.SetAttribute for aria-describedby to avoid duplicates when [InputInfoText] and info="..." are both present - Apply the same fixes to AbpInputTagHelperService for consistency - Cover the [InputInfoText] attribute path with an additional test
There was a problem hiding this comment.
Pull request overview
This PR aligns <abp-select>’s rendered info text and accessibility wiring with Bootstrap 5 and <abp-input> by rendering info text as <div class="form-text"> and ensuring the <select> receives aria-describedby pointing at that info text element.
Changes:
- Render
<abp-select>info text using<div class="form-text">(instead of<small class="form-text">). - Ensure
aria-describedbyis applied before the<select>/<input>is rendered to HTML, and avoid duplicates viaSetAttribute(...). - Add tests for
<abp-select>info rendering +aria-describedbybehavior (including the[InputInfoText]path).
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 4 comments.
| File | Description |
|---|---|
| framework/test/Volo.Abp.AspNetCore.Mvc.UI.Tests/Volo/Abp/AspNetCore/Mvc/UI/Bootstrap/TagHelpers/Form/AbpSelectTagHelperService_Tests.cs | Adds coverage for <abp-select> info text markup and aria-describedby behavior. |
| framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/AbpSelectTagHelperService.cs | Reorders rendering so aria-describedby is applied before serialization, switches info element to <div>, and uses SetAttribute. |
| framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/AbpInputTagHelperService.cs | Applies the same render ordering and SetAttribute approach for consistency with select changes. |
- Stop using the localized text as the aria-describedby value in AddInfoTextId; reference the actual id directly - Skip rendering the InfoText id and aria-describedby when the input/select has no id (or an empty one) so the form never renders a non-unique "InfoText" id - Cover the no-id case with a new test
There was a problem hiding this comment.
Pull request overview
This PR updates Bootstrap form tag helpers to align <abp-select> help text markup with Bootstrap 5 guidance and improve accessibility by wiring the help text to the form control via aria-describedby.
Changes:
- Render
<abp-select>info/help text as<div class="form-text">(instead of<small class="form-text">) and setaria-describedbyon the<select>. - Fix ordering so
Render(...)happens afterGetInfoAsHtml(...), ensuring late-added attributes (likearia-describedby) are present in the final HTML. - Avoid duplicate
aria-describedbyattributes by usingSetAttribute(...)and add a new unit test suite for<abp-select>.
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 4 comments.
| File | Description |
|---|---|
| framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/AbpSelectTagHelperService.cs | Updates info text markup + ensures aria-describedby is applied before rendering. |
| framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/AbpInputTagHelperService.cs | Applies the same render-order and aria-describedby de-duplication approach for consistency. |
| framework/test/Volo.Abp.AspNetCore.Mvc.UI.Tests/Volo/Abp/AspNetCore/Mvc/UI/Bootstrap/TagHelpers/Form/AbpSelectTagHelperService_Tests.cs | Adds coverage for <abp-select> info element type and aria-describedby behavior. |
- Add TagHelperOutputExtensions.AppendAriaDescribedby helper that preserves caller-supplied tokens (space-separated id list) and dedupes - Replace SetAttribute calls in AddInfoTextId/GetInfoAsHtml of abp-input/abp-select with the helper - Cover the consumer-provided aria-describedby case with a new test
There was a problem hiding this comment.
Pull request overview
Updates ABP Bootstrap form tag helpers to render <abp-select> info text using Bootstrap 5’s recommended markup and to correctly wire aria-describedby so assistive technologies announce the description (aligning behavior with <abp-input> and fixing a few related issues).
Changes:
- Render
<abp-select>info text as<div class="form-text">and correctly applyaria-describedbybefore the element is rendered. - Fix
aria-describedbyhandling to avoid duplicates and avoid localizing id references; skip wiring when the control has noid. - Add
AppendAriaDescribedbyhelper and introduce new unit tests for<abp-select>behavior.
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| framework/test/Volo.Abp.AspNetCore.Mvc.UI.Tests/Volo/Abp/AspNetCore/Mvc/UI/Bootstrap/TagHelpers/Form/AbpSelectTagHelperService_Tests.cs | Adds tests validating <div class="form-text"> rendering and aria-describedby behavior (including no-id and no-duplicate scenarios). |
| framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/AbpSelectTagHelperService.cs | Updates select rendering order and info text markup; fixes aria-describedby generation and no-id behavior. |
| framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/AbpInputTagHelperService.cs | Applies the same aria-describedby timing/duplication/no-id fixes for consistency with select behavior. |
| framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Extensions/TagHelperOutputExtensions.cs | Adds AppendAriaDescribedby helper to safely merge aria-describedby tokens without duplication. |
…rService Cover the new aria-describedby behaviour for <abp-input>: - form-text rendered as <div> - aria-describedby reaches the final HTML - no-id case skips the InfoText id and aria-describedby - caller-supplied aria-describedby is preserved (append + dedupe) - [InputInfoText] attribute path produces a single aria-describedby
There was a problem hiding this comment.
Pull request overview
This PR aligns <abp-select> info-text rendering with Bootstrap 5 and improves accessibility by ensuring the rendered <select>/<input> elements are correctly wired to their info text via aria-describedby (without duplicates or overwriting caller-provided values).
Changes:
- Render
<abp-select>info text as<div class="form-text">(instead of<small>) and wirearia-describedbyto the info element id. - Fix
aria-describedbyhandling in both select/input tag helpers (render order, no-id behavior, preserve existing values, avoid duplicates) via a sharedAppendAriaDescribedbyhelper. - Add/extend unit tests covering the new rendering and
aria-describedbybehaviors for both select and input.
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/AbpSelectTagHelperService.cs | Delays rendering until after info generation so aria-describedby makes it into output; switches info element to <div class="form-text"> and appends aria-describedby safely. |
| framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/AbpInputTagHelperService.cs | Applies the same render-order and aria-describedby append/no-id logic used for select for consistency and correctness. |
| framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Extensions/TagHelperOutputExtensions.cs | Introduces AppendAriaDescribedby to preserve existing values and avoid duplicate tokens. |
| framework/test/Volo.Abp.AspNetCore.Mvc.UI.Tests/Volo/Abp/AspNetCore/Mvc/UI/Bootstrap/TagHelpers/Form/AbpSelectTagHelperService_Tests.cs | Adds new tests validating select info element markup and aria-describedby behavior (including no-id and caller-provided values). |
| framework/test/Volo.Abp.AspNetCore.Mvc.UI.Tests/Volo/Abp/AspNetCore/Mvc/UI/Bootstrap/TagHelpers/Form/AbpInputTagHelperService_Tests.cs | Extends input tests to cover info rendering and aria-describedby behaviors parallel to select. |
…tespace - Look up the existing aria-describedby attribute with OrdinalIgnoreCase to match the casing rules used by HTML and TagHelperAttributeList - Tokenize the existing value on all ASCII whitespace (space, tab, newline, carriage return, form feed) instead of just the literal space - Cover the whitespace-separated case with a new test
There was a problem hiding this comment.
Pull request overview
This PR aligns <abp-select> (and <abp-input> for consistency) with Bootstrap 5 guidance by rendering info text as <div class="form-text"> and wiring aria-describedby so assistive technologies announce the description. It also fixes ordering/attribute-handling issues so the generated aria-describedby actually reaches the rendered HTML and does not overwrite or duplicate caller-provided values.
Changes:
- Render info text using
<div class="form-text">and ensurearia-describedbyis applied before the input/select is serialized. - Add
TagHelperOutputExtensions.AppendAriaDescribedby(...)to append/dedupearia-describedbytokens without overwriting existing values. - Add/extend unit tests for
<abp-select>and<abp-input>covering the new markup andaria-describedbybehaviors (including no-id and no-duplicate scenarios).
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
| framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/AbpSelectTagHelperService.cs | Renders info as <div class="form-text"> and appends aria-describedby before rendering the <select>. |
| framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Form/AbpInputTagHelperService.cs | Applies the same render-order and aria-describedby handling fixes for <abp-input>. |
| framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Extensions/TagHelperOutputExtensions.cs | Introduces AppendAriaDescribedby to preserve/append/dedupe aria-describedby tokens. |
| framework/test/Volo.Abp.AspNetCore.Mvc.UI.Tests/Volo/Abp/AspNetCore/Mvc/UI/Bootstrap/TagHelpers/Form/AbpSelectTagHelperService_Tests.cs | New tests validating <abp-select> info element and aria-describedby behavior. |
| framework/test/Volo.Abp.AspNetCore.Mvc.UI.Tests/Volo/Abp/AspNetCore/Mvc/UI/Bootstrap/TagHelpers/Form/AbpInputTagHelperService_Tests.cs | Additional tests validating <abp-input> info element and aria-describedby behavior. |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## rel-10.2 #25352 +/- ##
============================================
- Coverage 49.78% 49.57% -0.21%
============================================
Files 3609 3575 -34
Lines 120658 118052 -2606
Branches 9215 9040 -175
============================================
- Hits 60069 58526 -1543
+ Misses 58794 57766 -1028
+ Partials 1795 1760 -35 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
Render
<abp-select>info text as<div class="form-text">to match<abp-input>and Bootstrap 5, and wire uparia-describedbyon the<select>.Along the way, fix several pre-existing issues that also affected
<abp-input>:GetInfoAsHtmlsoaria-describedbyactually reaches the final HTML.aria-describedbytokens via a newAppendAriaDescribedbyhelper instead of overwriting caller-supplied values.AddInfoTextId(no localizer detour).InfoTextid andaria-describedbywhen the input/select has no id.Tests cover both
<abp-input>and<abp-select>: rendered element, base / caller-preserved / whitespace / no-id /[InputInfoText]cases foraria-describedby.