From 7a4e8a428ac5ca98c8826f3c41a271205b2f11e6 Mon Sep 17 00:00:00 2001 From: nsedrickm Date: Sun, 3 Jul 2022 21:25:44 +0100 Subject: [PATCH] mgr/dashboard: Add accessibility e2e tests for login page This commit adds e2e accessibility checks for the login page using cypress-axe and axe-core to help access the level of compliance to WCAG2.1 accessibility standards Fixes: https://tracker.ceph.com/issues/55820 Signed-off-by: nsedrickm --- .../mgr/dashboard/frontend/cypress.json | 2 +- .../cypress/integration/ui/login.e2e-spec.ts | 6 +++ .../frontend/cypress/support/index.ts | 1 + .../dashboard/frontend/cypress/tsconfig.json | 1 + .../mgr/dashboard/frontend/package-lock.json | 42 ++++++++++++++++++- .../mgr/dashboard/frontend/package.json | 2 + 6 files changed, 52 insertions(+), 2 deletions(-) diff --git a/src/pybind/mgr/dashboard/frontend/cypress.json b/src/pybind/mgr/dashboard/frontend/cypress.json index 0de1008cb5402..545c3d41565be 100644 --- a/src/pybind/mgr/dashboard/frontend/cypress.json +++ b/src/pybind/mgr/dashboard/frontend/cypress.json @@ -1,5 +1,5 @@ { - "baseUrl": "http://localhost:4200/", + "baseUrl": "https://localhost:4200/", "ignoreTestFiles": [ "*.po.ts", "**/orchestrator/**" diff --git a/src/pybind/mgr/dashboard/frontend/cypress/integration/ui/login.e2e-spec.ts b/src/pybind/mgr/dashboard/frontend/cypress/integration/ui/login.e2e-spec.ts index 29c9e9e10bbb2..2b337e6341628 100644 --- a/src/pybind/mgr/dashboard/frontend/cypress/integration/ui/login.e2e-spec.ts +++ b/src/pybind/mgr/dashboard/frontend/cypress/integration/ui/login.e2e-spec.ts @@ -14,4 +14,10 @@ describe('Login page', () => { login.doLogout(); }); + + it('should have no accessibility violations', () => { + login.navigateTo(); + cy.injectAxe(); + cy.checkA11y(); + }); }); diff --git a/src/pybind/mgr/dashboard/frontend/cypress/support/index.ts b/src/pybind/mgr/dashboard/frontend/cypress/support/index.ts index f2307131aa626..9a7d668650826 100644 --- a/src/pybind/mgr/dashboard/frontend/cypress/support/index.ts +++ b/src/pybind/mgr/dashboard/frontend/cypress/support/index.ts @@ -1,4 +1,5 @@ import '@applitools/eyes-cypress/commands'; +import 'cypress-axe'; import './commands'; diff --git a/src/pybind/mgr/dashboard/frontend/cypress/tsconfig.json b/src/pybind/mgr/dashboard/frontend/cypress/tsconfig.json index 90f899b57f639..0d1f6b468206e 100644 --- a/src/pybind/mgr/dashboard/frontend/cypress/tsconfig.json +++ b/src/pybind/mgr/dashboard/frontend/cypress/tsconfig.json @@ -9,6 +9,7 @@ "sourceMap": false, "types": [ "cypress", + "cypress-axe", "@applitools/eyes-cypress" ], "target": "es6" diff --git a/src/pybind/mgr/dashboard/frontend/package-lock.json b/src/pybind/mgr/dashboard/frontend/package-lock.json index a0827f0ef58e8..da63451809580 100644 --- a/src/pybind/mgr/dashboard/frontend/package-lock.json +++ b/src/pybind/mgr/dashboard/frontend/package-lock.json @@ -6796,6 +6796,12 @@ "integrity": "sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==", "dev": true }, + "axe-core": { + "version": "4.4.2", + "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.4.2.tgz", + "integrity": "sha512-LVAaGp/wkkgYJcjmHsoKx4juT1aQvJyPcW09MLCjVTh3V2cc6PnyempiLMNH5iMdfIX/zdbjUx2KDjMLCTdPeA==", + "dev": true + }, "axios": { "version": "0.21.4", "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.4.tgz", @@ -7258,6 +7264,16 @@ "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==", "dev": true }, + "bindings": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz", + "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==", + "dev": true, + "optional": true, + "requires": { + "file-uri-to-path": "1.0.0" + } + }, "bl": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/bl/-/bl-4.1.0.tgz", @@ -9856,6 +9872,12 @@ } } }, + "cypress-axe": { + "version": "0.14.0", + "resolved": "https://registry.npmjs.org/cypress-axe/-/cypress-axe-0.14.0.tgz", + "integrity": "sha512-7Rdjnko0MjggCmndc1wECAkvQBIhuy+DRtjF7bd5YPZRFvubfMNvrxfqD8PWQmxm7MZE0ffS4Xr43V6ZmvLopg==", + "dev": true + }, "cypress-cucumber-preprocessor": { "version": "4.3.1", "resolved": "https://registry.npmjs.org/cypress-cucumber-preprocessor/-/cypress-cucumber-preprocessor-4.3.1.tgz", @@ -11763,6 +11785,13 @@ "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.2.tgz", "integrity": "sha512-Wz3c3XQ5xroCxd1G8b7yL0Ehkf0TC9oYC6buPFkNnU9EnaPlifeAFCyCh+iewXTyFRcg0a6j3J7FmJsIhlhBdw==" }, + "file-uri-to-path": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz", + "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==", + "dev": true, + "optional": true + }, "fill-range": { "version": "7.0.1", "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", @@ -19200,6 +19229,13 @@ "thenify-all": "^1.0.0" } }, + "nan": { + "version": "2.16.0", + "resolved": "https://registry.npmjs.org/nan/-/nan-2.16.0.tgz", + "integrity": "sha512-UdAqHyFngu7TfQKsCBgAA6pWDkT8MAO7d0jyOecVhN5354xbLqdn8mV9Tat9gepAupm0bt2DbeaSC8vS52MuFA==", + "dev": true, + "optional": true + }, "nanoid": { "version": "3.3.4", "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz", @@ -27600,7 +27636,11 @@ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz", "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", "dev": true, - "optional": true + "optional": true, + "requires": { + "bindings": "^1.5.0", + "nan": "^2.12.1" + } }, "glob-parent": { "version": "3.1.0", diff --git a/src/pybind/mgr/dashboard/frontend/package.json b/src/pybind/mgr/dashboard/frontend/package.json index 6a95f1fff02dc..bb07fae85bac6 100644 --- a/src/pybind/mgr/dashboard/frontend/package.json +++ b/src/pybind/mgr/dashboard/frontend/package.json @@ -122,8 +122,10 @@ "@types/node": "12.12.62", "@types/simplebar": "5.1.1", "@types/swagger-ui": "3.52.0", + "axe-core": "4.4.2", "codelyzer": "6.0.2", "cypress": "9.7.0", + "cypress-axe": "0.14.0", "cypress-cucumber-preprocessor": "4.3.1", "cypress-iframe": "1.0.1", "cypress-multi-reporters": "1.5.0", -- 2.39.5