Fix - Refactor PNI sort dropdown for HTML validation errors and accessibility

[Morsey187]

Description

Link to sample test page: https://foundation.mozilla.org/en/privacynotincluded/
Related PRs/issues: #11607

Decided against “progressively enhanced by starting with a form, select, options and a submit button.” as mentioned in the linked issue, as this would require more time refactoring (lots of existing code tied to searchFilter etc.), instead I’ve reused existing styling but altered the element types and added aria labels.

• Minor changes in styling to support refactoring the DOM for accessibility.
• Similar to PNI Category nav not accessible and invalid #11606 I focused on updating the existing code instead of refactoring to avoid investing too much time on the issue, although happy to make any changes and alterations.

Testing instructions

• Visit /privacynotincluded page
• Run page through a html validatior
• Test the components general functionaility along with using a screenreader.
• Compare styling changes https://foundation.mozilla.org/en/privacynotincluded/
  • Theres an extra border splitting the button and dropdown menu now

screenshots

Checklist

Tests

• Is the code I'm adding covered by tests?

Changes in Models:

• Did I update or add new fake data?
• Did I squash my migration?
• Are my changes backward-compatible. If not, did I schedule a deploy with the rest of the team?

Documentation:

• Is my code documented?
• Did I update the READMEs or wagtail documentation?

Merge Method
💡❗Remember to use squash merge when merging non-feature branches into main

┆Issue is synchronized with this Jira Story

[jhonatan-lopes]

@mmmavis this one is still failing linting here but my local copy doesn't show anything out of the ordinary. Could you please try it locally on your side?

[mmmavis]

@jhonatan-lopes There were some indentation issues and running inv format-html fixed them for me. I have committed the changes.

[jhonatan-lopes]

Thanks @mmmavis

[mmmavis]

Hey @jhonatan-lopes , Ben's PR looks good! I did push some changes to 1) remove an extra class 2) tidy up implementation for a method to hopefully improve code readability. Could you give my commit a review?

[jhonatan-lopes]

LGTM 👍 thanks @mmmavis and @Morsey187