mirror of
https://github.com/Azure/cosmos-explorer.git
synced 2026-01-22 03:04:07 +00:00
Compare commits
2 Commits
fix_a11y_c
...
fix_a11y_D
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
853e48c5a6 | ||
|
|
b7eb7db3f0 |
@@ -194,7 +194,7 @@ export class TreeNodeComponent extends React.Component<TreeNodeComponentProps, T
|
||||
</div>
|
||||
{node.children && (
|
||||
<AnimateHeight duration={TreeNodeComponent.transitionDurationMS} height={this.state.isExpanded ? "auto" : 0}>
|
||||
<div className="nodeChildren" data-test={node.label}>
|
||||
<div className="nodeChildren" data-test={node.label} role="tree">
|
||||
{TreeNodeComponent.getSortedChildren(node).map((childNode: TreeNode) => (
|
||||
<TreeNodeComponent
|
||||
key={`${childNode.label}-${generation + 1}-${childNode.timestamp}`}
|
||||
|
||||
@@ -100,6 +100,7 @@ exports[`TreeNodeComponent does not render children by default 1`] = `
|
||||
<div
|
||||
className="nodeChildren"
|
||||
data-test="label"
|
||||
role="tree"
|
||||
>
|
||||
<TreeNodeComponent
|
||||
generation={3}
|
||||
@@ -250,6 +251,7 @@ exports[`TreeNodeComponent renders a simple node (sorted children, expanded) 1`]
|
||||
<div
|
||||
className="nodeChildren"
|
||||
data-test="label"
|
||||
role="tree"
|
||||
>
|
||||
<TreeNodeComponent
|
||||
generation={13}
|
||||
@@ -351,6 +353,7 @@ exports[`TreeNodeComponent renders loading icon 1`] = `
|
||||
<div
|
||||
className="nodeChildren"
|
||||
data-test="label"
|
||||
role="tree"
|
||||
/>
|
||||
</AnimateHeight>
|
||||
</div>
|
||||
@@ -463,6 +466,7 @@ exports[`TreeNodeComponent renders sorted children, expanded, leaves and parents
|
||||
<div
|
||||
className="nodeChildren"
|
||||
data-test="label"
|
||||
role="tree"
|
||||
>
|
||||
<TreeNodeComponent
|
||||
generation={13}
|
||||
@@ -592,6 +596,7 @@ exports[`TreeNodeComponent renders unsorted children by default 1`] = `
|
||||
<div
|
||||
className="nodeChildren"
|
||||
data-test="label"
|
||||
role="tree"
|
||||
>
|
||||
<TreeNodeComponent
|
||||
generation={3}
|
||||
|
||||
@@ -29,6 +29,7 @@ describe("Table query select Panel", () => {
|
||||
it("Should checked availableCheckbox by default", () => {
|
||||
const wrapper = mount(<TableQuerySelectPanel {...props} />);
|
||||
expect(wrapper.find("#availableCheckbox").first().props()).toEqual({
|
||||
ariaPositionInSet: 0,
|
||||
id: "availableCheckbox",
|
||||
label: "Available Columns",
|
||||
checked: true,
|
||||
|
||||
@@ -128,8 +128,9 @@ export const TableQuerySelectPanel: FunctionComponent<TableQuerySelectPanelProps
|
||||
label="Available Columns"
|
||||
checked={isAvailableColumnChecked}
|
||||
onChange={availableColumnsCheckboxClick}
|
||||
ariaPositionInSet={0}
|
||||
/>
|
||||
{columnOptions.map((column) => {
|
||||
{columnOptions.map((column, index) => {
|
||||
return (
|
||||
<Checkbox
|
||||
label={column.columnName}
|
||||
@@ -137,6 +138,7 @@ export const TableQuerySelectPanel: FunctionComponent<TableQuerySelectPanelProps
|
||||
key={column.columnName}
|
||||
checked={column.selected}
|
||||
disabled={!column.editable}
|
||||
ariaPositionInSet={index + 1}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
|
||||
@@ -37,12 +37,14 @@ exports[`Table query select Panel should render Default properly 1`] = `
|
||||
className="column-select-view"
|
||||
>
|
||||
<StyledCheckboxBase
|
||||
ariaPositionInSet={0}
|
||||
checked={true}
|
||||
id="availableCheckbox"
|
||||
label="Available Columns"
|
||||
onChange={[Function]}
|
||||
>
|
||||
<CheckboxBase
|
||||
ariaPositionInSet={0}
|
||||
checked={true}
|
||||
id="availableCheckbox"
|
||||
label="Available Columns"
|
||||
@@ -328,6 +330,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
|
||||
<input
|
||||
aria-checked="true"
|
||||
aria-label="Available Columns"
|
||||
aria-posinset={0}
|
||||
checked={true}
|
||||
className="input-55"
|
||||
data-ktp-execute-target={true}
|
||||
@@ -646,6 +649,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
|
||||
</CheckboxBase>
|
||||
</StyledCheckboxBase>
|
||||
<StyledCheckboxBase
|
||||
ariaPositionInSet={1}
|
||||
checked={true}
|
||||
disabled={false}
|
||||
key=""
|
||||
@@ -653,6 +657,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
|
||||
onChange={[Function]}
|
||||
>
|
||||
<CheckboxBase
|
||||
ariaPositionInSet={1}
|
||||
checked={true}
|
||||
disabled={false}
|
||||
label=""
|
||||
@@ -939,6 +944,7 @@ exports[`Table query select Panel should render Default properly 1`] = `
|
||||
aria-checked="true"
|
||||
aria-disabled={false}
|
||||
aria-label=""
|
||||
aria-posinset={1}
|
||||
checked={true}
|
||||
className="input-55"
|
||||
data-ktp-execute-target={true}
|
||||
|
||||
Reference in New Issue
Block a user