Shift Left for Inclusion: Scalable Accessibility Testing with Cypress - CypressConf 2025

Learn how to integrate accessibility testing early in your development cycle using Cypress Accessibility. This talk is based on a deep dive into the tool, extracting practical strategies, actionable tips, and insights to foster a truly inclusive quality culture. We'll explore how to enable automated checks with zero setup, generate meaningful reports, and integrate everything seamlessly into your CI pipeline, with the goal of reducing accessibility debt and increasing your product's real-world impact.

The European Accessibility Act is coming. Is your team ready?

1. Shift Left for Inclusion:
Scalable Accessibility Testing
with Cypress
@ludovicobesana

2. SheTech Ambassador
Grafana & BrowserStack Champion
Startups Co-Founder
Open Source Contributor
Some passions: , ,
About me

3. @ludovicobesana

4. @ludovicobesana

5. The Persona Spectrum del Microsoft's Inclusive 101 Toolkit.
@ludovicobesana

6. @ludovicobesana

7. Accessibility

services can be used by people of all abilities, including those with
disabilities.

Goal: To remove barriers that could prevent someone from using a
product effectively, ensuring equal access for everyone.
@ludovicobesana

8. Why Accessibility Matters
@ludovicobesana
1 in 6 people worldwide live with a
disability (WHO, 2023)
In Italy, over 3 million users face digital
accessibility challenges (ISTAT)
$13 trillion in global purchasing power
from the disabled community (source:
Purple Pound)

9. @ludovicobesana

10. @ludovicobesana

11. @ludovicobesana

12. @ludovicobesana

13. What if was built
with barriers?
96% of the web
@ludovicobesana

14. 96%
@ludovicobesana

15. Only 3% of websites meet the
minimum WCAG AA standards.

A web that is almost entirely non-compliant.
@ludovicobesana

16. @ludovicobesana

17. Do you include accessibility
testing in your QA process 

(yes or no)?
@ludovicobesana

18. The harsh reality
@ludovicobesana

19. @ludovicobesana

20. @ludovicobesana

21. Main Challenges

Learning curve for teams
Perception that accessibility “slows down” development
Lack of organizational priority
No clear ownership within teams
@ludovicobesana

22. Accessibility Debt
@ludovicobesana

23. Accessibility Debt

Effects: Regressions, higher costs, legal risks, loss of users
Analogous to technical debt, but far more visible to users
@ludovicobesana

24. @ludovicobesana

25. Toxic Dynamics
“Finger pointing” between teams: designers blame developers, developers
blame PMs, QA is stuck in the middle — often without the tools to fix the problem.

Treating accessibility only as remediation (a post-release fix) leads to:
An endless backlog of bugs
Frustrated developers
Delayed releases
@ludovicobesana

26. What if I wanted to ignore
accessibility?
@ludovicobesana

27. Legal Risks and Penalties

face significant fines for failing to comply with accessibility regulations such as
WCAG and the Italian Law 4/2004.

Lawsuits: High-profile cases — like the Domino’s Pizza lawsuit in the U.S. —
show the financial risks of ignoring accessibility, with penalties reaching
hundreds of thousands of dollars.

Damaged Reputation: Not meeting accessibility standards can severely harm
a company’s reputation and erode customer trust.
@ludovicobesana

28. European Accessibility Act
Mandatory for:
Companies releasing digital products or services from June 2025
eCommerce, websites, mobile apps, e-books, software, banking, ecc.
Exemptions:
Micro-enterprises (<10 employees and <€2M turnover)
SMEs: exempt only if compliance causes a disproportionate burden (must be
documented and updated every 5 years)
What changes:
Transition from limited obligations to widespread enforcement across almost all
digital service providers.
@ludovicobesana

29. @ludovicobesana

30. How we can
solve this?
@ludovicobesana

31. @ludovicobesana

32. The Crucial Role of Design
About 60% of accessibility issues can be resolved during the design phase.

Designers can directly address 27 WCAG success criteria, including:
Color contrast
Navigation order
Visible focus indicators
Alternative text for images
Proper heading hierarchy

Always keep in mind the four WCAG principles:

Perceivable, Operable, Understandable, and Robust.
@ludovicobesana

33. Always the
four WCAG principles:
keep in mind
@ludovicobesana
Perceivable, Operable, Understandable, and Robust.

34. Make sure your design is
accessible from the start.
@ludovicobesana

