Accessibility Testing

1#! /bin/bash
2
3. shell_functions/commonShellFunctions.sh
4. shell_functions/settings.sh
5_valid_url=1
6
7echo "Welcome to HATS Accessibility Testing Tool!"
8echo "We recommend using Chrome browser for the best experience."
9echo "What would you like to scan today?"
10
11options=("sitemap file containing links" "website")
12
13select opt in "${options[@]}"
14do
15    case $opt in
16
17        "sitemap file containing links")
18
19            scanType="sitemap"
20            crawler=crawlSitemap
21            prompt_message="Please enter URL to sitemap: "
22            break;;
23
24        "website")
25
26            prompt_website
27            break;;
28
29        "exit")
30            exit;;
31
32        *)
33            echo "Invalid option $REPLY";;
34
35    esac
36
37done
38
39read -p "$prompt_message" page
40
41
42echo $page
43

1var AxeBuilder = require('axe-webdriverjs');
2var WebDriver = require('selenium-webdriver');
3
4const path = require('path');
5process.env.PATH = path.resolve(`__dirname/../WebDriver/bin/Firefox/0.29.1`) + ':' + process.env.PATH;
6
7var driver = new WebDriver.Builder()
8  .forBrowser('firefox')
9  .build();
10
11driver
12  //.get('https://dequeuniversity.com/demo/mars/')
13  .get('http://localhost:3000')
14  .then(function() {
15    AxeBuilder(driver).analyze(function(err, results) {
16      if (err) {
17        // Handle error somehow
18      }
19      console.log(results.violations);
20    });
21  });
22

1var AxeBuilder = require('axe-webdriverjs');
2var WebDriver = require('selenium-webdriver');
3
4const path = require('path');
5process.env.PATH = path.resolve(`__dirname/../WebDriver/bin/Firefox/0.29.1`) + ':' + process.env.PATH;
6
7var driver = new WebDriver.Builder()
8  .forBrowser('firefox')
9  .build();
10
11driver
12  //.get('https://dequeuniversity.com/demo/mars/')
13  .get('http://localhost:3000')
14  .then(function() {
15    AxeBuilder(driver).analyze(function(err, results) {
16      if (err) {
17        // Handle error somehow
18      }
19      console.log(results.violations);
20    });
21  });
22> axe-webdriverjs-tests@1.0.0 test1 /Users/nabeen.jamal/gitlab.com/notifications-service/text-messaging-application/tma-test/app/axe-webdriverjs-tests
23> node test/axe.test1.js
24
25[
26  {
27    description: 'Ensures all page content is contained by landmarks',
28    help: 'All page content must be contained by landmarks',
29    helpUrl: 'https://dequeuniversity.com/rules/axe/3.5/region?application=webdriverjs',
30    id: 'region',
31    impact: 'moderate',
32    nodes: [ [Object], [Object] ],
33    tags: [ 'cat.keyboard', 'best-practice' ]
34  }
35]
36

1var AxeBuilder = require('axe-webdriverjs');
2var WebDriver = require('selenium-webdriver');
3
4const path = require('path');
5process.env.PATH = path.resolve(`__dirname/../WebDriver/bin/Firefox/0.29.1`) + ':' + process.env.PATH;
6
7var driver = new WebDriver.Builder()
8  .forBrowser('firefox')
9  .build();
10
11driver
12  //.get('https://dequeuniversity.com/demo/mars/')
13  .get('http://localhost:3000')
14  .then(function() {
15    AxeBuilder(driver).analyze(function(err, results) {
16      if (err) {
17        // Handle error somehow
18      }
19      console.log(results.violations);
20    });
21  });
22> axe-webdriverjs-tests@1.0.0 test1 /Users/nabeen.jamal/gitlab.com/notifications-service/text-messaging-application/tma-test/app/axe-webdriverjs-tests
23> node test/axe.test1.js
24
25[
26  {
27    description: 'Ensures all page content is contained by landmarks',
28    help: 'All page content must be contained by landmarks',
29    helpUrl: 'https://dequeuniversity.com/rules/axe/3.5/region?application=webdriverjs',
30    id: 'region',
31    impact: 'moderate',
32    nodes: [ [Object], [Object] ],
33    tags: [ 'cat.keyboard', 'best-practice' ]
34  }
35]
36import { checkForViolations } from '@testcafe-community/axe';
37
38fixture `TestCafe tests with Axe`
39    //.page `http://example.com`;
40    .page `http://localhost:3000`;
41
42test('Automated accessibility testing', async t => {
43    // do stuff on your page
44    await checkForViolations(t);
45});
46

