a11y for xpack home (elastic#62342)

 a11y test xpack home

src/plugins/home/public/application/components/add_data.js

@@ -158,6 +158,7 @@ const AddDataUi = ({ apmUiEnabled, isNewKibanaInstance, intl, mlEnabled }) => {
                 footer={
                   <EuiButton
                     className="homAddData__button"
+                    data-test-subj="logsData"
                     href="#/home/tutorial_directory/logging"
                     aria-describedby={loggingData.ariaDescribedby}
                   >

src/plugins/home/public/application/components/feature_directory.js

@@ -89,6 +89,7 @@ export class FeatureDirectory extends React.Component {
   renderTabs = () => {
     return this.tabs.map((tab, index) => (
       <EuiTab
+        data-test-subj={`tab-${tab.id}`}
         onClick={() => this.onSelectedTabChanged(tab.id)}
         isSelected={tab.id === this.state.selectedTabId}
         key={index}

src/plugins/home/public/application/components/home.js

@@ -203,7 +203,7 @@ export class Home extends Component {
                 </p>
               </EuiText>
               <EuiSpacer size="s" />
-              <EuiButton href="#/home/feature_directory">
+              <EuiButton data-test-subj="allPlugins" href="#/home/feature_directory">
                 <FormattedMessage
                   id="home.directories.notFound.viewFullButtonLabel"
                   defaultMessage="View full directory of Kibana plugins"

src/plugins/home/public/application/components/tutorial/tutorial.js

@@ -237,10 +237,12 @@ class TutorialUi extends React.Component {
         {
           id: INSTRUCTIONS_TYPE.ON_PREM,
           label: selfManagedLabel,
+          'data-test-subj': 'selfManagedTutorial',
         },
         {
           id: INSTRUCTIONS_TYPE.ON_PREM_ELASTIC_CLOUD,
           label: cloudLabel,
+          'data-test-subj': 'onCloudTutorial',
         },
       ];
       return (

test/functional/page_objects/home_page.ts

@@ -79,6 +79,39 @@ export function HomePageProvider({ getService, getPageObjects }: FtrProviderCont
       await testSubjects.click(`launchSampleDataSet${id}`);
     }
 
+    async clickAllKibanaPlugins() {
+      await testSubjects.click('allPlugins');
+    }
+
+    async clickVisualizeExplorePlugins() {
+      await testSubjects.click('tab-data');
+    }
+
+    async clickAdminPlugin() {
+      await testSubjects.click('tab-admin');
+    }
+
+    async clickOnConsole() {
+      await testSubjects.click('homeSynopsisLinkconsole');
+    }
+    async clickOnLogo() {
+      await testSubjects.click('logo');
+    }
+
+    async ClickOnLogsData() {
+      await testSubjects.click('logsData');
+    }
+
+    // clicks on Active MQ logs
+    async clickOnLogsTutorial() {
+      await testSubjects.click('homeSynopsisLinkactivemq logs');
+    }
+
+    // clicks on cloud tutorial link
+    async clickOnCloudTutorial() {
+      await testSubjects.click('onCloudTutorial');
+    }
+
     async loadSavedObjects() {
       await retry.try(async () => {
         await testSubjects.click('loadSavedObjects');

x-pack/test/accessibility/apps/home.ts

@@ -0,0 +1,67 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { FtrProviderContext } from '../ftr_provider_context';
+
+export default function({ getService, getPageObjects }: FtrProviderContext) {
+  const PageObjects = getPageObjects(['common', 'home']);
+  const a11y = getService('a11y');
+
+  describe('Kibana Home', () => {
+    before(async () => {
+      await PageObjects.common.navigateToApp('home');
+    });
+
+    it('Kibana Home view', async () => {
+      await a11y.testAppSnapshot();
+    });
+
+    it('all plugins view page meets a11y requirements', async () => {
+      await PageObjects.home.clickAllKibanaPlugins();
+      await a11y.testAppSnapshot();
+    });
+
+    it('visualize & explore details tab meets a11y requirements', async () => {
+      await PageObjects.home.clickVisualizeExplorePlugins();
+      await a11y.testAppSnapshot();
+    });
+
+    it('administrative detail tab meets a11y requirements', async () => {
+      await PageObjects.home.clickAdminPlugin();
+      await a11y.testAppSnapshot();
+    });
+
+    it('navigating to console app from administration tab meets a11y requirements', async () => {
+      await PageObjects.home.clickOnConsole();
+      await a11y.testAppSnapshot();
+    });
+
+    // issue:  https://github.com/elastic/kibana/issues/38980
+    it.skip('navigating back to home page from console meets a11y requirements', async () => {
+      await PageObjects.home.clickOnLogo();
+      await a11y.testAppSnapshot();
+    });
+
+    // Extra clickon logo step here will be removed after preceding test is fixed.
+    it('click on Add logs panel to open all log examples page meets a11y requirements ', async () => {
+      await PageObjects.home.clickOnLogo();
+      await PageObjects.home.ClickOnLogsData();
+      await a11y.testAppSnapshot();
+    });
+
+    // issue - logo images are missing alt -text https://github.com/elastic/kibana/issues/62239
+    it.skip('click on ActiveMQ logs panel to open tutorial meets a11y requirements', async () => {
+      await PageObjects.home.clickOnLogsTutorial();
+      await a11y.testAppSnapshot();
+    });
+
+    // https://github.com/elastic/kibana/issues/62239
+    it.skip('click on cloud tutorial meets a11y requirements', async () => {
+      await PageObjects.home.clickOnCloudTutorial();
+      await a11y.testAppSnapshot();
+    });
+  });
+}

x-pack/test/accessibility/config.ts

@@ -13,7 +13,11 @@ export default async function({ readConfigFile }: FtrConfigProviderContext) {
 
   return {
     ...functionalConfig.getAll(),
-    testFiles: [require.resolve('./apps/login_page'), require.resolve('./apps/grok_debugger')],
+    testFiles: [
+      require.resolve('./apps/login_page'),
+      require.resolve('./apps/home'),
+      require.resolve('./apps/grok_debugger'),
+    ],
     pageObjects,
     services,