[Logstash] [Pipeline Viewer] Improve LS monitoring accessibility (#24169)
* Update test data shape to conform to component proptypes. * Add aria-labels for pipeline viewer buttons.
This commit is contained in:
parent
9f4ec18000
commit
2b6cd21604
|
@ -17,7 +17,7 @@ exports[`CollapsibleStatement component renders child components 1`] = `
|
|||
key="statementId"
|
||||
>
|
||||
<EuiButtonIcon
|
||||
aria-label={true}
|
||||
aria-label="collapse"
|
||||
color="text"
|
||||
iconSize="m"
|
||||
iconType="arrowDown"
|
||||
|
|
|
@ -29,6 +29,7 @@ exports[`PluginStatement component adds warning highlight for cpu time 1`] = `
|
|||
grow={false}
|
||||
>
|
||||
<EuiButtonEmpty
|
||||
aria-label="mutate"
|
||||
className="monPipelineViewer__plugin"
|
||||
color="primary"
|
||||
flush="left"
|
||||
|
@ -122,6 +123,7 @@ exports[`PluginStatement component adds warning highlight for event millis 1`] =
|
|||
grow={false}
|
||||
>
|
||||
<EuiButtonEmpty
|
||||
aria-label="mutate"
|
||||
className="monPipelineViewer__plugin"
|
||||
color="primary"
|
||||
flush="left"
|
||||
|
@ -215,6 +217,7 @@ exports[`PluginStatement component does not render explicit id field if no id is
|
|||
grow={false}
|
||||
>
|
||||
<EuiButtonEmpty
|
||||
aria-label="stdin"
|
||||
className="monPipelineViewer__plugin"
|
||||
color="primary"
|
||||
flush="left"
|
||||
|
@ -283,6 +286,7 @@ exports[`PluginStatement component renders input metrics and explicit id fields
|
|||
grow={false}
|
||||
>
|
||||
<EuiButtonEmpty
|
||||
aria-label="stdin"
|
||||
className="monPipelineViewer__plugin"
|
||||
color="primary"
|
||||
flush="left"
|
||||
|
@ -364,6 +368,7 @@ exports[`PluginStatement component renders processor statement metrics 1`] = `
|
|||
grow={false}
|
||||
>
|
||||
<EuiButtonEmpty
|
||||
aria-label="mutate"
|
||||
className="monPipelineViewer__plugin"
|
||||
color="primary"
|
||||
flush="left"
|
||||
|
|
|
@ -19,6 +19,7 @@ exports[`Statement component renders a CollapsibleStatement with else body for n
|
|||
key="statementName"
|
||||
>
|
||||
<EuiButtonEmpty
|
||||
aria-label="else"
|
||||
color="text"
|
||||
flush="left"
|
||||
iconSide="left"
|
||||
|
@ -56,6 +57,7 @@ exports[`Statement component renders a CollapsibleStatement with if body for bra
|
|||
key="statementName"
|
||||
>
|
||||
<EuiButtonEmpty
|
||||
aria-label="if"
|
||||
color="text"
|
||||
flush="left"
|
||||
iconSide="left"
|
||||
|
@ -145,6 +147,7 @@ exports[`Statement component renders spacers for element with depth > 0 1`] = `
|
|||
key="statementName"
|
||||
>
|
||||
<EuiButtonEmpty
|
||||
aria-label="else"
|
||||
color="text"
|
||||
flush="left"
|
||||
iconSide="left"
|
||||
|
|
|
@ -11,6 +11,7 @@ exports[`StatementList renders nested elements as expected 1`] = `
|
|||
"depth": 0,
|
||||
"id": "mutateIf",
|
||||
"parentId": null,
|
||||
"statement": Object {},
|
||||
}
|
||||
}
|
||||
expand={[Function]}
|
||||
|
@ -25,6 +26,7 @@ exports[`StatementList renders nested elements as expected 1`] = `
|
|||
"depth": 1,
|
||||
"id": "mutate",
|
||||
"parentId": "mutateIf",
|
||||
"statement": Object {},
|
||||
}
|
||||
}
|
||||
expand={[Function]}
|
||||
|
|
|
@ -21,11 +21,13 @@ describe('StatementList', () => {
|
|||
id: 'mutateIf',
|
||||
parentId: null,
|
||||
depth: 0,
|
||||
statement: { },
|
||||
},
|
||||
{
|
||||
id: 'mutate',
|
||||
parentId: 'mutateIf',
|
||||
depth: 1,
|
||||
statement: { },
|
||||
},
|
||||
],
|
||||
onShowVertexDetails,
|
||||
|
|
|
@ -33,7 +33,7 @@ export function CollapsibleStatement(props) {
|
|||
>
|
||||
<EuiFlexItem key={id} grow={false}>
|
||||
<EuiButtonIcon
|
||||
aria-label
|
||||
aria-label="collapse"
|
||||
color="text"
|
||||
iconType={getToggleIconType(isCollapsed)}
|
||||
onClick={toggleClicked}
|
||||
|
|
|
@ -84,6 +84,7 @@ export function PluginStatement({
|
|||
<EuiFlexGroup alignItems="center" gutterSize="xs" responsive={false}>
|
||||
<EuiFlexItem grow={false}>
|
||||
<EuiButtonEmpty
|
||||
aria-label={name}
|
||||
className="monPipelineViewer__plugin"
|
||||
color="primary"
|
||||
flush="left"
|
||||
|
|
|
@ -16,6 +16,7 @@ function renderStatementName(name, onVertexSelected) {
|
|||
return (
|
||||
<EuiFlexItem grow={false} key="statementName">
|
||||
<EuiButtonEmpty
|
||||
aria-label={name}
|
||||
color="text"
|
||||
size="xs"
|
||||
onClick={onVertexSelected}
|
||||
|
|
Loading…
Reference in a new issue