Issue/5154 Accessibility compliance #5745
Conversation
| @@ -37,7 +37,7 @@ export const CompileStageReportTable: React.FC<Props> = ({ | |||
| <Table {...props} variant={TableVariant.compact}> | |||
| <Thead> | |||
| <Tr> | |||
| <Th key="toggle" /> | |||
| <Th aria-hidden key="toggle"></Th> | |||
There was a problem hiding this comment.
| <Th aria-hidden key="toggle"></Th> | |
| <Th aria-hidden key="toggle"></Th> |
| <Th aria-hidden key="toggle"></Th> | |
| <Th aria-hidden key="toggle"/> |
There was a problem hiding this comment.
Both are valid, but if you have any arguments about it, I'll gladly change it.
There was a problem hiding this comment.
Right, I just personally gravitate towards self-closing tags, probably as it most of the time if there are separate closing brackets then it feels like it should be something between them. But that's just me :D
| @@ -41,7 +41,7 @@ export const OrderDetailsTable: React.FC<Props> = ({ | |||
| <Table {...props} variant={TableVariant.compact}> | |||
| <Thead> | |||
| <Tr> | |||
| <Th style={{ width: "15px" }}></Th> | |||
| <Th style={{ width: "15px" }} aria-hidden></Th> | |||
There was a problem hiding this comment.
| <Th style={{ width: "15px" }} aria-hidden></Th> | |
| <Th style={{ width: "15px" }} aria-hidden></Th> |
| <Th style={{ width: "15px" }} aria-hidden></Th> | |
| <Th style={{ width: "15px" }} aria-hidden /> |
| @@ -66,7 +66,7 @@ export const ResourcesTable: React.FC<Props> = ({ | |||
| <Table {...props} variant={TableVariant.compact}> | |||
| <Thead> | |||
| <Tr> | |||
| <Th></Th> | |||
| <Th aria-hidden></Th> | |||
There was a problem hiding this comment.
Now as I take a look, shouldn't the {heads} be inside of the <Th>. that or just change the that component to be self-closing
There was a problem hiding this comment.
Those empty Head tags are on purpose to have a column without title for the collapsible arrows
| @@ -62,7 +62,7 @@ export const DiscoveredResourcesTable: React.FC<Props> = ({ | |||
| <Table {...props} variant={TableVariant.compact}> | |||
| <Thead> | |||
| <Tr> | |||
| <Th></Th> | |||
| <Th aria-hidden></Th> | |||
There was a problem hiding this comment.
same here, I know that it wasn't changed by you, but I just noticed that so wanted to point it out :)
| @@ -40,7 +40,7 @@ export const HistoryTable: React.FC<Props> = ({ service, logs }) => { | |||
| <Table> | |||
| <Thead> | |||
| <Tr> | |||
| <Th /> | |||
| <Th aria-hidden></Th> | |||
There was a problem hiding this comment.
| <Th aria-hidden></Th> | |
| <Th aria-hidden></Th> |
| <Th aria-hidden></Th> | |
| <Th aria-hidden /> |
| @@ -78,7 +79,7 @@ export const InventoryTable: React.FC<Props> = ({ | |||
| <Table {...props}> | |||
| <Thead> | |||
| <Tr> | |||
| <Th /> | |||
| <Th aria-hidden></Th> | |||
There was a problem hiding this comment.
| <Th aria-hidden></Th> | |
| <Th aria-hidden></Th> |
| <Th aria-hidden></Th> | |
| <Th aria-hidden /> |
|
Processing this pull request |
# Description Implement Axe-Jest into our current tests. All pages are being checked whether they contain violations to the compliance rules set by the web-standards. The complete list of rules, grouped WCAG level and best practice, can found in [doc/rule-descriptions.md](https://github.com/dequelabs/axe-core/blob/develop/doc/rule-descriptions.md). closes #5154
|
Merged into branches master, iso7 in 63a0fb7 |
Description
Implement Axe-Jest into our current tests. All pages are being checked whether they contain violations to the compliance rules set by the web-standards. The complete list of rules, grouped WCAG level and best practice, can found in doc/rule-descriptions.md.
closes #5154