Add role to search results sort by button

[atsansone]

From https://buganizer.corp.google.com/issues/337311368

Observed Results

Navigating through the page sort by button, listen that it is announced as a text without a role button.

• Screencast VoiceOver
• Screencast ChromeVox

Expected Results

Ensure that when the user is navigating the page and selects the sort by button it should have the correct role to the user in this case is a button which needs to be announced also the state.

Sort by button collapsed/expanded

User Impact

Screen reader and Cognitive users are affected because they listen that it is a text and is a button that has options inside.

Steps to Reproduce

1. Enabled VoiceOver using Command + F5 also ChromeVox using "Ctrl+Alt+Z'
2. Open the following page: https://docs.flutter.dev/search?q=devtools
3. Continue the linear navigation using the Tab key.
4. Reach the sort by button and listen the results in SR.

GAR Assessment

Flutter Docs

GAR Details

1.1. Do all non-text content and user interface components have meaningful accessible names and alternative text?

Environment Details

Machine: MAC/ChromeBook Browser: Chrome Version 120.0.6099.272 (Official Build) (64-bit) Screen reader: VoiceOver / ChromeVox. Bug filling time: 15 mins.

[parlough]

The search experience and UI is implemented with the Programmable/custom search engine. It generates this button, the results, etc. So outside of overriding some styling, I don't think there's much we should do on the client side to change the output.

Perhaps something can be done in the control panel to fix this and other similar issues? I'm not sure as I don't have access, but I also wonder if the team that maintains programmable search engine is tracking these issues or fixing them? Perhaps it's something best left to them as I imagine it would affect all users of the tool.