Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Accessibility warnings on DueelingPicklist Group implementation #4340

Closed
1 task done
edleeks87 opened this issue Aug 27, 2021 · 2 comments
Closed
1 task done

Accessibility warnings on DueelingPicklist Group implementation #4340

edleeks87 opened this issue Aug 27, 2021 · 2 comments
Labels
Bug On Backlog released Squad Front End

Comments

@edleeks87
Copy link
Contributor

Current behaviour

The implementation for DuellingPicklist groups renders invalid markup: the StyledGroupWrapper is a div element which is a child direct of the Picklist which is a ul element. In turn the StyledPicklistGroup are li elements and they are direct children of StyledGroupWrapper.

Expected behaviour

Valid markup so no errors are thrown in the accessibility tab in storybook for the linked story.

CodeSandbox or Storybook URL

https://carbon.sage.com/?path=/story/design-system-duellingpicklist--grouped

Suggested Solution

Change the StyledGroupWrapper to be a li element and then have it render a ul as its direct child and the StyledPicklistGroups children of that

  <StyledGroupWrapper> <!--li-->
    <ul>
      <StyledPicklistGroup> ... </StyledPicklistGroup>
    </ul>
  </StyledGroupWrapper>

Carbon Version

latest

What browsers are you seeing the problem on?

Firefox, Chrome, Safari, Microsoft Edge

What Operating System are you seeing the problem on?

MacOS, Windows, Linux, Android, iOS

Anything else we should know?

No response

Confidentiality

  • I confirm there is no confidential or commercially sensitive information included.
@edleeks87 edleeks87 added Bug triage Triage Required On Backlog Squad Front End and removed triage Triage Required labels Aug 27, 2021
@edleeks87
Copy link
Contributor Author

FE-4296

@samtjo samtjo closed this as completed in f73d26f Oct 7, 2021
carbonci pushed a commit that referenced this issue Oct 7, 2021
@semantic-release-bot @carbonci
chore(release): 93.0.2
b36cf5a 
### [93.0.2](v93.0.1...v93.0.2) (2021-10-07)

### Bug Fixes

* **duelling-picklist:** correct dom structure of picklist groups ([f73d26f](f73d26f)), closes [#4340](#4340)
@carbonci
Copy link
Collaborator

carbonci commented Oct 7, 2021

🎉 This issue has been resolved in version 93.0.2 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Bug On Backlog released Squad Front End
Milestone
No milestone
Development

No branches or pull requests
2 participants
@edleeks87 @carbonci