A11y tests for filter panel (#78776)

a11y tests for filter panel and some test data un mounting

Author: bhavyarm

src/plugins/data/public/ui/filter_bar/filter_editor/index.tsx

@@ -106,7 +106,11 @@ class FilterEditorUI extends Component<Props, State> {
             </EuiFlexItem>
             <EuiFlexItem grow={false} className="filterEditor__hiddenItem" />
             <EuiFlexItem grow={false}>
-              <EuiButtonEmpty size="xs" onClick={this.toggleCustomEditor}>
+              <EuiButtonEmpty
+                size="xs"
+                data-test-subj="editQueryDSL"
+                onClick={this.toggleCustomEditor}
+              >
                 {this.state.isCustomEditorOpen ? (
                   <FormattedMessage
                     id="data.filter.filterEditor.editFilterValuesButtonLabel"
@@ -133,6 +137,7 @@ class FilterEditorUI extends Component<Props, State> {
 
             <EuiSwitch
               id="filterEditorCustomLabelSwitch"
+              data-test-subj="createCustomLabel"
               label={this.props.intl.formatMessage({
                 id: 'data.filter.filterEditor.createCustomLabelSwitchLabel',
                 defaultMessage: 'Create custom label?',

test/accessibility/apps/discover.ts

@@ -39,6 +39,10 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
       await PageObjects.timePicker.setDefaultAbsoluteRange();
     });
 
+    after(async () => {
+      await esArchiver.unload('logstash_functional');
+    });
+
     it('Discover main page', async () => {
       await a11y.testAppSnapshot();
     });

test/accessibility/apps/filter_panel.ts

@@ -0,0 +1,95 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { FtrProviderContext } from '../ftr_provider_context';
+
+export default function ({ getService, getPageObjects }: FtrProviderContext) {
+  const PageObjects = getPageObjects(['common', 'discover', 'home']);
+  const a11y = getService('a11y');
+  const filterBar = getService('filterBar');
+  const testSubjects = getService('testSubjects');
+  const browser = getService('browser');
+
+  describe('Filter panel', () => {
+    before(async () => {
+      await PageObjects.common.navigateToUrl('home', '/tutorial_directory/sampleData', {
+        useActualUrl: true,
+      });
+      await PageObjects.home.addSampleDataSet('flights');
+      await PageObjects.common.navigateToApp('discover');
+      await PageObjects.discover.selectIndexPattern('kibana_sample_data_flights');
+    });
+
+    it('a11y test on add filter panel', async () => {
+      await PageObjects.discover.openAddFilterPanel();
+      await a11y.testAppSnapshot();
+      await filterBar.addFilter('OriginCityName', 'is', 'Rome');
+    });
+
+    it('a11y test on filter panel with custom label', async () => {
+      await filterBar.clickEditFilter('OriginCityName', 'Rome');
+      await testSubjects.click('createCustomLabel');
+      await a11y.testAppSnapshot();
+    });
+
+    it('a11y test on Edit filter as Query DSL panel', async () => {
+      await testSubjects.click('editQueryDSL');
+      await a11y.testAppSnapshot();
+      await browser.pressKeys(browser.keys.ESCAPE);
+    });
+
+    // the following tests filter panel options which changes UI
+    it('a11y test on filter panel options panel', async () => {
+      await filterBar.addFilter('DestCountry', 'is', 'AU');
+      await testSubjects.click('showFilterActions');
+      await a11y.testAppSnapshot();
+    });
+
+    it('a11y test on disable all filter options view', async () => {
+      await testSubjects.click('disableAllFilters');
+      await a11y.testAppSnapshot();
+    });
+
+    it('a11y test on pin filters view', async () => {
+      await testSubjects.click('showFilterActions');
+      await testSubjects.click('enableAllFilters');
+      await testSubjects.click('showFilterActions');
+      await testSubjects.click('pinAllFilters');
+      await a11y.testAppSnapshot();
+    });
+
+    it('a11y test on unpin all filters view', async () => {
+      await testSubjects.click('showFilterActions');
+      await testSubjects.click('unpinAllFilters');
+      await a11y.testAppSnapshot();
+    });
+
+    it('a11y test on invert inclusion of all filters view', async () => {
+      await testSubjects.click('showFilterActions');
+      await testSubjects.click('invertInclusionAllFilters');
+      await a11y.testAppSnapshot();
+    });
+
+    it('a11y test on remove all filtes view', async () => {
+      await testSubjects.click('showFilterActions');
+      await testSubjects.click('removeAllFilters');
+      await a11y.testAppSnapshot();
+    });
+  });
+}

test/accessibility/apps/management.ts

@@ -35,6 +35,10 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
       await PageObjects.settings.navigateTo();
     });
 
+    after(async () => {
+      await esArchiver.unload('logstash_functional');
+    });
+
     it('main view', async () => {
       await a11y.testAppSnapshot();
     });

test/accessibility/config.ts

@@ -35,6 +35,7 @@ export default async function ({ readConfigFile }: FtrConfigProviderContext) {
       require.resolve('./apps/management'),
       require.resolve('./apps/console'),
       require.resolve('./apps/home'),
+      require.resolve('./apps/filter_panel'),
     ],
     pageObjects,
     services,