1var AxeBuilder = require('axe-webdriverjs');
2var WebDriver = require('selenium-webdriver');
3
4const path = require('path');
5process.env.PATH = path.resolve(`__dirname/../WebDriver/bin/Firefox/0.29.1`) + ':' + process.env.PATH;
6
7var driver = new WebDriver.Builder()
8  .forBrowser('firefox')
9  .build();
10
11driver
12  //.get('https://dequeuniversity.com/demo/mars/')
13  .get('http://localhost:3000')
14  .then(function() {
15    AxeBuilder(driver).analyze(function(err, results) {
16      if (err) {
17        // Handle error somehow
18      }
19      console.log(results.violations);
20    });
21  });
22> axe-webdriverjs-tests@1.0.0 test1 /Users/nabeen.jamal/gitlab.com/notifications-service/text-messaging-application/tma-test/app/axe-webdriverjs-tests
23> node test/axe.test1.js
24
25[
26  {
27    description: 'Ensures all page content is contained by landmarks',
28    help: 'All page content must be contained by landmarks',
29    helpUrl: 'https://dequeuniversity.com/rules/axe/3.5/region?application=webdriverjs',
30    id: 'region',
31    impact: 'moderate',
32    nodes: [ [Object], [Object] ],
33    tags: [ 'cat.keyboard', 'best-practice' ]
34  }
35]
36import { checkForViolations } from '@testcafe-community/axe';
37
38fixture `TestCafe tests with Axe`
39    //.page `http://example.com`;
40    .page `http://localhost:3000`;
41
42test('Automated accessibility testing', async t => {
43    // do stuff on your page
44    await checkForViolations(t);
45});
46nabeen.jamal@DEM-C02DFG1UMD6M axe-testcafe-tests % npx testcafe --config-file cfg/testcaferc.json chrome src/test1.js 
47(node:88006) ExperimentalWarning: Conditional exports is an experimental feature. This feature could change at any time
48(node:88006) ExperimentalWarning: Package name self resolution is an experimental feature. This feature could change at any time
49 Running tests in:
50 - Chrome 90.0.4430.212 / macOS 10.15.7
51
52 TestCafe tests with Axe
53 ✓ Automated accessibility testing
54
55
56 1 passed (0s)
57

1<div role="main"class="example-slider">
2  <h1 role="banner">Slider</h1>
3    <mat-slider 
4      min="1"
5      max="50"
6      step="0.5"
7      themePalette="primary"
8      id="slide"
9      value="1.5"
10      aria-label="slider"
11      role="contentinfo"
12      >
13    </mat-slider>
14  </div>
15

1<ul>
2    <li>list</li>
3    <li>list</li>
4       <ul class="shouldBeSublist">
5        <li>list</li>
6        <li>list</li>
7        <li>list</li>
8      </ul>
9    <li>list</li>
10</ul>
11

1<ul>
2    <li>list</li>
3    <li>list</li>
4       <ul class="shouldBeSublist">
5        <li>list</li>
6        <li>list</li>
7        <li>list</li>
8      </ul>
9    <li>list</li>
10</ul>
11$("ul ul").append(function () {
12                return this.closest("li");
13});
14

