fix a11y of no data page

elastic · Jan 10, 2020 · 3cd3ed5 · 3cd3ed5
1 parent 71f7ecc
commit 3cd3ed5
Showing 1 changed file with 9 additions and 0 deletions.
diff --git a/x-pack/legacy/plugins/graph/public/components/guidance_panel/guidance_panel.tsx b/x-pack/legacy/plugins/graph/public/components/guidance_panel/guidance_panel.tsx
@@ -13,6 +13,7 @@ import {
   EuiText,
   EuiLink,
   EuiCallOut,
+  EuiScreenReaderOnly,
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import classNames from 'classnames';
@@ -158,7 +159,15 @@ function GuidancePanelComponent(props: GuidancePanelProps) {
           title={i18n.translate('xpack.graph.noDataSourceNotificationMessageTitle', {
             defaultMessage: 'No data source',
           })}
+          heading="h1"
         >
+          <EuiScreenReaderOnly>
+            <p id="graphHeading">
+              {i18n.translate('xpack.graph.noDataSourceNotificationMessageTitle', {
+                defaultMessage: 'No data source',
+              })}
+            </p>
+          </EuiScreenReaderOnly>
           <p>
             <FormattedMessage
               id="xpack.graph.noDataSourceNotificationMessageText"