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.

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

feat(StructureList): refactor class components, add aria table roles #8084

Merged

Conversation

dakahn
Copy link
Contributor

@dakahn dakahn commented Mar 13, 2021

part of #1937

We're working on #1937 and taking the opportunity to update StructuredList from an es6 class components to functional components w/hooks. StructuredList also seemed to to have no table markup whatsoever so i've added some basic aria roles making the component identifiable as a table to screen readers.

Testing / Reviewing

This PR shouldn't have any visible changes or functionality changes whatsoever.

@dakahn
Copy link
Contributor Author

dakahn commented Mar 13, 2021

@tw15egan can't figure out why the unit test for unique IDs is failing. getInstanceId() seems to be working as intended -- at least I think it is 😕

Don't have a whole lot of enzyme experience but is that failing test looking for a uid prop?

@netlify
Copy link

netlify bot commented Mar 13, 2021

Deploy preview for carbon-elements ready!

Built with commit 686815d

https://deploy-preview-8084--carbon-elements.netlify.app

@netlify
Copy link

netlify bot commented Mar 13, 2021

Deploy preview for carbon-components-react ready!

Built with commit 70eba6e

https://deploy-preview-8084--carbon-components-react.netlify.app

@netlify
Copy link

netlify bot commented Mar 13, 2021

Deploy preview for carbon-components-react ready!

Built with commit 686815d

https://deploy-preview-8084--carbon-components-react.netlify.app

const { children, className, ...other } = props;
const classes = classNames(`${prefix}--structured-list-tbody`, className);
const { labelRows, setLabelRows } = useState(null);
const { rowSelected, setRowSelected } = useState(0);
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this is kinda weird, probably something i'm missing, but setLabel and rowSelected were tracked in state, but unused?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

AFAIK StructuredList hasn't been touched in quite some time and could definitely have some leftover unused hooks that may need to be refactored

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Totally the case -- just got rid of em

@andreancardona
Copy link
Contributor

@dakahn I think we need to update tests!

@dakahn
Copy link
Contributor Author

dakahn commented Mar 16, 2021

wrapper.instance() checks against a class instance for a prop called uid. I updated the test to instead just check for unique id attributes being assigned correclty 👍🏽 @tw15egan

Copy link
Contributor

@andreancardona andreancardona left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yay!

Copy link
Member

@tw15egan tw15egan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM 👍 ✅

@tw15egan
Copy link
Member

@dakahn just confirming, is selection via keyboard the next step as part of #1937?

@dakahn
Copy link
Contributor Author

dakahn commented Mar 18, 2021

@tw15egan yep! This refactor is preliminary work before we start hacking on 1937 👍🏽

@dakahn dakahn merged commit 79c909c into carbon-design-system:main Mar 18, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants