Testing requirements discussion: E2E and Visual Regression standards

[alionazherdetska]

Proposed E2E testing requirements:

🔧 Core requirements (all components)

• Basic rendering - Component exists and renders without errors
• Prop behavior - Props actually change component appearance/behavior
• Accessibility audit - cy.checkA11y('#root-inner') passes
• Responsive behavior - Mobile/desktop breakpoints tested

🖱️ Interactive components only

• User interactions - Click, keyboard, focus events, hover
• State management - Props update component state correctly
• Event emission - Custom events fire with correct payloads
• Keyboard navigation - Tab order and accessibility

📋 Form components only

• Form integration - Form data submission works
• Validation states - Valid/invalid styling and ARIA attributes
• Error handling - Error messages display correctly

🎨 Proposed Visual regression testing requirements:

📋 Core requirements (all components)

• Default state - Component renders correctly with default props
• Responsive breakpoints - Mobile, tablet, and desktop viewports
• Prop variants - All component variants (primary, secondary, sizes, etc.)

🎯 Interactive components only

• Interaction states - Hover, focus, active states of triggers
• Open/closed states - Component in expanded and collapsed positions
• Full page context - Screenshots showing component positioning/overlays
• Keyboard navigation - Focus states and progression

🗂️ Container components only

• Content variations - Empty, single item, multiple items, overflow states
• Layout adaptations - Horizontal, vertical, and responsive layouts
• Scrolling behavior - Components with scrollable content

[alionazherdetska]

Are these sufficient baseline requirements in your opinion? What's missing or redundant in this list?

[alizedebray]

Thank you for the list, it looks great overall!
Here are some suggestions:

• Testing all components on all devices might be too much effort and not always necessary. Maybe we should prioritize layout-heavy components for full device coverage, and keep simpler components mainly tested on desktop.
• The “State management” and “Prop behavior” tests seem very similar. We could probably combine them or clarify what exactly is expected from each.
• Keyboard navigation depends a lot on the component. Perhaps we only test it where keyboard control is important (like menus or header). For visual testing, just checking focus styles might be enough.
• The open/closed states will probably be covered through prop variations, so we might not need separate tests for that.