a11y for xpack home (#62342) (#62528)

a11y test xpack home

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
Bhavya RM 2020-04-06 15:25:33 -04:00 committed by GitHub
parent de0e11ee8b
commit cab65d369f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 126 additions and 2 deletions

View file

@ -104,6 +104,7 @@ exports[`apmUiEnabled 1`] = `
<EuiButton
aria-describedby="aria-describedby.addLogDataButtonLabel"
className="homAddData__button"
data-test-subj="logsData"
href="#/home/tutorial_directory/logging"
>
<FormattedMessage
@ -369,6 +370,7 @@ exports[`isNewKibanaInstance 1`] = `
<EuiButton
aria-describedby="aria-describedby.addLogDataButtonLabel"
className="homAddData__button"
data-test-subj="logsData"
href="#/home/tutorial_directory/logging"
>
<FormattedMessage
@ -665,6 +667,7 @@ exports[`mlEnabled 1`] = `
<EuiButton
aria-describedby="aria-describedby.addLogDataButtonLabel"
className="homAddData__button"
data-test-subj="logsData"
href="#/home/tutorial_directory/logging"
>
<FormattedMessage
@ -966,6 +969,7 @@ exports[`render 1`] = `
<EuiButton
aria-describedby="aria-describedby.addLogDataButtonLabel"
className="homAddData__button"
data-test-subj="logsData"
href="#/home/tutorial_directory/logging"
>
<FormattedMessage

View file

@ -100,6 +100,7 @@ exports[`home directories should not render directory entry when showOnHomePage
size="s"
/>
<EuiButton
data-test-subj="allPlugins"
href="#/home/feature_directory"
>
<FormattedMessage
@ -227,6 +228,7 @@ exports[`home directories should render ADMIN directory entry in "Manage" panel
size="s"
/>
<EuiButton
data-test-subj="allPlugins"
href="#/home/feature_directory"
>
<FormattedMessage
@ -354,6 +356,7 @@ exports[`home directories should render DATA directory entry in "Explore Data" p
size="s"
/>
<EuiButton
data-test-subj="allPlugins"
href="#/home/feature_directory"
>
<FormattedMessage
@ -468,6 +471,7 @@ exports[`home isNewKibanaInstance should safely handle execeptions 1`] = `
size="s"
/>
<EuiButton
data-test-subj="allPlugins"
href="#/home/feature_directory"
>
<FormattedMessage
@ -582,6 +586,7 @@ exports[`home isNewKibanaInstance should set isNewKibanaInstance to false when t
size="s"
/>
<EuiButton
data-test-subj="allPlugins"
href="#/home/feature_directory"
>
<FormattedMessage
@ -696,6 +701,7 @@ exports[`home isNewKibanaInstance should set isNewKibanaInstance to true when th
size="s"
/>
<EuiButton
data-test-subj="allPlugins"
href="#/home/feature_directory"
>
<FormattedMessage
@ -810,6 +816,7 @@ exports[`home should render home component 1`] = `
size="s"
/>
<EuiButton
data-test-subj="allPlugins"
href="#/home/feature_directory"
>
<FormattedMessage
@ -924,6 +931,7 @@ exports[`home welcome should show the normal home page if loading fails 1`] = `
size="s"
/>
<EuiButton
data-test-subj="allPlugins"
href="#/home/feature_directory"
>
<FormattedMessage
@ -1038,6 +1046,7 @@ exports[`home welcome should show the normal home page if welcome screen is disa
size="s"
/>
<EuiButton
data-test-subj="allPlugins"
href="#/home/feature_directory"
>
<FormattedMessage
@ -1159,6 +1168,7 @@ exports[`home welcome stores skip welcome setting if skipped 1`] = `
size="s"
/>
<EuiButton
data-test-subj="allPlugins"
href="#/home/feature_directory"
>
<FormattedMessage

View file

@ -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}
>

View file

@ -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}

View file

@ -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"

View file

@ -74,10 +74,12 @@ exports[`isCloudEnabled is false should render ON_PREM instructions with instruc
options={
Array [
Object {
"data-test-subj": "selfManagedTutorial",
"id": "onPrem",
"label": "Self managed",
},
Object {
"data-test-subj": "onCloudTutorial",
"id": "onPremElasticCloud",
"label": "Elastic Cloud",
},

View file

@ -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 (

View file

@ -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');

View file

@ -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();
});
});
}

View file

@ -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,