[E2E Test Self-Healing Project: E2E-Self-Healing]

by

Hello! I'm 2 yr+ experience on Frontend Develop, a junior Frontend Developer.


During the front-end development, you may have experienced the breaking of existing E2E test codes due to UI changes or minor markup modifications, and it takes time to maintain them.

Starting with the concern of "Can't we solve the vulnerability of test code by automating it with AI agent structure?" I built a small project called E2E-Self-Heal by combining the technologies I'm learning recently.

Repository Link:

Automatically repair broken Playwright E2E tests. When a UI change renames or restructures an element and a test's selector breaks, the engine diagnoses the failure, patches the broken selector/wait, verifies the new selector against the live DOM, then re-runs the test until it passes (or a retry cap is hit) and writes the fix back — as a local CLI or a CI GitHub Action that opens a patch PR.

How it works

Four layers drive a LangGraph repair loop:

  1. CLI core — the single entry point (e2e-healer); everything, including CI, calls it.

  2. Data Preprocessor — abstracts the raw Playwright log and the git diff into compact, hallucination-resistant context (the failing selector + the DOM attribute that changed).

  3. LangGraph agent — Diagnoser → Patch Generator → Selector Verifier → Test Runner, looping via a conditional Router until the test passes or max_loops is reached.

  4. Selector Verifier — checks each patched selector against the real page DOM so it resolves to exactly one element (Node/Playwright helper). Hallucinated (0 matches) or ambiguous (>1) selectors are reverted and re-patched before a full test run.

  5. Test Runner — runs npx playwright test via subprocess to validate each attempt.

8 views

Add a comment

Replies

Be the first to comment