1

We use jenkins CI tool for automated accessibility testing provided by pa11y. As such i use the below Jenkinsfile to run the tests.

node('mypod') {

container('centos') {

def NODEJS_HOME
env.NODEJS_HOME = "${tool 'Node-12.0.0'}"
env.PATH="${env.NODEJS_HOME}/bin:${env.PATH}"
sh "'${env.NODEJS_HOME}'/bin/node --version"
sh "npm install -g pa11y --unsafe-perm"
sh "pa11y -V"

sh '''curl -O https://dl.google.com/linux/direct/google-chrome-stable_current_x86_64.rpm
      yum -y install ./google-chrome-stable_current_*.rpm
      yum -y install libXScrnSaver
      yum -y install atk java-atk-wrapper at-spi2-atk gtk3 libXt'''

withCredentials([file(credentialsId: '***', variable: 'pa11yconfig')]) {
    
sh "cat $pa11yconfig > config.json"

sh "pa11y --config config.json --ignore WCAG2AA.Principle3.Guideline3_2.3_2_2.H32.2 --ignore WCAG2AA.Principle1.Guideline1_4.1_4_3.G145.Fail --ignore WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.Fail --threshold 6 --reporter cli https://$URL > results.json"

}     
}
}

It installs the necessary things to run pa11y against the specified URL on linux based node. Windows are too much of a hassle so we use linux for this implementaion. Also to make this work for the browser to launch we use the below config.json file for pa11y to work.

{
    "chromeLaunchConfig": {
        "args": [
            "--no-sandbox",
            "--disable-setuid-sandbox",
            "--disable-dev-shm-usage"
        ]
    }
}

All of this works like a charm for any URl we provide. Now we would like to have some advanced configurations for lets say test if login works or filling a form on a webpage of a site so may be use Actions provided by pa11y. How should i merge Actions code into this json configuration file to achieve that. Actions is documented under :- https://github.com/pa11y/pa11y#actions

Any help or suggestions here would be greatly appreciated!

Ashley
  • 1,447
  • 3
  • 26
  • 52

1 Answers1

2

Something like this:

    "chromeLaunchConfig": {
        "args": [
            "--no-sandbox",
            "--disable-setuid-sandbox",
            "--disable-dev-shm-usage"
        ],
    },
    "reporter": "cli",
    "threshold": 6,
    "ignore:" [
        'WCAG2AA.Principle3.Guideline3_2.3_2_2.H32.2',
        'WCAG2AA.Principle1.Guideline1_4.1_4_3.G145.Fail',
        'WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.Fail'
    ]
    "actions": [
        "navigate to $URL",
        "wait for $ThingToHappen"
    ]
}

(I also included options that you're currently passing to the CLI directly, in case that's of interest to you)

hollsk
  • 3,124
  • 24
  • 34
  • Thanks for the prompt response. I did already get that part working. But i am unable to get the login part work for a webpage. It keeps saying "Error: Failed action: no element matching selector *****". I am trying the below: "set field *** to ***" "set field *** to ***", "click element ***", "wait for url to be https://***" Basically i am struggling to enter the actual username and password fields followed by submit login button for pa11y actions. How do i find what to put for those fields and button? https://github.com/pa11y/pa11y/blob/master/example/actions/index.js – Ashley Feb 03 '22 at 15:42
  • Let say i need to login for below. what should i use in Actions for username and password fields and the sign in button. https://www.linkedin.com/login?fromSignIn=true&trk=guest_homepage-basic_nav-header-signin i tried inspect element for the fields and the button but no matter what i provide it keeps saying "Failed action: no element matching selector *****"" – Ashley Feb 03 '22 at 15:57
  • Also your tutorial link doesn't work http://hollsk.co.uk/posts/view/using-actions-in-pa11y – Ashley Feb 03 '22 at 16:12
  • Yeah, my site is bust. Wayback Machine has archived the URL if you need it for the action name examples: https://web.archive.org/web/20190730221623/https://hollsk.co.uk/posts/view/using-actions-in-pa11y – hollsk Feb 03 '22 at 17:06
  • If you still can't get Pa11y to recognise the elements that you're using, you might want to try using the screenshot functionality to make sure that the page (or page state) Pa11y sees is the page/state you're intending to test - unexpected pages or redirects can sometimes cause this – hollsk Feb 03 '22 at 17:08
  • I was able to get the selector figured out. Just inspect on the field/button, right click and then copy selector and that worked for me. However ""wait for url to be ***" at the end of Actions results in timeout error and build fails. Welcome to Pa11y > Running Pa11y on URL https://**** > Running actions Error: TimeoutError: waiting for function failed: timeout 30000ms exceeded – Ashley Feb 03 '22 at 17:11
  • i recommend testing your script with Pa11y directly on the command line instead of through Jenkins, while you're trying to get this working - that way you'll be able to get Pa11y to take screenshots as it progresses through the script so you know it's doing what you think it's doing. You might also want to consider opening an issue in the Pa11y github repo to get support there instead of here as SO comments aren't the easiest place to work this stuff out as your situation progresses :-) https://github.com/pa11y/pa11y/issues – hollsk Feb 03 '22 at 17:29
  • I finally got everything working – Ashley Feb 03 '22 at 17:30
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/241697/discussion-between-ashley-and-hollsk). – Ashley Feb 03 '22 at 17:33