Map - unskip accessibility tests (#28533)

Co-authored-by: EugeniyKiyashko <[email protected]>

Author: Zedwag

apps/demos/testing/common.test.js

@@ -21,6 +21,7 @@ import {
 
 import { createMdReport, createTestCafeReport } from '../utils/axe-reporter/reporter';
 import knownWarnings from './known-warnings.json';
+import skipJsErrorsComponents from './skip-js-errors-components.json';
 
 const execCode = ClientFunction((code) => {
   // eslint-disable-next-line no-eval
@@ -52,6 +53,9 @@ const getTestSpecificSkipRules = (testName) => {
       return ['empty-table-header'];
     case 'Localization-UsingGlobalize':
       return ['label'];
+    case 'Map-Markers':
+    case 'Map-Routes':
+      return ['aria-hidden-focus', 'image-alt', 'image-redundant-alt'];
     default:
       return [];
   }
@@ -66,6 +70,11 @@ const SKIPPED_TESTS = {
       { demo: 'TaskTemplate', themes: [THEME.generic, THEME.material, THEME.fluent] },
       { demo: 'Validation', themes: [THEME.generic, THEME.material, THEME.fluent] },
     ],
+    Map: [
+      { demo: 'ProvidersAndTypes', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'Markers', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'Routes', themes: [THEME.generic, THEME.material, THEME.fluent] },
+    ],
   },
   Angular: {
     DataGrid: [
@@ -93,6 +102,11 @@ const SKIPPED_TESTS = {
       { demo: 'DiscreteAxisZoomingAndScrolling', themes: [THEME.material] },
       { demo: 'APISelectAPoint', themes: [THEME.material] },
     ],
+    Map: [
+      { demo: 'ProvidersAndTypes', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'Markers', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'Routes', themes: [THEME.generic, THEME.material, THEME.fluent] },
+    ],
     Scheduler: [
       { demo: 'Overview', themes: [THEME.fluent, THEME.material] },
     ],
@@ -161,6 +175,11 @@ const SKIPPED_TESTS = {
       { demo: 'ListWithSearchBar', themes: [THEME.material] },
       { demo: 'ItemDragging', themes: [THEME.fluent, THEME.material] },
     ],
+    Map: [
+      { demo: 'ProvidersAndTypes', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'Markers', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'Routes', themes: [THEME.generic, THEME.material, THEME.fluent] },
+    ],
     VectorMap: [
       { demo: 'Overview', themes: [THEME.material] },
       { demo: 'PieMarkers', themes: [THEME.material] },
@@ -239,6 +258,11 @@ const SKIPPED_TESTS = {
     List: [
       { demo: 'ListWithSearchBar', themes: [THEME.material] },
     ],
+    Map: [
+      { demo: 'ProvidersAndTypes', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'Markers', themes: [THEME.generic, THEME.material, THEME.fluent] },
+      { demo: 'Routes', themes: [THEME.generic, THEME.material, THEME.fluent] },
+    ],
     Gauges: [
       { demo: 'Overview', themes: [THEME.material] },
       { demo: 'VariableNumberOfSubvalueIndicators', themes: [THEME.material] },
@@ -310,9 +334,6 @@ const SKIPPED_TESTS = {
     'Scheduler',
     'PivotGrid',
   ];
-  const BROKEN_THIRD_PARTY_SCRIPTS_COMPONENT = [
-    'Map',
-  ];
 
   getDemoPaths(approach).forEach((demoPath, index) => {
     if (!shouldRunTestAtIndex(index + 1) || !existsSync(demoPath)) { return; }
@@ -341,9 +362,6 @@ const SKIPPED_TESTS = {
       if (process.env.STRATEGY === 'accessibility' && ACCESSIBILITY_UNSUPPORTED_COMPONENTS.indexOf(widgetName) > -1) {
         return;
       }
-      if (BROKEN_THIRD_PARTY_SCRIPTS_COMPONENT.indexOf(widgetName) > -1) {
-        return;
-      }
       if (process.env.CI_ENV && process.env.DISABLE_DEMO_TEST_SETTINGS !== 'ignore') {
         if (mergedTestSettings.ignore) { return; }
       }
@@ -354,60 +372,63 @@ const SKIPPED_TESTS = {
 
     changeTheme(__dirname, `../${demoPath}/index.html`, process.env.THEME);
 
-    runTestAtPage(test, `http://127.0.0.1:808${getPortByIndex(index)}/apps/demos/Demos/${widgetName}/${demoName}/${approach}/`)
-      .clientScripts(clientScriptSource)(testName, async (t) => {
-        if (visualTestStyles) {
-          await execCode(visualTestStyles);
-        }
+    runTestAtPage(
+      test,
+      `http://127.0.0.1:808${getPortByIndex(index)}/apps/demos/Demos/${widgetName}/${demoName}/${approach}/`,
+      skipJsErrorsComponents.includes(widgetName),
+    ).clientScripts(clientScriptSource)(testName, async (t) => {
+      if (visualTestStyles) {
+        await execCode(visualTestStyles);
+      }
 
-        if (approach === 'Angular') {
-          await waitForAngularLoading();
-        }
+      if (approach === 'Angular') {
+        await waitForAngularLoading();
+      }
 
-        if (testCodeSource) {
-          await execCode(testCodeSource);
-        }
+      if (testCodeSource) {
+        await execCode(testCodeSource);
+      }
 
-        if (testCafeCodeSource) {
-          await execTestCafeCode(t, testCafeCodeSource);
-        }
+      if (testCafeCodeSource) {
+        await execTestCafeCode(t, testCafeCodeSource);
+      }
 
-        if (process.env.STRATEGY === 'accessibility') {
-          const specificSkipRules = getTestSpecificSkipRules(testName);
-          const options = { rules: { } };
+      if (process.env.STRATEGY === 'accessibility') {
+        const specificSkipRules = getTestSpecificSkipRules(testName);
+        const options = { rules: { } };
 
-          [...COMMON_SKIP_RULES, ...specificSkipRules].forEach((ruleName) => {
-            options.rules[ruleName] = { enabled: false };
-          });
+        [...COMMON_SKIP_RULES, ...specificSkipRules].forEach((ruleName) => {
+          options.rules[ruleName] = { enabled: false };
+        });
 
-          const axeResult = await axeCheck(t, '.demo-container', options);
-          const { error, results } = axeResult;
+        const axeResult = await axeCheck(t, '.demo-container', options);
+        const { error, results } = axeResult;
 
-          if (results.violations.length > 0) {
-            createMdReport({ testName, results });
-            await t.report(createTestCafeReport(results.violations));
-          }
+        if (results.violations.length > 0) {
+          createMdReport({ testName, results });
+          await t.report(createTestCafeReport(results.violations));
+        }
 
-          await t.expect(error).notOk();
-          await t.expect(results.violations.length === 0).ok(createReport(results.violations));
-        } else {
-          const testTheme = process.env.THEME;
+        await t.expect(error).notOk();
+        await t.expect(results.violations.length === 0).ok(createReport(results.violations));
+      } else {
+        const testTheme = process.env.THEME;
 
-          if (shouldSkipDemo(approach, widgetName, demoName, SKIPPED_TESTS)) {
-            return;
-          }
+        if (shouldSkipDemo(approach, widgetName, demoName, SKIPPED_TESTS)) {
+          return;
+        }
 
-          const comparisonResult = await compareScreenshot(t, `${testName}${getThemePostfix(testTheme)}.png`, undefined, comparisonOptions);
+        const comparisonResult = await compareScreenshot(t, `${testName}${getThemePostfix(testTheme)}.png`, undefined, comparisonOptions);
 
-          const consoleMessages = await t.getBrowserConsoleMessages();
+        const consoleMessages = await t.getBrowserConsoleMessages();
 
-          const errors = [...consoleMessages.error, ...consoleMessages.warn]
-            .filter((e) => !knownWarnings.some((kw) => e.startsWith(kw)));
+        const errors = [...consoleMessages.error, ...consoleMessages.warn]
+          .filter((e) => !knownWarnings.some((kw) => e.startsWith(kw)));
 
-          await t.expect(errors).eql([]);
+        await t.expect(errors).eql([]);
 
-          await t.expect(comparisonResult).ok('INVALID_SCREENSHOT');
-        }
-      });
+        await t.expect(comparisonResult).ok('INVALID_SCREENSHOT');
+      }
+    });
   });
 });