Skip to content

tests: add cypress-axe test for homepage #4362

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
merged 27 commits into from
Mar 3, 2022
Merged

tests: add cypress-axe test for homepage #4362

merged 27 commits into from
Mar 3, 2022

Conversation

JoshuaKGoldberg
Copy link
Member

@JoshuaKGoldberg JoshuaKGoldberg commented Dec 29, 2021 •
edited
Loading

PR Checklist

Overview

Uses the failures table logging suggested in cypress-axe's docs:

┌─────────┬──────────────────────────────────────────────────────┬───────────────────────┬────────────┬───────┐
│ (index) │                       description                    │          id           │   impact   │ nodes │
├─────────┼──────────────────────────────────────────────────────┼───────────────────────┼────────────┼───────┤
│    0    │  'Ensure image alternative is not repeated as text'  │ 'image-redundant-alt' │  'minor'   │   1   │
│    1    │ 'Ensures all page content is contained by landmarks' │       'region'        │ 'moderate' │   1   │
└─────────┴───────────────────────────────────────────────────────────────────────────────────────────────────┴

Screenshot and video artifacts are made available per https://docs.github.com/en/actions/managing-workflow-runs/downloading-workflow-artifacts.

Index -- is accessible (failed)

@nx-cloud
Copy link

nx-cloud bot commented Dec 29, 2021 •
edited
Loading

☁️ Nx Cloud Report

CI ran the following commands for commit b91a294. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this branch

✅ Successfully ran 48 targets

Sent with 💌 from NxCloud.

@typescript-eslint
Copy link
Contributor

Thanks for the PR, @JoshuaKGoldberg!

typescript-eslint is a 100% community driven project, and we are incredibly grateful that you are contributing to that community.

The core maintainers work on this in their personal time, so please understand that it may not be possible for them to review your work immediately.

Thanks again!

🙏 Please, if you or your company is finding typescript-eslint valuable, help us sustain the project by sponsoring it transparently on https://opencollective.com/typescript-eslint. As a thank you, your profile/company logo will be added to our main README which receives thousands of unique visitors per day.

@netlify
Copy link

netlify bot commented Dec 29, 2021 •
edited
Loading

❌ Deploy Preview for typescript-eslint failed.

🔨 Explore the source changes: b91a294

🔍 Inspect the deploy log: https://app.netlify.com/sites/typescript-eslint/deploys/6220a16efdccad0007afdbfd

@bradzacher bradzacher added documentation Documentation ("docs") that needs adding/updating tests anything to do with testing labels Dec 29, 2021
@JoshuaKGoldberg JoshuaKGoldberg added the DO NOT MERGE PRs which should not be merged yet label Dec 30, 2021
@JoshuaKGoldberg JoshuaKGoldberg mentioned this pull request Dec 31, 2021
Closed
@JoshuaKGoldberg JoshuaKGoldberg mentioned this pull request Jan 2, 2022
Closed
7 tasks
@JoshuaKGoldberg JoshuaKGoldberg mentioned this pull request Jan 29, 2022
Merged
3 tasks
@codecov
Copy link

codecov bot commented Feb 12, 2022 •
edited
Loading

Codecov Report

Merging #4362 (b91a294) into main (fabfc2b) will increase coverage by 0.19%.
The diff coverage is 98.64%.

@@            Coverage Diff             @@
##             main    #4362      +/-   ##
==========================================
+ Coverage   92.41%   92.61%   +0.19%     
==========================================
  Files         350      303      -47     
  Lines       12059    10988    -1071     
  Branches     3430     3257     -173     
