Test Pyramid
Overview
The test pyramid ensures that components function correctly across web, Android, and iOS platforms. It is structured into three layers: unit, regression and accessibility tests.
Layer 1 - Unit tests
- Focus on verifying the smallest units of code (functions, methods).
- Ensure correctness of component logic and behavior.
- Use Jest and
@testing-library
Layer 2 - Component tests
- Focus on testing UI components components individually with their immediate dependencies.
- covers all theme variants supported (currently being Betfair light, Betfair dark and Sky Bet light)
- Ensures that visual elements remain consistent and prevent unexpected design regressions.
- Use WebdriverIO to implement Visual regression tests that detect unintended UI changes by comparing screenshots of web and native apps before and after code updates.
Further reading about Visual tests can be found in VISUAL_TESTS.md
Layer 3 - Accessibility tests
- Focus on verifying that the UIs are accessible to people with disabilities (ensuring compatibility with screen readers, keyboard navigation, and other assistive technologies)
- Ensure that UI web components comply to a set of heuristics based on WCAG rules and other industry-accepted best practices (reference)
- Use Storybook and
@storybook/addon-a11yaddon
Test Execution Strategy
-
Unit tests: Run on every commit and pull request.
-
Regression tests: Run when there are changes that affect a components' package (e.g. web) (reference: Deploy Storybook (Web) workflow)
-
Accessibility tests: Run when there are changes that affect web components (reference: Deploy Storybook (Web) workflow)