Updated span for Button to be accessible (#46296)

This commit is contained in:
Yaelle Chaudy 2022-03-08 12:42:03 +01:00 committed by GitHub
parent bfde8ee603
commit ed7701c6b2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,15 +1,15 @@
import React, { ReactElement } from 'react';
import { css } from '@emotion/css'; import { css } from '@emotion/css';
import { Draggable } from 'react-beautiful-dnd';
import { GrafanaTheme2 } from '@grafana/data'; import { GrafanaTheme2 } from '@grafana/data';
import { Icon, IconButton, useStyles2, useTheme2 } from '@grafana/ui';
import { selectors } from '@grafana/e2e-selectors'; import { selectors } from '@grafana/e2e-selectors';
import { reportInteraction } from '@grafana/runtime'; import { reportInteraction } from '@grafana/runtime';
import { Button, Icon, IconButton, useStyles2, useTheme2 } from '@grafana/ui';
import React, { ReactElement } from 'react';
import { Draggable } from 'react-beautiful-dnd';
import { getVariableUsages, UsagesToNetwork, VariableUsageTree } from '../inspect/utils';
import { hasOptions, isAdHoc, isQuery } from '../guard'; import { hasOptions, isAdHoc, isQuery } from '../guard';
import { KeyedVariableIdentifier } from '../state/types'; import { getVariableUsages, UsagesToNetwork, VariableUsageTree } from '../inspect/utils';
import { VariableUsagesButton } from '../inspect/VariableUsagesButton'; import { VariableUsagesButton } from '../inspect/VariableUsagesButton';
import { KeyedVariableIdentifier } from '../state/types';
import { VariableModel } from '../types'; import { VariableModel } from '../types';
import { toKeyedVariableIdentifier } from '../utils'; import { toKeyedVariableIdentifier } from '../utils';
@ -52,7 +52,9 @@ export function VariableEditorListRow({
}} }}
> >
<td className={styles.column}> <td className={styles.column}>
<span <Button
size="xs"
fill="text"
onClick={(event) => { onClick={(event) => {
event.preventDefault(); event.preventDefault();
propsOnEdit(identifier); propsOnEdit(identifier);
@ -61,7 +63,7 @@ export function VariableEditorListRow({
aria-label={selectors.pages.Dashboard.Settings.Variables.List.tableRowNameFields(variable.name)} aria-label={selectors.pages.Dashboard.Settings.Variables.List.tableRowNameFields(variable.name)}
> >
{variable.name} {variable.name}
</span> </Button>
</td> </td>
<td <td
className={styles.definitionColumn} className={styles.definitionColumn}