lazycodex-ai 5.1.58 → 5.1.60

package/packages/shared-skills/skills/ulw-research/scripts/html-foreign-object.mjs

@@ -0,0 +1,61 @@
+// html-foreign-object.mjs - the <foreignObject> carve-out for the html-lite tokenizer.
+//
+// An <svg> element is raw drawing markup, except <foreignObject>, which by definition holds
+// HTML. The tokenizer keeps the svg's inner source in `raw` and additionally parses each
+// foreignObject subtree into real children of the svg node, so the fidelity checks read chart
+// HTML exactly like prose while the rest of the svg stays raw. Plain Node ESM, no dependencies.
+
+import { makeNode, readTag } from "./html-lite.mjs"
+
+/** Newlines in text before offset `to`. */
+function newlinesBefore(text, to) {
+	let count = 0
+	for (let at = text.indexOf("\n"); at !== -1 && at < to; at = text.indexOf("\n", at + 1)) count++
+	return count
+}
+
+/** Shift a parsed subtree's line numbers by `delta` (fragment lines are relative to the fragment). */
+function shiftLines(node, delta) {
+	node.line += delta
+	for (const child of node.children) shiftLines(child, delta)
+}
+
+const isLetter = (ch) => (ch >= "a" && ch <= "z") || (ch >= "A" && ch <= "Z")
+
+/**
+ * Parse an svg node's <foreignObject> subtrees into real children; the rest of the svg stays raw.
+ * @param {object} node an <svg> LiteNode whose `raw` holds its inner source
+ * @param {number} rawStartLine document line of the first raw character
+ * @param {(source: string) => object} parseHtml the tokenizer, passed in so this module never imports it back
+ */
+export function attachForeignObjects(node, rawStartLine, parseHtml) {
+	const raw = node.raw ?? ""
+	for (let lt = raw.indexOf("<"); lt !== -1; lt = raw.indexOf("<", lt + 1)) {
+		if (raw[lt + 1] === "/" || !isLetter(raw[lt + 1] ?? "")) continue
+		const open = readTag(raw, lt + 1)
+		if (open.name !== "foreignobject" || open.selfClosing) continue
+		let depth = 0
+		let innerEnd = raw.length
+		let resume = raw.length
+		for (let at = raw.indexOf("<", open.end); at !== -1; at = raw.indexOf("<", at + 1)) {
+			const closing = raw[at + 1] === "/"
+			if (!closing && !isLetter(raw[at + 1] ?? "")) continue
+			if (readTag(raw, at + (closing ? 2 : 1)).name !== "foreignobject") continue
+			if (closing) {
+				if (depth === 0) { innerEnd = at; const gt = raw.indexOf(">", at); resume = gt === -1 ? raw.length : gt + 1; break }
+				depth--
+			} else depth++
+		}
+		// Tags are lowercased by readTag, so the attached node is "foreignobject" like any parsed tag.
+		const fo = makeNode("foreignobject", open.attrs, node, rawStartLine + newlinesBefore(raw, lt))
+		const frag = parseHtml(raw.slice(open.end, innerEnd))
+		const body = frag.children.find((child) => child.tag === "body") ?? frag
+		for (const child of body.children) {
+			child.parent = fo
+			shiftLines(child, rawStartLine + newlinesBefore(raw, open.end) - 1)
+			fo.children.push(child)
+		}
+		node.children.push(fo)
+		lt = resume - 1
+	}
+}

package/packages/shared-skills/skills/ulw-research/scripts/html-lite.mjs

@@ -3,10 +3,13 @@
 // Single forward scan with indexOf (no whole-document regex, no backtracking). Produces a
 // LiteNode tree: { tag, attrs, children, parent, line, text, raw }. Text nodes carry
 // tag "#text"; <style>/<script>/<svg> keep their inner source in `raw` and have no parsed
-// children. The "#document" root also carries `ids` (id -> occurrence count) so
-// selectorPath can tell whether an id is unique. Plain Node ESM, no dependencies.
+// children, except an <svg> node also gains its <foreignObject> subtrees as parsed children
+// (see html-foreign-object.mjs; the rest of the svg stays raw). The "#document"
+// root also carries `ids` (id -> occurrence count) so selectorPath can tell whether an id
+// is unique. Plain Node ESM, no dependencies.
 
 import { decodeEntities } from "./entities.mjs"
+import { attachForeignObjects } from "./html-foreign-object.mjs"
 
 export { decodeEntities }
 
@@ -25,7 +28,7 @@ const SAFE_ID = /^[A-Za-z_][\w-]*$/
 export const PROSE_TAGS = new Set(["p", "li", ...HEADINGS, "td", "th", "figcaption", "blockquote", "dd", "dt"])
 export const PROSE_BREAKS = new Set([...P_CLOSERS, ...PROSE_TAGS, "br", "tr"])
 
-function makeNode(tag, attrs, parent, line) {
+export function makeNode(tag, attrs, parent, line) {
 	return { tag, attrs, children: [], parent, line, text: "", raw: null }
 }
 
@@ -181,6 +184,7 @@ export function parseHtml(source) {
 				if (!tag.selfClosing) {
 					const [innerEnd, resume] = findRawClose(src, tag.end, tag.name)
 					node.raw = src.slice(tag.end, innerEnd)
+					if (tag.name === "svg") attachForeignObjects(node, lineAt(starts, tag.end), parseHtml)
 					at = textStart = resume
 				}
 			} else if (!VOID_TAGS.has(tag.name)) {

package/packages/shared-skills/skills/ulw-research/scripts/html-lite.test.ts

@@ -129,6 +129,25 @@ describe("parseHtml", () => {
 		expect(childTags(svg.parent as LiteNode)).toEqual(["script", "svg", "p"])
 	})
 
+	test("#given an svg with drawing markup and a foreignObject #when parsed #then raw is kept and only the foreignObject subtree is parsed", () => {
+		// given
+		const source =
+			"<body><svg viewBox=\"0 0 200 100\"><path d=\"M0 0\"/><text>12%</text><foreignObject>\n<div>chart 110.6 mm</div>\n</foreignObject></svg></body>"
+		// when
+		const doc = parseHtml(source)
+		// then
+		const svg = byTag(doc, "svg")[0] as LiteNode
+		expect(svg.raw).toBe("<path d=\"M0 0\"/><text>12%</text><foreignObject>\n<div>chart 110.6 mm</div>\n</foreignObject>")
+		expect(childTags(svg)).toEqual(["foreignobject"])
+		const fo = byTag(doc, "foreignobject")[0] as LiteNode
+		expect(fo.line).toBe(1)
+		const div = byTag(doc, "div")[0] as LiteNode
+		expect(div.line).toBe(2)
+		expect(proseText(div)).toBe("chart 110.6 mm")
+		expect(byTag(doc, "text")).toHaveLength(0)
+		expect(byTag(doc, "path")).toHaveLength(0)
+	})
+
 	test("#given an unclosed fragment without body #when parsed #then the tree still has body > div > p", () => {
 		// given
 		const source = "<div><p>unclosed"