[Logs + Metrics UI] Add missing headers in Logs & metrics (#52405)

* Fix broken aria references

`EuiDescribedFormGroup` needs an actual header in its `title` for it to
make a correct `aria-labelledby`.

* Fix `aria-labelledby` references in settings page


Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
Alejandro Fernández 2019-12-11 13:47:37 +01:00 committed by GitHub
parent 248904ec87
commit 9fcc93457f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 58 additions and 38 deletions

View file

@ -50,10 +50,12 @@ export const FieldsConfigurationPanel = ({
<EuiDescribedFormGroup
idAria="timestampField"
title={
<FormattedMessage
id="xpack.infra.sourceConfiguration.timestampFieldLabel"
defaultMessage="Timestamp"
/>
<h4>
<FormattedMessage
id="xpack.infra.sourceConfiguration.timestampFieldLabel"
defaultMessage="Timestamp"
/>
</h4>
}
description={
<FormattedMessage
@ -95,10 +97,12 @@ export const FieldsConfigurationPanel = ({
<EuiDescribedFormGroup
idAria="tiebreakerField"
title={
<FormattedMessage
id="xpack.infra.sourceConfiguration.tiebreakerFieldLabel"
defaultMessage="Tiebreaker"
/>
<h4>
<FormattedMessage
id="xpack.infra.sourceConfiguration.tiebreakerFieldLabel"
defaultMessage="Tiebreaker"
/>
</h4>
}
description={
<FormattedMessage
@ -140,10 +144,12 @@ export const FieldsConfigurationPanel = ({
<EuiDescribedFormGroup
idAria="containerField"
title={
<FormattedMessage
id="xpack.infra.sourceConfiguration.containerFieldLabel"
defaultMessage="Container ID"
/>
<h4>
<FormattedMessage
id="xpack.infra.sourceConfiguration.containerFieldLabel"
defaultMessage="Container ID"
/>
</h4>
}
description={
<FormattedMessage
@ -185,10 +191,12 @@ export const FieldsConfigurationPanel = ({
<EuiDescribedFormGroup
idAria="hostNameField"
title={
<FormattedMessage
id="xpack.infra.sourceConfiguration.hostNameFieldLabel"
defaultMessage="Host name"
/>
<h4>
<FormattedMessage
id="xpack.infra.sourceConfiguration.hostNameFieldLabel"
defaultMessage="Host name"
/>
</h4>
}
description={
<FormattedMessage
@ -230,10 +238,12 @@ export const FieldsConfigurationPanel = ({
<EuiDescribedFormGroup
idAria="podField"
title={
<FormattedMessage
id="xpack.infra.sourceConfiguration.podFieldLabel"
defaultMessage="Pod ID"
/>
<h4>
<FormattedMessage
id="xpack.infra.sourceConfiguration.podFieldLabel"
defaultMessage="Pod ID"
/>
</h4>
}
description={
<FormattedMessage

View file

@ -42,12 +42,14 @@ export const IndicesConfigurationPanel = ({
</EuiTitle>
<EuiSpacer size="m" />
<EuiDescribedFormGroup
idAria="matricIndices"
idAria="metricIndices"
title={
<FormattedMessage
id="xpack.infra.sourceConfiguration.metricIndicesTitle"
defaultMessage="Metric indices"
/>
<h4>
<FormattedMessage
id="xpack.infra.sourceConfiguration.metricIndicesTitle"
defaultMessage="Metric indices"
/>
</h4>
}
description={
<FormattedMessage
@ -90,10 +92,12 @@ export const IndicesConfigurationPanel = ({
<EuiDescribedFormGroup
idAria="logIndices"
title={
<FormattedMessage
id="xpack.infra.sourceConfiguration.logIndicesTitle"
defaultMessage="Log indices"
/>
<h4>
<FormattedMessage
id="xpack.infra.sourceConfiguration.logIndicesTitle"
defaultMessage="Log indices"
/>
</h4>
}
description={
<FormattedMessage

View file

@ -41,7 +41,9 @@ export const NameConfigurationPanel = ({
<EuiDescribedFormGroup
idAria="name"
title={
<FormattedMessage id="xpack.infra.sourceConfiguration.nameLabel" defaultMessage="Name" />
<h4>
<FormattedMessage id="xpack.infra.sourceConfiguration.nameLabel" defaultMessage="Name" />
</h4>
}
description={
<FormattedMessage

View file

@ -61,10 +61,12 @@ export const AnalysisSetupIndicesForm: React.FunctionComponent<{
<EuiDescribedFormGroup
idAria="indices"
title={
<FormattedMessage
id="xpack.infra.analysisSetup.indicesSelectionTitle"
defaultMessage="Choose indices"
/>
<h3>
<FormattedMessage
id="xpack.infra.analysisSetup.indicesSelectionTitle"
defaultMessage="Choose indices"
/>
</h3>
}
description={
<FormattedMessage

View file

@ -63,10 +63,12 @@ export const AnalysisSetupTimerangeForm: React.FunctionComponent<{
<EuiDescribedFormGroup
idAria="timeRange"
title={
<FormattedMessage
id="xpack.infra.analysisSetup.timeRangeTitle"
defaultMessage="Choose a time range"
/>
<h3>
<FormattedMessage
id="xpack.infra.analysisSetup.timeRangeTitle"
defaultMessage="Choose a time range"
/>
</h3>
}
description={
<FormattedMessage