diff --git a/.buildkite/pipelines/pipeline_pull_request_test.yml b/.buildkite/pipelines/pipeline_pull_request_test.yml index 08118c5a138..418acd54bb5 100644 --- a/.buildkite/pipelines/pipeline_pull_request_test.yml +++ b/.buildkite/pipelines/pipeline_pull_request_test.yml @@ -50,6 +50,7 @@ steps: if: build.branch != "main" artifact_paths: - "cypress/screenshots/**/*.png" + - "cypress/videos/**/*.mp4" - command: .buildkite/scripts/pipeline_test.sh label: ":cypress: Cypress tests on React 17" @@ -60,6 +61,7 @@ steps: if: build.branch != "main" artifact_paths: - "cypress/screenshots/**/*.png" + - "cypress/videos/**/*.mp4" - command: .buildkite/scripts/pipeline_test.sh label: ":cypress: Cypress tests on React 18" @@ -70,3 +72,4 @@ steps: if: build.branch != "main" artifact_paths: - "cypress/screenshots/**/*.png" + - "cypress/videos/**/*.mp4" diff --git a/.buildkite/scripts/pipeline_test.sh b/.buildkite/scripts/pipeline_test.sh index 0a82ff17071..0ab290d4ed1 100644 --- a/.buildkite/scripts/pipeline_test.sh +++ b/.buildkite/scripts/pipeline_test.sh @@ -10,7 +10,7 @@ DOCKER_OPTIONS=( --user="$(id -u):$(id -g)" --volume="$(pwd):/app" --workdir=/app - docker.elastic.co/eui/ci:5.3 + docker.elastic.co/eui/ci:5.5 ) case $TEST_TYPE in @@ -41,17 +41,17 @@ case $TEST_TYPE in cypress:16) echo "[TASK]: Running Cypress tests against React 16" - DOCKER_OPTIONS+=(bash -c "/opt/yarn*/bin/yarn && yarn test-cypress --node-options=--max_old_space_size=2048 --react-version=16") + DOCKER_OPTIONS+=(bash -c "/opt/yarn*/bin/yarn && yarn cypress install && yarn test-cypress --node-options=--max_old_space_size=2048 --react-version=16") ;; cypress:17) echo "[TASK]: Running Cypress tests against React 17" - DOCKER_OPTIONS+=(bash -c "/opt/yarn*/bin/yarn && yarn test-cypress --node-options=--max_old_space_size=2048 --react-version=17") + DOCKER_OPTIONS+=(bash -c "/opt/yarn*/bin/yarn && yarn cypress install && yarn test-cypress --node-options=--max_old_space_size=2048 --react-version=17") ;; cypress:18) echo "[TASK]: Running Cypress tests against React 18" - DOCKER_OPTIONS+=(bash -c "/opt/yarn*/bin/yarn && yarn test-cypress --node-options=--max_old_space_size=2048") + DOCKER_OPTIONS+=(bash -c "/opt/yarn*/bin/yarn && yarn cypress install && yarn test-cypress --node-options=--max_old_space_size=2048") ;; *) diff --git a/.nvmrc b/.nvmrc index 4a1f488b6c3..f6610cade82 100644 --- a/.nvmrc +++ b/.nvmrc @@ -1 +1 @@ -18.17.1 +18.18.1 diff --git a/package.json b/package.json index a706480cee8..b12aaa7a153 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,7 @@ "main": "lib", "module": "es", "types": "eui.d.ts", - "docker_image": "18.17.1", + "docker_image": "18.18.1", "engines": { "node": "16.x || 18.x || >=20.0" }, @@ -32,17 +32,14 @@ "test": "yarn lint && yarn test-unit", "test-ci": "yarn test && yarn test-cypress", "test-unit": "node ./scripts/test-unit", - "test-a11y": "node ./scripts/a11y-testing", "test-staged": "yarn lint && node scripts/test-staged.js", "test-cypress": "node ./scripts/test-cypress", "test-cypress-dev": "yarn test-cypress --dev", "test-cypress-a11y": "yarn test-cypress --a11y", "combine-test-coverage": "sh ./scripts/combine-coverage.sh", - "start-test-server": "BABEL_MODULES=false NODE_ENV=puppeteer NODE_OPTIONS=--max-old-space-size=4096 webpack-dev-server --config src-docs/webpack.config.js --port 9999", "yo-component": "yo ./generator-eui/app/component.js", "update-token-changelog": "node ./scripts/update-token-changelog.js", "update-changelog-manual": "node -e \"require('./scripts/update-changelog').manualChangelog('${npm_config_release}')\"", - "start-test-server-and-a11y-test": "cross-env WAIT_ON_TIMEOUT=600000 start-server-and-test start-test-server http-get://localhost:9999 test-a11y", "yo-doc": "yo ./generator-eui/app/documentation.js", "yo-changelog": "yo ./generator-eui/changelog/index.js", "release": "node ./scripts/release.js", @@ -99,7 +96,6 @@ "vfile": "^4.2.0" }, "devDependencies": { - "@axe-core/puppeteer": "^4.4.2", "@babel/cli": "^7.21.5", "@babel/core": "^7.21.8", "@babel/plugin-proposal-class-properties": "^7.18.6", @@ -145,7 +141,6 @@ "@types/classnames": "^2.3.1", "@types/enzyme": "^3.10.5", "@types/jest": "^24.0.6", - "@types/node": "^10.17.5", "@types/react": "^18.2.14", "@types/react-dom": "^18.2.6", "@types/react-is": "^17.0.3", @@ -222,7 +217,6 @@ "prettier": "^2.8.8", "process": "^0.11.10", "prop-types": "^15.6.0", - "puppeteer": "^5.5.0", "raw-loader": "^4.0.1", "react": "^18.2.0", "react-16": "npm:react@^16.14.0", diff --git a/scripts/a11y-testing.js b/scripts/a11y-testing.js deleted file mode 100644 index b24125830d4..00000000000 --- a/scripts/a11y-testing.js +++ /dev/null @@ -1,106 +0,0 @@ -const chalk = require('chalk'); -const puppeteer = require('puppeteer'); -const { AxePuppeteer } = require('@axe-core/puppeteer'); - -const docsPages = async (root, page) => { - const pagesToSkip = [ - `${root}#/display/aspect-ratio`, // Has issues with the embedded audio player - `${root}#/layout/accordion`, // Has an issue with ARIA attributes - `${root}#/templates/page-template` // Has multiple `main` elements that we don't want to remove for bad copy/paste code - ]; - - return [ - root, - ...(await page.$$eval('nav a', (anchors) => anchors.map((a) => a.href))), - ].filter((link) => !pagesToSkip.includes(link)); -}; - -const printResult = (violations) => { - const violationData = violations.map( - ({ id, impact, description, nodes }) => ({ - id, - impact, - description, - nodes: nodes.length - })); - console.table(violationData); -} - -(async () => { - let totalViolationsCount = 0; - let root = 'http://localhost:9999/'; - let browser; - let page; - - try { - browser = await puppeteer.launch({ args: ['--no-sandbox'] }); - page = await browser.newPage(); - - await page.setBypassCSP(true); - } catch (e) { - console.log(chalk.red('Failed to setup puppeteer')); - console.log(e); - process.exit(1); - } - - try { - await page.goto(root); - } catch (e) { - root = 'http://localhost:8030/'; - try { - await page.goto(root); - } catch (e) { - console.log( - chalk.red( - 'No local server found. Expecting localhost:9999 or localhost:8030 to resolve.' - ) - ); - process.exit(1); - } - } - const links = await docsPages(root, page); - - for (const link of links) { - await page.goto(link); - - const { violations } = await new AxePuppeteer(page) - .options({ - runOnly: { - type: 'tag', - values: ['section508', 'wcag2a', 'wcag2aa', 'wcag21a', 'wcag21aa'] - }, - rules: { - 'color-contrast': { enabled: false }, - 'scrollable-region-focusable': { enabled: false }, - 'frame-title': { enabled: false }, // axe reports 18 page violations, but no