1<ul>
2    <li>list</li>
3    <li>list</li>
4       <ul class="shouldBeSublist">
5        <li>list</li>
6        <li>list</li>
7        <li>list</li>
8      </ul>
9    <li>list</li>
10</ul>
11$("ul ul").append(function () {
12                return this.closest("li");
13});
14<ul>
15    <li>list</li>
16    <li>list
17       <ul class="shouldBeSublist">
18        <li>list</li>
19        <li>list</li>
20        <li>list</li>
21      </ul>
22    **</li>**
23    <li>list</li>
24</ul>
25

1<select *ngIf="!viewMode" formControlName="group" placeholder="select" id="group" data-placement="right">
2    <option value="" [selected]>Select</option>
3    <option attr.aria-label="{{group.title}}" *ngFor="let group of records" 
4     [ngValue]="group" data-placement="right" data-toggle="tooltip" title="{{group.title}}">
5         {{group.title | slice:0:30}}
6         <span *ngIf="group.title.length > 30">...</span>
7    </option>
8</select>
9
10

1<div class="modal fade" bsModal #cancelConfirmModal="bs-modal" tabindex="-1" role="dialog"
2    attr.aria-label="Cancel Modal" aria-hidden="true">
3    <div class="md-dialog modal-md">
4        <!-- Modal content-->
5        <div class="md-content">
6            <div class="md-header">
7                <div class="md-title pull-left">
8                    <h4 tabindex=0 class="headerBottomMarginNone"> Cancel</h4>
9                </div>
10                <button type="button" class="close-popup" (click)="hideCancelModal()">
11                    <img src="{{ pathImg }}/close.png" alt="Close Icon"
12                        (mouseover)="changeCloseIconOnHover('close-popup3')"
13                        (mouseout)="changeCloseIcon('close-popup3')" id="close-popup3">
14                    <label class="sr-only">Close</label>
15                </button>
16            </div>
17            <div tabindex=0 class="md-body">
18                {{ cancelMessageBody }}
19            </div>
20            <div class="md-footer">
21                <button type="reset pull-right" class="ts-btn ts-btn-primary no-btm-margin" (click)="revert()">Yes</button>
22                <button type="pull-right" (click)="hideCancelModal()"
23                    class="ts-btn ts-btn-tertiary margin-left10 no-btm-margin">Cancel</button>
24            </div>
25        </div>
26    </div>
27</div>
28

1// a11y.js
2const { axeCheck, createReport } = require('axe-testcafe');
3
4const a11y = async t => {
5  const { error, violations } = await axeCheck(t);
6  await t.expect(violations.length === 0).ok(createReport(violations));
7};
8
9module.exports = {
10  a11y
11};
12

1// a11y.js
2const { axeCheck, createReport } = require('axe-testcafe');
3
4const a11y = async t => {
5  const { error, violations } = await axeCheck(t);
6  await t.expect(violations.length === 0).ok(createReport(violations));
7};
8
9module.exports = {
10  a11y
11};
12// mytest.js
13const myModule = require('a11y.js');
14
15fixture `TestCafe tests with Axe`
16    .page `http://example.com`;
17
18test('Automated accessibility testing', async t => {
19    await a11y();
20});
21

1// a11y.js
2const { axeCheck, createReport } = require('axe-testcafe');
3
4const a11y = async t => {
5  const { error, violations } = await axeCheck(t);
6  await t.expect(violations.length === 0).ok(createReport(violations));
7};
8
9module.exports = {
10  a11y
11};
12// mytest.js
13const myModule = require('a11y.js');
14
15fixture `TestCafe tests with Axe`
16    .page `http://example.com`;
17
18test('Automated accessibility testing', async t => {
19    await a11y();
20});
21Automated accessibility testing
22
23   1) with cannot implicitly resolve the test run in context of which it should be executed. If you need to call with from the Node.js API
24      callback, pass the test controller manually via with's `.with({ boundTestRun: t })` method first. Note that you cannot execute with outside
25      the test code.
26

