The latest articles on DEV Community by Justin Hong (@hongnoul). https://dev.to/hongnoul https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3963030%2F108b12de-3e1b-405b-9011-46ad9fd413d2.png https://dev.to/hongnoul en Justin Hong Sat, 25 Jul 2026 09:31:44 +0000 https://dev.to/hongnoul/stop-letting-your-coding-agent-claim-pixel-perfect-make-it-prove-9749-f4f https://dev.to/hongnoul/stop-letting-your-coding-agent-claim-pixel-perfect-make-it-prove-9749-f4f <p>Your coding agent edits a component, runs the build, and reports the UI is now "pixel-perfect." It never opened a browser. It's guessing.</p> <p>I got tired of that, so I built <a href="https://github.com/hongnoul/hwatu" rel="noopener noreferrer">hwatu</a>, a browser designed specifically for the agent verification loop.</p> <h2> The loop </h2> <div class="highlight js-code-highlight"> <pre class="highlight shell"><code>hwatu <span class="nt">--headless</span> http://localhost:3000 <span class="c"># open, no focus steal</span> hwatu wait-load <span class="c"># block until loaded</span> hwatu <span class="nb">eval</span> <span class="s1">'document.title'</span> <span class="c"># DOM-level checks</span> hwatu shot /tmp/check.png <span class="c"># screenshot</span> hwatu diff <span class="nt">--id</span> 1 <span class="nt">--baseline</span> before.png <span class="c"># pixel diff: 97.49% match + heatmap</span> hwatu close 1 </code></pre> </div> <p>The whole loop, screenshot included, runs in about 87 ms on my laptop. Cheap enough that the agent can verify after every edit instead of claiming success blind.</p> <h2> Design choices </h2> <ul> <li> <strong>Headless by default in agent environments.</strong> Windows never steal focus while you keep typing. When you want to look, the agent hands you the same live window as a normal browser.</li> <li> <strong>No Chromium.</strong> One static Rust binary plus your distro's <code>webkitgtk-6.0</code>. No 170 MB download per project.</li> <li> <strong>Three protocols.</strong> MCP (<code>hwatu mcp</code>), plain CLI, and a 1-line JSON socket. Works with Claude Code, Cursor, Jcode, or any harness.</li> <li> <strong>Real numbers.</strong> The diff command reports an actual match percentage with a heatmap, so "pixel-perfect" becomes a measurable claim.</li> </ul> <h2> Measured, not estimated </h2> <p>Every benchmark in the repo was measured on real runs with scripts you can rerun: window spawn medians of 13-16 ms, ~87 ms full verification loop, memory measured via PSS across all WebKit child processes. Methodology in <a href="https://github.com/hongnoul/hwatu/blob/main/docs/benchmarks.md" rel="noopener noreferrer">docs/benchmarks.md</a>.</p> <h2> Try it </h2> <div class="highlight js-code-highlight"> <pre class="highlight shell"><code>curl <span class="nt">-fsSL</span> https://raw.githubusercontent.com/hongnoul/hwatu/main/scripts/install.sh | bash hwatu setup <span class="c"># detects Claude Code, Cursor, Jcode, or generic MCP</span> </code></pre> </div> <p>MIT licensed. Linux (WebKitGTK). Feedback and issues welcome: <a href="https://github.com/hongnoul/hwatu" rel="noopener noreferrer">https://github.com/hongnoul/hwatu</a></p> agents ai testing tools