==========================================
- Hits        11144    10176     -968     
+ Misses        642      554      -88     
+ Partials      273      258      -15
Flag Coverage Δ
unittest 92.61% <98.64%> (+0.19%) ⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files Coverage Δ
...nt-plugin/src/rules/consistent-type-definitions.ts 97.14% <92.85%> (-0.16%) ⬇️
...gin/src/rules/naming-convention-utils/validator.ts 94.96% <100.00%> (-0.55%) ⬇️
...ges/eslint-plugin/src/rules/no-misused-promises.ts 98.71% <100.00%> (+0.07%) ⬆️
...es/eslint-plugin/src/rules/prefer-function-type.ts 97.14% <100.00%> (-0.05%) ⬇️
packages/scope-manager/src/variable/index.ts 50.00% <0.00%> (-50.00%) ⬇️
packages/typescript-estree/src/ts-estree/index.ts 66.66% <0.00%> (-33.34%) ⬇️
...es/eslint-plugin/src/util/getOperatorPrecedence.ts 31.42% <0.00%> (-28.58%) ⬇️
packages/type-utils/src/predicates.ts 36.23% <0.00%> (-2.66%) ⬇️
packages/scope-manager/src/referencer/Reference.ts 88.00% <0.00%> (-2.00%) ⬇️
.../src/rules/sort-type-union-intersection-members.ts 90.74% <0.00%> (-1.80%) ⬇️
... and 192 more

@JoshuaKGoldberg JoshuaKGoldberg marked this pull request as ready for review February 23, 2022 23:06
@bradzacher bradzacher removed the DO NOT MERGE PRs which should not be merged yet label Feb 23, 2022
bradzacher
bradzacher previously approved these changes Feb 23, 2022
View reviewed changes
Copy link
Member

@bradzacher bradzacher left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@JoshuaKGoldberg JoshuaKGoldberg enabled auto-merge (squash) February 23, 2022 23:58
@bradzacher
Copy link
Member

image

awkward

@JoshuaKGoldberg
Copy link
Member Author

Better we get the e2e test flake out now than in random unrelated PRs...

@JoshuaKGoldberg JoshuaKGoldberg marked this pull request as draft March 1, 2022 22:44
@JoshuaKGoldberg
Copy link
Member Author

JoshuaKGoldberg commented Mar 3, 2022 •
edited
Loading

<button type=\"button\" class=\"DocSearch DocSearch-Button\" aria-label=\"Search\">

Element has insufficient color contrast of 4.48 (foreground color: #7d8293, background color: #1a1b22, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1

https://www.color-hex.com/color/7d8293 -> that's rgb(125, 130, 147). But the actual color of the Search button is rgb(127, 132, 151).

My hunch from previous Cypress aXe color contrast flake is that the page is still transitioning colors in some way. Other than disabling animations altogether in tests (a little heavyweight IMO) I have yet to implement any better solution than upping the cy.wait 😢 .

I do want to play with https://developer.mozilla.org/en-US/docs/Web/API/Document/getAnimations though... maybe that's a good library to make.

@JoshuaKGoldberg JoshuaKGoldberg marked this pull request as ready for review March 3, 2022 11:14
@bradzacher bradzacher changed the title chore: add cypress-axe test for homepage tests: add cypress-axe test for homepage Mar 3, 2022
@bradzacher bradzacher merged commit 4ed686f into typescript-eslint:main Mar 3, 2022
@JoshuaKGoldberg JoshuaKGoldberg deleted the cypress-axe branch March 3, 2022 19:21
@JoshuaKGoldberg JoshuaKGoldberg mentioned this pull request Mar 26, 2022
Closed
@armano2
Copy link
Collaborator

armano2 commented Mar 31, 2022

i noticed somethign bad happening after this change,

html:root has higher priority than html[data-theme='dark'] and it looks that dark mode overrides are no longer working correctly

image

and this should be

image

armano2 added a commit that referenced this pull request Mar 31, 2022
@armano2
fix(website): correct dark mode color regression introduced in #4362
c73f7b1
@armano2 armano2 mentioned this pull request Mar 31, 2022
Merged
bradzacher pushed a commit that referenced this pull request Mar 31, 2022
@armano2
docs(website): correct dark mode color regression introduced in #4362 (…
363fb0a 
…#4771)
@github-actions github-actions bot locked as resolved and limited conversation to collaborators May 23, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@bradzacher bradzacher bradzacher approved these changes

Assignees
No one assigned
Labels
documentation Documentation ("docs") that needs adding/updating tests anything to do with testing
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Add accessibility/aXe audits on the website as part of CI
3 participants
@JoshuaKGoldberg @bradzacher @armano2