e2e-test-implementation

E2E Test Implementation Guide

Systematic guide for implementing E2E tests identified in the test gap analysis (packages/nxtcm-rosa-hcp-wizard/docs/testing/E2E-TEST-GAPS.md), with reusable patterns for complex validation scenarios.

When to Use This Skill

Invoke this skill when:

• Implementing E2E tests from packages/nxtcm-rosa-hcp-wizard/docs/testing/E2E-TEST-GAPS.md
• Adding tests for cross-field validation (CIDR overlaps, VPC/subnet dependencies)
• Testing state management and navigation workflows
• Writing helper functions for wizard test automation
• Prioritizing test implementation from the backlog

Test Implementation Priority

From packages/nxtcm-rosa-hcp-wizard/docs/testing/E2E-TEST-GAPS.md, tests are classified:

HIGH Priority ⚠️

Add these first - critical user workflows and complex business logic:

1. VPC change resets subnet selection
2. CIDR overlap validations (Machine/Service/Pod mutual disjoint)
3. Machine CIDR subnet containment
4. Service/Pod CIDR subnet non-overlap
5. Edit from Review workflow
6. Back button state preservation
7. Machine CIDR prefix boundaries (multi-AZ vs single-AZ)

MEDIUM Priority

Important functionality, lower risk: 8. Review page comprehensive field verification 9. Validation blocks navigation 10. Service CIDR prefix boundaries 11. Valid input acceptance tests (positive cases)

LOW Priority

Nice-to-have coverage: 12. Rapid selection change race conditions 13. Default CIDR value application 14. Accessibility (keyboard navigation)

Test Implementation Patterns

Pattern 1: Cross-Field Validation (CIDR Overlap)

Use case: Testing Machine/Service/Pod CIDRs must be mutually disjoint

test('CIDR fields - must be mutually disjoint', async ({ page }) => {
  await openCidrFields(page);
  
  // Set Machine CIDR
  await page.getByRole('textbox', { name: 'Machine CIDR' }).fill('10.0.0.0/16');
  await page.getByRole('textbox', { name: 'Machine CIDR' }).press('Tab');
  
  // Service CIDR overlaps Machine
  const serviceCidr = page.getByRole('textbox', { name: 'Service CIDR' });
  await serviceCidr.fill('10.0.0.0/16');
  await serviceCidr.press('Tab');
  await expect(page.getByText(/overlaps.*Machine CIDR/i)).toBeVisible();
  
  // Fix Service CIDR
  await serviceCidr.fill('172.30.0.0/16');
  await serviceCidr.press('Tab');
  await expect(page.getByText(/overlaps/i)).not.toBeVisible();
});