AlexandrAI AGENTS.md
agents-md

HTML Editor Renderer Escape and Attribute Agent Guide

Agent guide for renderModel escaping, inline styles, data attributes, and active-node rendering.

AGENTS.md

Guidance for coding agents working on HTML Editor Renderer Escape and Attribute in the html-editor project.

Project overview

This guide covers src/renderer/src/render/renderModel.ts. The renderer turns trusted, parsed EditorDocument data into visible HTML for the iframe and export path. It must escape model text, produce stable data attributes for editing, and keep output self-contained.

Primary source files

  • src/renderer/src/render/renderModel.ts owns renderModelToHtml and helpers.
  • src/renderer/src/render/DocumentFrame.tsx depends on data-editor attributes for selection and inline editing.
  • src/renderer/src/render/exportHtml.ts embeds the rendered output into saved HTML.
  • src/renderer/src/render/renderModel.test.ts verifies escaping, sheets, charts, merges, and active-node filtering.

Setup commands

npm install npm test npm run typecheck npm run build

For focused validation, run npm test with renderModel tests before the full test suite.

Change rules

  • Escape text and attribute values before inserting model data into HTML.
  • Keep data-editor-id, data-editor-kind, and data-editor-layout stable for top nodes and box nodes.
  • Keep data-editor-cell and data-editor-block stable for inline cell and section editing.
  • Preserve activeId filtering so the canvas can render only the active top-level node.
  • Do not add external scripts, fonts, or stylesheets to exported HTML.

Testing

Include model text containing HTML-like content, quoted attributes, sheet cells, merged cells, inline chart SVG, active-node rendering, and empty section blocks.

PR checklist

  • All model-controlled strings pass through escaping or an equivalent safe path.
  • Data attributes remain compatible with DocumentFrame selectors.
  • Exported output stays self-contained.
  • Full npm test and npm run typecheck pass.