Skip to content

Revamp HTML-to-Formatter tool: bug fixes, tests, UI overhaul#1014

Open
gasharm wants to merge 1 commit intopnp:masterfrom
gasharm:feature/revamp-html-formatter
Open

Revamp HTML-to-Formatter tool: bug fixes, tests, UI overhaul#1014
gasharm wants to merge 1 commit intopnp:masterfrom
gasharm:feature/revamp-html-formatter

Conversation

@gasharm
Copy link
Copy Markdown

@gasharm gasharm commented Mar 5, 2026

Summary

  • Bug fixes in HTML-to-JSON conversion: proper handling of <p>, <filepreview>, SVG attributes (viewBox, preserveAspectRatio, d), aria-* attributes, data-interception, and CSS shorthand properties
  • Expanded test suite from 6 to 31 tests covering edge cases, SVG elements, nested structures, and CSS specificity
  • UI overhaul: modernized three-pane layout (Code, Generated CF JSON, HTML Preview) with resizable drag edges, auto-convert on typing (300ms debounce), iframe-based isolated HTML preview, built-in example card, new app logo and favicon, and updated README

Test plan

  • yarn test — 31 tests pass
  • yarn build — builds successfully with no errors
  • Visual check: HTML Preview renders responsively without CSS leakage from the app
  • Visual check: JSON output generates correctly for the default example
  • Visual check: Panel resizing works via drag edges between all sections
  • Visual check: Copy button copies JSON to clipboard

🤖 Generated with Claude Code

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@thechriskent thechriskent self-assigned this Mar 24, 2026
@thechriskent
Copy link
Copy Markdown
Contributor

Hi @gasharm! Thanks for your PR and spending the time to put this together! Just wanted to provide you an update and help set expectations on this.

The HTML to Formatter tool has been deprecated for quite a while - specifically because it's out of date. It's also had several problems/inconsistencies that have kept it from being usable for advanced scenarios. This PR may very well address some of those, and I'll be evaluating it from that perspective.

This PR will take a while to process and could potentially be rejected simply because this tool is not widely used nor supported. The functionality represented by this tool has been replaced and enhanced in the Jsonify VS Code extension - however, that extension does not have the benefit of being available online like this tool.

Please have patience as we go through this. Feel free to ask for updates or any other questions as we go. Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

2 participants