🔪 Static DOM Surgeon

Surgically inject, patch, and modify HTML elements at scale using CSS selectors — without letting AI rewrite your entire file.

---

😫 The Pain Point

You ask an AI to "add a button to each product card." It rewrites your entire 1200-line HTML file. Half your CSS classes are renamed. Your SEO tags are gone. Your JS breaks.

Never again.

💊 The Solution: Surgical DOM Injection

from dom_surgeon import DOMSurgeon

surgeon = DOMSurgeon("index.html")

# Inject AR badge into ALL 21 product cards — targeting exact selector
surgeon.inject_into(".product-card .card-header", '<span class="ar-badge">AR Ready</span>', position="prepend")

# Add CGTrader CTA button to every card
surgeon.inject_into(".card-actions", '<a href="https://cgtrader.com" class="btn-cgtrader">Buy on CGTrader</a>')

# Verify structure integrity after surgery
surgeon.verify_structure(".product-card", [".ar-badge", ".btn-cgtrader"])

surgeon.save("index_patched.html")

✨ API Reference

Method	Description
inject_into(selector, html, position)	Inject HTML into matching elements
add_attribute(selector, attr, value)	Set attribute on all matches
remove_style_property(selector, prop)	Remove one CSS property from inline style
patch_all(selector, fn)	Apply custom function to all matches
verify_structure(selector, children)	Assert DOM structure is correct
save(output_path)	Save result with operation log

📖 Real-World Case Study

Task: Add AR badge + CGTrader buy button to 21 product cards in a B2B landing page.

• Manual / AI approach: ~45 minutes, high risk of breaking surrounding code.
• DOM Surgeon approach: ~8 lines of Python, 2 seconds runtime, zero breakage.

🚀 Install

pip install beautifulsoup4
git clone https://github.com/tanphan1105/static-dom-surgeon.git

💖 Support Open Research

If this tool saved you from AI-hallucinated DOM destruction, consider buying me a coffee. It fuels the continuous development of these B2B engineering tools!