🎨 Palette: Improve accessibility and native UX for search inputs#321
🎨 Palette: Improve accessibility and native UX for search inputs#321EffortlessSteven wants to merge 1 commit intomainfrom
Conversation
Updated the AC coverage search inputs in `crates/app-http/src/platform/ui.rs` and `crates/http-platform/src/ui.rs` to use `type="search"` instead of `type="text"` and added an explicit `aria-label`. This fixes an accessibility anti-pattern of relying solely on `placeholder` text, and enables native browser features like the clear ("x") button.
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
|
Warning You have reached your daily quota limit. Please wait up to 24 hours and I will start processing your requests again! |
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: ASSERTIVE Plan: Pro Run ID: 📒 Files selected for processing (2)
Summary by CodeRabbit
WalkthroughSearch input elements in coverage view pages were updated to use semantic HTML Changes
Estimated code review effort🎯 1 (Trivial) | ⏱️ ~3 minutes Poem
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Test Results283 tests 245 ✅ 11m 14s ⏱️ Results for commit 8726530. |
💡 What:
Updated the AC coverage search input to use
type="search"instead oftype="text", and added an explicitaria-label="Search by AC ID or title". These changes were made consistently across bothcrates/app-http/src/platform/ui.rsandcrates/http-platform/src/ui.rs.🎯 Why:
Relying solely on a
placeholderattribute for context is an accessibility anti-pattern, as screen readers may not consistently announce it, and it disappears when text is entered. Adding anaria-labelensures the input's purpose is always clear to assistive technologies. Additionally, switching totype="search"enables native browser enhancements, such as the built-in "clear" (x) button on many modern browsers, providing a smoother user experience.📸 Before/After:
No major visual layout changes. The input now functions natively as a search field and may include a clear button depending on the user's browser. (Verified via Playwright screenshot during implementation).
♿ Accessibility:
aria-labelto provide context to screen readers, resolving the anti-pattern of relying onplaceholderalone.type="search".PR created automatically by Jules for task 16720853255015333569 started by @EffortlessSteven