fix(work-orders): expose advanced filter pill pressed state

Keep data-selected for AAP; aria-pressed tracks the same toggle for assistive tech.
This commit is contained in:
Arthur Bassi 2026-08-21 12:09:31 -03:00
parent 776d3ebd9c
commit 07ecb4e0ab
5 changed files with 26 additions and 0 deletions

View file

@ -64,6 +64,7 @@ function IndicatorPill({
onClick={onClick} onClick={onClick}
data-indicator={kind} data-indicator={kind}
data-selected={selected ? "true" : "false"} data-selected={selected ? "true" : "false"}
aria-pressed={selected}
className="inline-flex items-center gap-1.5" className="inline-flex items-center gap-1.5"
style={{ style={{
height: 26, height: 26,

View file

@ -37,6 +37,7 @@ export function DotTogglePill({
)} )}
style={{ ...selectedStyle, ...style }} style={{ ...selectedStyle, ...style }}
{...props} {...props}
aria-pressed={selected}
> >
<span className="size-[7px] shrink-0 rounded-full" style={{ background: dotColor }} /> <span className="size-[7px] shrink-0 rounded-full" style={{ background: dotColor }} />
<span <span

View file

@ -28,6 +28,7 @@ export function TogglePill({
className, className,
)} )}
{...props} {...props}
aria-pressed={selected}
> >
{children} {children}
</button> </button>

View file

@ -28,6 +28,7 @@ export function ToggleSegment({
className, className,
)} )}
{...props} {...props}
aria-pressed={selected}
> >
{children} {children}
</button> </button>

View file

@ -234,6 +234,28 @@ describe("WorkOrders Advanced Search page wiring (SH-121)", () => {
expect(params.docStatuses).toEqual([2, 1, 3]); expect(params.docStatuses).toEqual([2, 1, 3]);
}); });
it("exposes indicator selected state as aria-pressed", () => {
const view = renderWithProviders(<WorkOrdersListPage />, {
route: "/workorders",
withAuth: false,
});
fireEvent.click(screen.getByRole("button", { name: "Advanced Filters" }));
advOpen = true;
view.rerender(<WorkOrdersListPage />);
const sheet = screen.getByRole("dialog", { name: "Advanced Filters" });
fireEvent.click(within(sheet).getByRole("button", { name: /Indicators/i }));
const names = [/Rescheduled ≥ 2/i, /Carried Over ≥ 2/i, /^Add-On$/i];
for (const name of names) {
const pill = within(sheet).getByRole("button", { name });
expect(pill).toHaveAttribute("aria-pressed", "false");
fireEvent.click(pill);
expect(pill).toHaveAttribute("aria-pressed", "true");
}
});
it("applies Indicators, Flag, and Internal WO# through the public Advanced Filters sheet", () => { it("applies Indicators, Flag, and Internal WO# through the public Advanced Filters sheet", () => {
const view = renderWithProviders(<WorkOrdersListPage />, { const view = renderWithProviders(<WorkOrdersListPage />, {
route: "/workorders", route: "/workorders",