Evaluate Dashboard UI against Accessibility standards

[nwmac]

We need to conduct an evaluation of the Dashboard UI against accessibility standards.

Specifically for now:

• WCAG 2.1 (https://www.w3.org/TR/WCAG21/)
• EN 301 549 (https://en.wikipedia.org/wiki/EN_301_549)

Write up a report on compliance and identify key areas needing improvement and specific actions we need to take to reach compliance (or at least reach an acceptable level of compliance, TBD)

(Note, we may also need to evaluate against https://www.section508.gov/create/software-websites in the future)

[lvuch]

Tools and resources to use:
https://www.a11yproject.com/checklist/#appearance
https://www.a11yproject.com/resources/#browser-extensions
accessibilityinsights.com

[lvuch]

Here are some items from a pass on cluster dashboard page using accessibilityinsights.com fast pass:
https://mysuse-my.sharepoint.com/:w:/g/personal/lauren_harden_suse_com/EQr68YXSmqFLhuI4NjRf71wBMsXEM-bB_N1X2FZ7Yp-HEA

[lvuch]

Chatted with product brand team (Jesus and Cynthia)

• They need an instance to run/test the Axe tool they plan to use for automated testing. This tool requires integration in CI process.
• Aim is to begin early September

Technical requirements
- instance of running
- clarify: is any client or agency required to meet AAA grade? Cynthia has confidence we can meet A and AA. AAA is likely more than we would need. @nwmac Let me know if you know otherwise.

[lvuch]

From Chris Nuber (RFed) client had asked if Rancher had a VPAT/508 compliance on the federal side

[bdekany]

Hi,

I've try to integrate pa11y-ci to package.json.
Testing the login page is easy and generate a report (30+ issues against WCAG2 baseline)

But it's hard to test the actual dashboard as login and password field doesn't have CSS Element id nor class.

My pa11y configfile : rancher26.json

{
  "defaults": {
    "chromeLaunchConfig": {
      "ignoreHTTPSErrors": "true"
    }
  },
  "urls": [
    {
      "url": "https://rancher26.mylabserver.com/",
      "userAgent": "Mozilla"
    },
    {
      "url": "https://rancher26.mylabserver.com/dashboard/home",
      "userAgent": "Mozilla",
      "actions": [
        "set field div.mb-20 div.labeled-input.edit input to admin",
        "set field div div.labeled-input.edit input to password",
        "click element .btn.role-primary",
        "wait for path to be /dashboard/home"
      ]
    }
  ]
}

Installation on openSUSE:

sudo zypper in nodejs14 cairo gtk3 mozilla-nss libxshmfence1
sudo npm install -g pa11y-ci --unsafe-perm

Run command:
pa11y-ci -c rancher26.json

[gaktive]

This ticket has been superseded by newer accessibility tickets. #8986 is one example