1 org.openqa.selenium.JavascriptException: javascript error: eval is disabled
2(Session info: chrome=81.0.4044.138)
3Build info: version: '3.141.59', revision: 'e82be7d358', time: '2018-11-14T08:17:03'
4System info: host: 'XXXX', ip: 'XXXX', os.name: 'Windows 10', os.arch: 'amd64', 
5os.version: '10.0', java.version: '1.8.0_131'
6Driver info: org.openqa.selenium.chrome.ChromeDriver
7Capabilities {acceptInsecureCerts: false, browserName: chrome, browserVersion: 81.0.4044.138, chrome: 
8{chromedriverVersion: 81.0.4044.138 (8c6c7ba89cc9..., userDataDir: C:\Users\NASEEM~1.AHM\AppDa...}, 
9goog:chromeOptions: {debuggerAddress: localhost:52030}, javascriptEnabled: true, 
10networkConnectionEnabled: false, pageLoadStrategy: normal, platform: WINDOWS, platformName: WINDOWS, 
11proxy: Proxy(), setWindowRect: true, strictFileInteractability: false, timeouts: {implicit: 0, 
12pageLoad: 300000, script: 30000}, unhandledPromptBehavior: dismiss and notify, webauthn:virtualAuthenticators: true}
13Session ID: cbdfe9de190b8224da1ec675bef90966
14

1 org.openqa.selenium.JavascriptException: javascript error: eval is disabled
2(Session info: chrome=81.0.4044.138)
3Build info: version: '3.141.59', revision: 'e82be7d358', time: '2018-11-14T08:17:03'
4System info: host: 'XXXX', ip: 'XXXX', os.name: 'Windows 10', os.arch: 'amd64', 
5os.version: '10.0', java.version: '1.8.0_131'
6Driver info: org.openqa.selenium.chrome.ChromeDriver
7Capabilities {acceptInsecureCerts: false, browserName: chrome, browserVersion: 81.0.4044.138, chrome: 
8{chromedriverVersion: 81.0.4044.138 (8c6c7ba89cc9..., userDataDir: C:\Users\NASEEM~1.AHM\AppDa...}, 
9goog:chromeOptions: {debuggerAddress: localhost:52030}, javascriptEnabled: true, 
10networkConnectionEnabled: false, pageLoadStrategy: normal, platform: WINDOWS, platformName: WINDOWS, 
11proxy: Proxy(), setWindowRect: true, strictFileInteractability: false, timeouts: {implicit: 0, 
12pageLoad: 300000, script: 30000}, unhandledPromptBehavior: dismiss and notify, webauthn:virtualAuthenticators: true}
13Session ID: cbdfe9de190b8224da1ec675bef90966
14 JSONObject responseJSON = new AXE.Builder(driver, scriptUrl).analyze(); 
15

1import androidx.test.espresso.contrib.AccessibilityChecks;
2import androidx.test.ext.junit.runners.AndroidJUnit4;
3
4import org.junit.BeforeClass;
5import org.junit.runner.RunWith;
6
7@RunWith(AndroidJUnit4.class)
8public class AccessibilityChecksTest {
9
10    @BeforeClass
11    public static void turnOnAccessibility() {
12        AccessibilityChecks.enable();
13    }
14
15}
16

1import androidx.test.espresso.contrib.AccessibilityChecks;
2import androidx.test.ext.junit.runners.AndroidJUnit4;
3
4import org.junit.BeforeClass;
5import org.junit.runner.RunWith;
6
7@RunWith(AndroidJUnit4.class)
8public class AccessibilityChecksTest {
9
10    @BeforeClass
11    public static void turnOnAccessibility() {
12        AccessibilityChecks.enable();
13    }
14
15}
16androidTestImplementation 'androidx.test.espresso:espresso-contrib:3.2.0'
17