Eliminate raw HTML injection: convert ~kg-html/captions to native sx
Add shared/sx/html_to_sx.py (HTMLParser-based HTML→sx converter) and update lexical_to_sx.py so HTML cards, markdown cards, and captions all produce native sx expressions instead of opaque HTML strings. - ~kg-html now wraps native sx children (editor can identify the block) - New ~kg-md component for markdown card blocks - Captions are sx expressions, not escaped HTML strings - kg_cards.sx: replace (raw! caption) with direct caption rendering - sx-editor.js: htmlToSx() via DOMParser, serializeInline for captions, _childrenSx for ~kg-html/~kg-md, new kg-md edit UI - Migration script (blog/scripts/migrate_sx_html.py) to re-convert stored sx_content from lexical source Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
122
shared/sx/html_to_sx.py
Normal file
122
shared/sx/html_to_sx.py
Normal file
@@ -0,0 +1,122 @@
|
||||
"""
|
||||
HTML → sx source converter.
|
||||
|
||||
Converts an HTML string to an equivalent s-expression source string so that
|
||||
raw HTML can be eliminated from the sx tree.
|
||||
|
||||
html_to_sx('<p class="intro">Hello <em>world</em></p>')
|
||||
# → '(p :class "intro" "Hello " (em "world"))'
|
||||
|
||||
Uses only stdlib ``html.parser`` — no extra dependencies.
|
||||
"""
|
||||
from __future__ import annotations
|
||||
|
||||
from html.parser import HTMLParser
|
||||
|
||||
from .html import VOID_ELEMENTS, BOOLEAN_ATTRS
|
||||
|
||||
|
||||
def html_to_sx(html: str) -> str:
|
||||
"""Convert an HTML string to sx source."""
|
||||
if not html or not html.strip():
|
||||
return '""'
|
||||
parser = _SxBuilder()
|
||||
parser.feed(html)
|
||||
nodes = parser.finish()
|
||||
if not nodes:
|
||||
return '""'
|
||||
if len(nodes) == 1:
|
||||
return _serialize(nodes[0])
|
||||
return "(<> " + " ".join(_serialize(n) for n in nodes) + ")"
|
||||
|
||||
|
||||
# ---------------------------------------------------------------------------
|
||||
# Internal tree builder
|
||||
# ---------------------------------------------------------------------------
|
||||
|
||||
class _TextNode:
|
||||
__slots__ = ("text",)
|
||||
def __init__(self, text: str):
|
||||
self.text = text
|
||||
|
||||
class _ElementNode:
|
||||
__slots__ = ("tag", "attrs", "children")
|
||||
def __init__(self, tag: str, attrs: list[tuple[str, str | None]]):
|
||||
self.tag = tag
|
||||
self.attrs = attrs
|
||||
self.children: list[_TextNode | _ElementNode] = []
|
||||
|
||||
|
||||
class _SxBuilder(HTMLParser):
|
||||
def __init__(self):
|
||||
super().__init__(convert_charrefs=True)
|
||||
self._roots: list[_TextNode | _ElementNode] = []
|
||||
self._stack: list[_ElementNode] = []
|
||||
|
||||
def _append(self, node: _TextNode | _ElementNode):
|
||||
if self._stack:
|
||||
self._stack[-1].children.append(node)
|
||||
else:
|
||||
self._roots.append(node)
|
||||
|
||||
def handle_starttag(self, tag: str, attrs: list[tuple[str, str | None]]):
|
||||
node = _ElementNode(tag, attrs)
|
||||
self._append(node)
|
||||
if tag not in VOID_ELEMENTS:
|
||||
self._stack.append(node)
|
||||
|
||||
def handle_endtag(self, tag: str):
|
||||
# Pop back to the matching open tag (tolerant of mismatches)
|
||||
for i in range(len(self._stack) - 1, -1, -1):
|
||||
if self._stack[i].tag == tag:
|
||||
self._stack[i + 1:] = []
|
||||
self._stack.pop(i)
|
||||
return
|
||||
|
||||
def handle_data(self, data: str):
|
||||
if data:
|
||||
self._append(_TextNode(data))
|
||||
|
||||
def handle_comment(self, data: str):
|
||||
pass # skip HTML comments
|
||||
|
||||
def finish(self) -> list[_TextNode | _ElementNode]:
|
||||
# Strip whitespace-only text nodes at root level
|
||||
return [n for n in self._roots
|
||||
if not (isinstance(n, _TextNode) and not n.text.strip())]
|
||||
|
||||
|
||||
# ---------------------------------------------------------------------------
|
||||
# Serializer
|
||||
# ---------------------------------------------------------------------------
|
||||
|
||||
def _esc(s: str) -> str:
|
||||
"""Escape a string for sx double-quoted literals."""
|
||||
return s.replace("\\", "\\\\").replace('"', '\\"')
|
||||
|
||||
|
||||
def _serialize(node: _TextNode | _ElementNode) -> str:
|
||||
if isinstance(node, _TextNode):
|
||||
return f'"{_esc(node.text)}"'
|
||||
|
||||
parts = [node.tag]
|
||||
for name, value in node.attrs:
|
||||
if name in BOOLEAN_ATTRS:
|
||||
if value is None or value == "" or value == name:
|
||||
parts.append(f":{name} true")
|
||||
else:
|
||||
parts.append(f':{name} "{_esc(value)}"')
|
||||
elif value is None:
|
||||
# Attribute without value (non-boolean) — treat as boolean true
|
||||
parts.append(f":{name} true")
|
||||
else:
|
||||
parts.append(f':{name} "{_esc(value)}"')
|
||||
|
||||
if node.tag in VOID_ELEMENTS:
|
||||
return "(" + " ".join(parts) + ")"
|
||||
|
||||
if node.children:
|
||||
child_parts = [_serialize(c) for c in node.children]
|
||||
return "(" + " ".join(parts) + " " + " ".join(child_parts) + ")"
|
||||
|
||||
return "(" + " ".join(parts) + ")"
|
||||
159
shared/sx/tests/test_html_to_sx.py
Normal file
159
shared/sx/tests/test_html_to_sx.py
Normal file
@@ -0,0 +1,159 @@
|
||||
"""Unit tests for html_to_sx converter."""
|
||||
from __future__ import annotations
|
||||
|
||||
import pytest
|
||||
|
||||
from shared.sx.html_to_sx import html_to_sx
|
||||
|
||||
|
||||
class TestBasicElements:
|
||||
def test_simple_paragraph(self):
|
||||
assert html_to_sx("<p>Hello</p>") == '(p "Hello")'
|
||||
|
||||
def test_with_class(self):
|
||||
assert html_to_sx('<p class="intro">Hi</p>') == '(p :class "intro" "Hi")'
|
||||
|
||||
def test_multiple_attrs(self):
|
||||
result = html_to_sx('<a href="u" class="link">click</a>')
|
||||
assert result == '(a :href "u" :class "link" "click")'
|
||||
|
||||
def test_nested_inline(self):
|
||||
result = html_to_sx("<p>Hello <em>world</em></p>")
|
||||
assert result == '(p "Hello " (em "world"))'
|
||||
|
||||
def test_deeply_nested(self):
|
||||
result = html_to_sx("<div><p><strong>bold</strong></p></div>")
|
||||
assert result == '(div (p (strong "bold")))'
|
||||
|
||||
|
||||
class TestVoidElements:
|
||||
def test_br(self):
|
||||
assert html_to_sx("<br>") == "(br)"
|
||||
|
||||
def test_img(self):
|
||||
result = html_to_sx('<img src="a.jpg" alt="pic">')
|
||||
assert result == '(img :src "a.jpg" :alt "pic")'
|
||||
|
||||
def test_hr(self):
|
||||
assert html_to_sx("<hr>") == "(hr)"
|
||||
|
||||
def test_input(self):
|
||||
result = html_to_sx('<input type="text" value="hi">')
|
||||
assert result == '(input :type "text" :value "hi")'
|
||||
|
||||
|
||||
class TestBooleanAttrs:
|
||||
def test_checked(self):
|
||||
result = html_to_sx('<input type="checkbox" checked>')
|
||||
assert result == '(input :type "checkbox" :checked true)'
|
||||
|
||||
def test_disabled(self):
|
||||
result = html_to_sx('<button disabled>No</button>')
|
||||
assert result == '(button :disabled true "No")'
|
||||
|
||||
def test_controls(self):
|
||||
result = html_to_sx('<video controls></video>')
|
||||
assert result == '(video :controls true)'
|
||||
|
||||
|
||||
class TestTopLevel:
|
||||
def test_multiple_top_level(self):
|
||||
result = html_to_sx("<p>A</p><p>B</p>")
|
||||
assert result == '(<> (p "A") (p "B"))'
|
||||
|
||||
def test_single_top_level(self):
|
||||
result = html_to_sx("<p>Only</p>")
|
||||
assert result == '(p "Only")'
|
||||
|
||||
def test_text_only(self):
|
||||
result = html_to_sx("just text")
|
||||
assert result == '"just text"'
|
||||
|
||||
def test_empty(self):
|
||||
assert html_to_sx("") == '""'
|
||||
|
||||
def test_whitespace_only(self):
|
||||
assert html_to_sx(" \n ") == '""'
|
||||
|
||||
|
||||
class TestWhitespace:
|
||||
def test_root_whitespace_stripped(self):
|
||||
result = html_to_sx("\n<p>A</p>\n<p>B</p>\n")
|
||||
assert result == '(<> (p "A") (p "B"))'
|
||||
|
||||
|
||||
class TestEntities:
|
||||
def test_amp(self):
|
||||
result = html_to_sx("<p>A & B</p>")
|
||||
assert result == '(p "A & B")'
|
||||
|
||||
def test_lt_gt(self):
|
||||
result = html_to_sx("<p><tag></p>")
|
||||
assert result == '(p "<tag>")'
|
||||
|
||||
def test_nbsp(self):
|
||||
result = html_to_sx("<p>hello world</p>")
|
||||
assert result == '(p "hello\u00a0world")'
|
||||
|
||||
|
||||
class TestEscaping:
|
||||
def test_quotes_in_text(self):
|
||||
result = html_to_sx('<p>He said "hello"</p>')
|
||||
assert result == '(p "He said \\"hello\\"")'
|
||||
|
||||
def test_backslash_in_text(self):
|
||||
result = html_to_sx("<p>a\\b</p>")
|
||||
assert result == '(p "a\\\\b")'
|
||||
|
||||
def test_quotes_in_attr(self):
|
||||
# Attribute values with quotes get escaped
|
||||
result = html_to_sx('<div title="a"b">x</div>')
|
||||
assert result == '(div :title "a\\"b" "x")'
|
||||
|
||||
|
||||
class TestComments:
|
||||
def test_comment_stripped(self):
|
||||
result = html_to_sx("<!-- comment --><p>hi</p>")
|
||||
assert result == '(p "hi")'
|
||||
|
||||
|
||||
class TestMixedContent:
|
||||
def test_caption_with_link(self):
|
||||
result = html_to_sx('Photo by <a href="https://x.com">Author</a>')
|
||||
assert result == '(<> "Photo by " (a :href "https://x.com" "Author"))'
|
||||
|
||||
def test_caption_plain_text(self):
|
||||
result = html_to_sx("Figure 1")
|
||||
assert result == '"Figure 1"'
|
||||
|
||||
|
||||
class TestRoundtrip:
|
||||
"""html_to_sx → parse → render should produce equivalent HTML."""
|
||||
|
||||
def _roundtrip(self, html_in: str) -> str:
|
||||
from shared.sx.parser import parse
|
||||
from shared.sx.html import render
|
||||
sx_src = html_to_sx(html_in)
|
||||
expr = parse(sx_src)
|
||||
return render(expr)
|
||||
|
||||
def test_simple(self):
|
||||
assert self._roundtrip("<p>Hello</p>") == "<p>Hello</p>"
|
||||
|
||||
def test_nested(self):
|
||||
assert self._roundtrip("<p>A <em>B</em> C</p>") == "<p>A <em>B</em> C</p>"
|
||||
|
||||
def test_void(self):
|
||||
assert self._roundtrip('<img src="a.jpg" alt="">') == '<img src="a.jpg" alt="">'
|
||||
|
||||
def test_link(self):
|
||||
html = '<a href="https://example.com">click</a>'
|
||||
assert self._roundtrip(html) == html
|
||||
|
||||
def test_entities_roundtrip(self):
|
||||
# Entities get decoded by parser, then re-escaped by render
|
||||
assert self._roundtrip("<p>A & B</p>") == "<p>A & B</p>"
|
||||
|
||||
def test_multi_block(self):
|
||||
html = "<p>A</p><p>B</p>"
|
||||
assert self._roundtrip(html) == html
|
||||
Reference in New Issue
Block a user