35. @ludovicobesana

36. Recognize Common Accessibility Issues

Images without alternative text (alt text)
Missing labels on form fields
No visible keyboard focus
Illogical reading or navigation order
Improperly structured headings (H1, H2, H3…)
Vague or non-descriptive links (e.g., “Click here”)
Elements not accessible via keyboard (e.g., menus or sliders)
Overuse of tooltips or hover-only elements
Missing alternative text for video/audio content (captions, transcripts)
@ludovicobesana

37. Shift Left
@ludovicobesana

38. @ludovicobesana

39. What is
Shift Left?
@ludovicobesana

40. @ludovicobesana

41. In practice

Development: Use semantic HTML and linting (eslint-plugin-jsx-
a11y)
Testing: Automate A11y in Cypress
CI/CD: Enforce with Results API and branch gating
@ludovicobesana

42. REMEMBER:
Even if all automated tests pass, your
website or app might still not be 100%
accessible.
@ludovicobesana

43. We need to combine
automation with manual testing.
@ludovicobesana

44. Automation

A11y 

Testing
@ludovicobesana

45. Challenges in Automated A11y Testing
Flaky

Tests
Limited
Coverage
Performance
Trade-offs
@ludovicobesana

46. @ludovicobesana

47. @ludovicobesana

48. Approach A:
@ludovicobesana
Cypress + cypress-axe

49. Approach B:
@ludovicobesana
Cypress Accessibility Cloud

50. Cypress + cypress-axe
Runs axe-core directly inside your Cypress tests
Adds two key commands:
→ injects the axe library into the page
→ runs accessibility checks on the current DOM

Fully customizable scope (e.g., #main, .modal, [role="dialog"])
Integrates with local and CI runs

cy.checkA11y()
@ludovicobesana

51. @ludovicobesana

52. @ludovicobesana

53. @ludovicobesana

54. @ludovicobesana

55. @ludovicobesana

56. @ludovicobesana

57. Approach A: Pros & Cons
Pros:
Full control over where and when checks run
Open source, free, quick to set up
Excellent for small projects or CI prototypes
Cons:
Slows down functional tests
Limited coverage (checks only current state)
Basic text-based reporting — no dashboards
@ludovicobesana

58. Premium (Cypress Accessibility Cloud)
Zero setup: no code changes required
Scans DOM snapshots captured during every Cypress run
Detects violations across all page states (modals, hover, transitions)
Produces rich dashboards:
Run Summary
Views (per page)
Rules (per violation)
Branch Review (diffs between PRs)
Integrates with CI/CD and Results API for gating
@ludovicobesana

59. @ludovicobesana

60. @ludovicobesana

61. @ludovicobesana

62. @ludovicobesana

63. Branch Review & Results API

→ Shows New and Resolved accessibility issues
Results API: Enables automation gates (e.g., fail build if new criticals detected)
Use as quality gate in CI/CD pipelines
Tip: Integrate API results into Slack or Jira for instant team feedback
@ludovicobesana

64. @ludovicobesana

65. @ludovicobesana

66. Approach B: Pros & Cons
Pros:
Zero setup, full automation
Covers every state captured by your tests
Visual dashboards and trend analytics
Great for distributed teams
Cons:
Cloud-only (requires Cypress Cloud account)
Subscription cost for advanced features
Not ideal for offline or self-hosted environments
@ludovicobesana

67. @ludovicobesana

68. Resources
@ludovicobesana

69. https://learn.microsoft.com/en-us/training/paths/accessibility-fundamental/
@ludovicobesana

70. https://docs.cypress.io/app/guides/accessibility-testing
@ludovicobesana

71. https://docs.cypress.io/accessibility/get-started/introduction
@ludovicobesana

72. https://developer.mozilla.org/en-US/docs/Web/Accessibility
@ludovicobesana

73. @ludovicobesana

74. Start early:
reduce accessibility debt
Use a hybrid approach: 

local development + cloud and 

don’t forget about manual tests
Inclusivity Drives
Product Success
3 Take Aways
@ludovicobesana

75. If automation removes friction,
what’s stopping us from building
a ?more accessible web
@ludovicobesana

76. “Accessibility—essential for some,
useful for all.”
—W3C WAI
@ludovicobesana

77. Thank you
@ludovicobesana

78. Q&A
@ludovicobesana

79. News

80. Meet Ludovico
@ludovicobesana