fix(mobile): announce which Show and rating chip is chosen

MChip only showed its state through colour. A pressable option renders
aria-pressed from active; the places filter's Show and rating floor chips use
it, and the tests now check the chosen chip by its pressed state.
This commit is contained in:
EvKoh
2026-10-03 15:51:34 +02:00
committed by Maurice
parent 3951e8cc9a
commit db3c9d660e
5 changed files with 21 additions and 5 deletions
@@ -178,6 +178,7 @@ describe('MPlacesBrowser', () => {
const floors = screen.getByRole('group', { name: 'Filter by rating' })
fireEvent.click(within(floors).getByRole('button', { name: '4+' }))
expect(useTripStore.getState().placesRatingFilter).toBe(4)
expect(within(floors).getByRole('button', { name: '4+' })).toHaveAttribute('aria-pressed', 'true')
expect(screen.getByText('Louvre')).toBeInTheDocument()
expect(screen.queryByText('Eiffel Tower')).not.toBeInTheDocument()
expect(screen.queryByText('Seine Track')).not.toBeInTheDocument()
@@ -56,15 +56,23 @@ describe('MPlacesFilterSheet', () => {
it('FE-MOB-PFSHEET-003: picking a pool writes it to the trip store', async () => {
renderSheet()
await screen.findByRole('dialog', { name: 'Filters' })
fireEvent.click(within(group('Show')).getByRole('button', { name: 'Unplanned' }))
const show = group('Show')
expect(within(show).getByRole('button', { name: 'All' })).toHaveAttribute('aria-pressed', 'true')
fireEvent.click(within(show).getByRole('button', { name: 'Unplanned' }))
expect(useTripStore.getState().placesFilter).toBe('unplanned')
// The chosen chip says so to a screen reader, and only that one.
expect(within(show).getByRole('button', { name: 'Unplanned' })).toHaveAttribute('aria-pressed', 'true')
expect(within(show).getByRole('button', { name: 'All' })).toHaveAttribute('aria-pressed', 'false')
})
it('FE-MOB-PFSHEET-004: picking a floor writes the rating filter to the trip store', async () => {
renderSheet()
await screen.findByRole('dialog', { name: 'Filters' })
fireEvent.click(within(group('Filter by rating')).getByRole('button', { name: '3+' }))
const floors = group('Filter by rating')
fireEvent.click(within(floors).getByRole('button', { name: '3+' }))
expect(useTripStore.getState().placesRatingFilter).toBe(3)
expect(within(floors).getByRole('button', { name: '3+' })).toHaveAttribute('aria-pressed', 'true')
expect(within(floors).getByRole('button', { name: 'All' })).toHaveAttribute('aria-pressed', 'false')
})
it('FE-MOB-PFSHEET-005: categories toggle in and out of the shared set, "no category" included', async () => {