Stats
Actions
Tags
From all-commands
Configures end-to-end testing suite by assessing tech stack, selecting framework (Playwright/Cypress/etc.), installing tools via npm, and setting up test structure with page objects.
How this command is triggered — by the user, by Claude, or both
Slash command
/all-commands:e2e-setup 1. **Technology Stack Assessment**Files this command reads when invoked
This command is limited to the following tools:
The summary Claude sees in its command listing — used to decide when to auto-load this command
# End-to-End Testing Setup Command
Configure end-to-end testing suite
## Instructions
Follow this systematic approach to implement E2E testing: **$ARGUMENTS**
1. **Technology Stack Assessment**
- Identify the application type (web app, mobile app, API service)
- Review existing testing infrastructure
- Determine target browsers and devices
- Assess current deployment and staging environments
2. **E2E Framework Selection**
- Choose appropriate E2E testing framework based on stack:
- **Playwright**: Modern, fast, supports multiple browsers
- **Cypress**: Develope...Configure end-to-end testing suite
Follow this systematic approach to implement E2E testing: $ARGUMENTS
Technology Stack Assessment
E2E Framework Selection
Test Environment Setup
Framework Installation and Configuration
For Playwright:
npm install -D @playwright/test
npx playwright install
npx playwright codegen # Record tests
For Cypress:
npm install -D cypress
npx cypress open
For Selenium:
npm install -D selenium-webdriver
# Install browser drivers
Test Structure Organization
e2e/
├── tests/
│ ├── auth/
│ ├── user-flows/
│ └── api/
├── fixtures/
├── support/
│ ├── commands/
│ └── page-objects/
└── config/
Page Object Model Implementation
Example Page Object:
class LoginPage {
constructor(page) {
this.page = page;
this.emailInput = page.locator('#email');
this.passwordInput = page.locator('#password');
this.loginButton = page.locator('#login-btn');
}
async login(email, password) {
await this.emailInput.fill(email);
await this.passwordInput.fill(password);
await this.loginButton.click();
}
}
Test Data Management
Core User Journey Testing
Cross-Browser Testing Setup
Playwright Browser Configuration:
module.exports = {
projects: [
{ name: 'chromium', use: { ...devices['Desktop Chrome'] } },
{ name: 'firefox', use: { ...devices['Desktop Firefox'] } },
{ name: 'webkit', use: { ...devices['Desktop Safari'] } },
{ name: 'mobile', use: { ...devices['iPhone 12'] } },
],
};
API Testing Integration
Visual Testing Setup
Test Utilities and Helpers
Error Handling and Debugging
CI/CD Integration
GitHub Actions Example:
- name: Run Playwright tests
run: npx playwright test
- uses: actions/upload-artifact@v3
if: always()
with:
name: playwright-report
path: playwright-report/
Performance Testing Integration
Accessibility Testing
Mobile Testing Setup
Reporting and Monitoring
Test Maintenance Strategy
Security Testing Integration
Sample E2E Test:
test('user can complete purchase flow', async ({ page }) => {
// Navigate and login
await page.goto('/login');
await page.fill('#email', '[email protected]');
await page.fill('#password', 'password');
await page.click('#login-btn');
// Add item to cart
await page.goto('/products');
await page.click('[data-testid="product-1"]');
await page.click('#add-to-cart');
// Complete checkout
await page.goto('/checkout');
await page.fill('#card-number', '4111111111111111');
await page.click('#place-order');
// Verify success
await expect(page.locator('#order-confirmation')).toBeVisible();
});
Remember to start with critical user journeys and gradually expand coverage. Focus on stable, maintainable tests that provide real value.
npx claudepluginhub davepoon/buildwithclaude --plugin all-commands/e2e-setupConfigures end-to-end testing suite by assessing tech stack, selecting framework (Playwright/Cypress/etc.), installing tools via npm, and setting up test structure with page objects.
/e2eSets up Playwright end-to-end testing for Next.js apps: installs deps, scaffolds config, page objects, fixtures, and critical path tests for optional feature.
/generate-e2eGenerates end-to-end browser tests for user workflows using Playwright, Cypress, or Selenium, including page objects, scenarios, and assertions for full journeys.
/run-e2eRuns end-to-end tests using Playwright, Cypress, or Selenium; auto-detects framework, starts server if needed, filters by optional test pattern, and outputs summary table with pass/fail counts, failure details, and fix suggestions.