mcpField
E
e2e-tester

e2e-tester

github.com/redpanda-dataTesting & quality4.3k48 installsUpdated today
Repository

About e2e-tester

e2e-tester is a skill for writing end-to-end tests for Redpanda Console with Playwright and Testcontainers. It covers multi-step browser journeys against a Docker-based stack, with practices for selectors, cleanup, and failure analysis.

Key features

  1. 01Playwright browser journey tests
  2. 02Testcontainers-managed application stack
  3. 03Accessible selector guidance
  4. 04Test data and container cleanup
  5. 05OSS and Enterprise test commands

Use cases

  1. 01Test multi-step user journeys
  2. 02Automate multi-page browser workflows
  3. 03Debug E2E failures
  4. 04Run OSS or Enterprise E2E suites

MCP support

The skill recommends using MCP Playwright agents via the Task tool to analyze test failures.

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/redpanda-data/console --skill e2e-tester

After installing, type/e2e-testerin Claude Code to confirm it loaded.

Bundled files

References and scripts installed along with SKILL.md.

references/
container-setup.md
failure-analysis.md
test-patterns.md

Details

From the project README

E2E Testing with Playwright & Testcontainers

Write end-to-end tests using Playwright against a full Redpanda Console stack running in Docker containers via testcontainers.

When to Use This Skill

  • Testing 2+ step user journeys (login -> action -> verify)
  • Multi-page workflows
  • Browser automation with Playwright

NOT for: Component unit tests -> use testing

Critical Rules

ALWAYS:

  • Run bun run build before running E2E tests (frontend assets required)
  • Use testcontainers API for container management (never manual docker commands in tests)
  • Use page.getByRole() and page.getByLabel() selectors (avoid CSS selectors)
  • Add data-testid attributes when semantic selectors aren't available
  • Use Task tool with MCP Playwright agents to analyze failures
  • Clean up test data using afterEach to call cleanup API endpoints

NEVER:

  • Test UI component rendering (use unit/integration tests)
  • Use brittle CSS selectors like .class-name or #id
  • Use force:true on .click() or waitForTimeout
  • Hard-code wait times (use waitFor with conditions)
  • Leave containers running after test failures
  • Commit test screenshots to git

Commands

bun run build                # Build frontend (REQUIRED first!)
bun run e2e-test             # Run OSS E2E tests
bun run e2e-test-enterprise  # Run Enterprise E2E tests
bun run e2e-test:ui          # Playwright UI mode (debugging)
bun run e2e-test tests/topics/create-topic.spec.ts  # Specific file

Test Architecture

OSS Mode (bun run e2e-test): Redpanda + Backend + OwlShop containers Enterprise Mode (bun run e2e-test-enterprise): Same + RBAC, SSO (requires console-enterprise repo)

File location: tests/<feature>/*.spec.ts

Selector Priority

  1. getByRole() - Best for accessibility
  2. getByLabel() - For form inputs
  3. getByText() - For content verification
  4. getByTestId() - When semantic selectors aren't clear
  5. CSS selectors - Avoid if possible

Test ID Naming

  • kebab-case: data-testid="feature-action-element"
  • Specific: include feature name + action + element type
  • Dynamic: data-testid={\item-delete-${id}`}`

References

Output

After completing work:

  1. Confirm frontend build succeeded
  2. Verify all E2E tests pass
  3. Note any new test IDs added to components
  4. Mention cleanup of test containers

Comments

Markdown supported