fix: Preserve validation styles for disabled inputs - #4959
Conversation
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #4959 +/- ##
=======================================
Coverage 97.66% 97.66%
=======================================
Files 959 959
Lines 31342 31342
Branches 11577 11577
=======================================
Hits 30610 30610
Misses 725 725
Partials 7 7 ☔ View full report in Codecov by Harness. 🚀 New features to boost your workflow:
|
There was a problem hiding this comment.
Pull request overview
Preserves invalid and warning validation border styles for adorned Input instances when the control is disabled, aligning the adorned-container behavior with the non-adorned input styling model.
Changes:
- Reordered
.input-adorned-containermodifier blocks so invalid/warning styles can override the disabled border styling in the CSS cascade. - Added a unit test to ensure the adorned container keeps the
invalidmodifier whendisabledis also set.
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| src/input/styles.scss | Reorders adorned-container modifier styling to preserve validation borders when disabled. |
| src/input/tests/adornments.test.tsx | Adds coverage ensuring disabled + invalid retains both modifier classes. |
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
gethinwebster
left a comment
There was a problem hiding this comment.
Can we make sure that this will show up in visual regression tests too? At least the ones that run in pipelines, ideally also the ones that now run in github
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
PR #4852 adda the test suite, i've added the permutation here. |
Description
Preserve invalid and warning border styles when adorned Inputs are disabled.
This fix is based on CSS cascade ordering: the disabled modifier must be defined before the validation modifiers so invalid/warning border styles can override the disabled border color when both classes are present. Adding an explicit comment here will help prevent accidental reordering regressions.
Related links, issue #, if available: n/a
How has this been tested?
Review checklist
The following items are to be evaluated by the author(s) and the reviewer(s).
Correctness
CONTRIBUTING.md.CONTRIBUTING.md.Security
checkSafeUrlfunction.Testing
By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.