import { test } from "node:test";
import assert from "node:assert/strict";
import { normalizeSocialSvg, socialSvgProblem } from "./settingsSchema";
import { SVG_PROBLEM } from "./socialSvg";
import { scopeSvgIds, sizeSocialSvg } from "./socialLinks";
import { ADVERSARIAL, LOADS_ELSEWHERE, REAL_SHAPES } from "./socialSvg.vectors";

// normalizeSocialSvg runs on every save of a social link (Settings, a site's
// form, the homepage config). It used to theme only the ROOT <svg>'s fill, so a
// child that paints itself kept its colour: the operator's x.com icon — X's
// official file, `fill="none"` on the root and `fill="white"` on its one path —
// was white on the light footer (1.11:1; release 10, slice O's screenshots).
// A SINGLE-colour icon's fills — root and children — now become currentColor
// (the footer link's colour, which follows the theme); no paint, gradients and
// mask values stay. An icon of two or more colours draws its shape with them
// (YouTube's mark, a badge) and keeps every colour as pasted (review, O1).

// The two icons in the operator's settings.json, verbatim (2026-09-28).
const X_COM = `<svg aria-hidden="true" viewBox="0 0 1200 1227" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z" fill="white"/>
</svg>`;

const KIWI_FARMS = `<svg aria-hidden="true" fill="currentColor" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 70.307863 74.803198" enable-background="new 0 0 198.689 74.803" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg"><defs id="defs15"><linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="-296.84601" y1="-520.1969" x2="-296.84601" y2="-595" gradientTransform="matrix(1,0,0,-1,331.99986,-520.1968)"><stop offset="0" style="stop-color:#D7DF23" id="stop1" /><stop offset="1" style="stop-color:#8DC63F" id="stop5" /></linearGradient></defs><path fill="url(#SVGID_1_)" d="m 38.615858,74.803198 c 12.037,-10.62 z" id="path5" style="fill:url(#SVGID_1_)" /><circle fill="#414042" cx="31.16486" cy="9.6271973" r="2.1010001" id="circle5" /></svg>`;

// The export e2e fixture's icon (already normalized) and the editor e2e's
// un-normalized one.
const FIXTURE = `<svg aria-hidden="true" fill="currentColor" viewBox="0 0 24 24"><path d="M1 1h2"/></svg>`;
const BARE = `<svg viewBox="0 0 24 24"><path d="M0 0h24v24H0z"/></svg>`;

// YouTube's official mark (Wikimedia's "YouTube full-color icon"): a red
// rounded rectangle and a white play triangle. Two colours ARE its shape.
const YOUTUBE = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 159 110"><path d="m154 17.5c-1.82-6.73-7.07-12-13.8-13.8-9.04-3.49-96.6-5.2-122 0.1-6.73 1.82-12 7.07-13.8 13.8-4.08 17.9-4.39 56.6 0.1 74.9 1.82 6.73 7.07 12 13.8 13.8 17.9 4.12 103 4.7 122 0 6.73-1.82 12-7.07 13.8-13.8 4.35-19.5 4.66-55.8-0.1-75z" fill="#f00"/><path d="m105 55-40.8-23.4v46.8z" fill="#fff"/></svg>`;

// The common "badge": a dark disc with a white glyph cut into it.
const BADGE = `<svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="12" fill="#1d1d1d"/><path fill="#ffffff" d="M7 7h10v10H7z"/></svg>`;

// Every fill attribute / style declaration, in document order.
const fills = (svg: string) =>
  [...svg.matchAll(/\sfill\s*=\s*"([^"]*)"|[;"']\s*fill\s*:\s*([^;"']*)/g)].map(
    (m) => m[1] ?? m[2],
  );

function normalized(raw: string): string {
  const out = normalizeSocialSvg(raw);
  assert.ok(out, "accepted");
  return out;
}

test("x.com: the path's white becomes currentColor; the root keeps fill=none", () => {
  const out = normalized(X_COM);
  assert.deepEqual(fills(out), ["none", "currentColor"]);
  assert.ok(out.startsWith('<svg aria-hidden="true" viewBox="0 0 1200 1227" fill="none"'));
  assert.ok(!/white/i.test(out));
  // Nothing else moved: only the one attribute value changed.
  assert.equal(out, X_COM.replace('fill="white"', 'fill="currentColor"'));
});

test("Kiwi Farms: its gradient stays, its stops untouched; the grey dot follows the theme", () => {
  const out = normalized(KIWI_FARMS);
  assert.deepEqual(fills(out), [
    "currentColor", // the root, as stored
    "url(#SVGID_1_)", // the path's attribute
    "url(#SVGID_1_)", // and its style
    "currentColor", // the circle, was #414042
  ]);
  assert.ok(out.includes('style="stop-color:#D7DF23"'));
  assert.ok(out.includes('style="stop-color:#8DC63F"'));
  assert.equal(out, KIWI_FARMS.replace('fill="#414042"', 'fill="currentColor"'));
});

test("an icon that already follows the theme is unchanged", () => {
  assert.equal(normalized(FIXTURE), FIXTURE);
  const stroked = `<svg aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor"><path d="M1 1h2" stroke="#000"/></svg>`;
  assert.equal(normalized(stroked), stroked, "fill=none and strokes are not fills");
});

test("a bare icon still gains the root's fill and aria-hidden, as before", () => {
  assert.equal(
    normalized(BARE),
    `<svg aria-hidden="true" fill="currentColor" viewBox="0 0 24 24"><path d="M0 0h24v24H0z"/></svg>`,
  );
});

test("one colour in every spelling is themed, on the root and in a style; other fill-* are not", () => {
  const out = normalized(
    `<svg viewBox="0 0 8 8" fill="#FFFFFF"><path fill='#fff' fill-rule="evenodd" d="M0 0"/>` +
      `<rect style="opacity:.5; fill: rgb(255, 255, 255) ;fill-opacity:.4" fill-opacity="0.5"/>` +
      `<circle fill="White"/><ellipse fill="url(#g) #000"/><g fill="inherit"><path fill="transparent"/></g></svg>`,
  );
  assert.equal(
    out,
    `<svg aria-hidden="true" viewBox="0 0 8 8" fill="currentColor"><path fill='currentColor' fill-rule="evenodd" d="M0 0"/>` +
      `<rect style="opacity:.5; fill: currentColor;fill-opacity:.4" fill-opacity="0.5"/>` +
      `<circle fill="currentColor"/><ellipse fill="url(#g) #000"/><g fill="inherit"><path fill="transparent"/></g></svg>`,
  );
});

test("YouTube's mark keeps its red and its white: two colours are its shape", () => {
  const out = normalized(YOUTUBE);
  assert.deepEqual(fills(out), ["currentColor", "#f00", "#fff"]);
  // Only the root gains what it always did (a fill for any unpainted child,
  // aria-hidden); the paths are as pasted.
  assert.equal(
    out,
    YOUTUBE.replace("<svg ", '<svg aria-hidden="true" fill="currentColor" '),
  );
});

test("a dark disc with a white glyph keeps both colours", () => {
  const out = normalized(BADGE);
  assert.deepEqual(fills(out), ["currentColor", "#1d1d1d", "#ffffff"]);
  assert.equal(out, BADGE.replace("<svg ", '<svg aria-hidden="true" fill="currentColor" '));
});

test("a root colour and a different child colour are two colours: nothing is themed", () => {
  const raw = `<svg aria-hidden="true" viewBox="0 0 8 8" fill="#fff"><path fill="#000" d="M0 0"/><path d="M1 1"/></svg>`;
  assert.equal(normalized(raw), raw);
});

test("a mask's fills are how much shows through, not a colour: kept", () => {
  const raw =
    `<svg viewBox="0 0 8 8"><mask id="m"><rect fill="white" width="8" height="8"/><circle fill="black" r="2"/></mask>` +
    `<path mask="url(#m)" fill="#fff" d="M0 0"/></svg>`;
  const out = normalized(raw);
  assert.ok(out.includes(`<mask id="m"><rect fill="white" width="8" height="8"/><circle fill="black" r="2"/></mask>`));
  assert.ok(out.includes(`<path mask="url(#m)" fill="currentColor" d="M0 0"/>`));
});

test("an animation's fill is timing, not paint: never touched, never counted", () => {
  const raw =
    `<svg viewBox="0 0 8 8"><path fill="#fff" d="M0 0">` +
    `<animate attributeName="opacity" from="0" to="1" dur="1s" fill="freeze"/>` +
    `<animateTransform attributeName="transform" type="rotate" dur="1s" fill="remove"/></path>` +
    `<set attributeName="opacity" to="1" fill="freeze"/></svg>`;
  const out = normalized(raw);
  assert.ok(out.includes(`<path fill="currentColor" d="M0 0">`), "the one colour is themed");
  assert.ok(out.includes(`dur="1s" fill="freeze"/>`));
  assert.ok(out.includes(`type="rotate" dur="1s" fill="remove"/>`));
  assert.ok(out.includes(`<set attributeName="opacity" to="1" fill="freeze"/>`));
});

test("an empty self-closing <mask/> does not swallow what follows it", () => {
  const raw =
    `<svg viewBox="0 0 8 8"><mask id="a"/><path fill="#fff" d="M0 0"/>` +
    `<mask id="b"><rect fill="white" width="8" height="8"/></mask></svg>`;
  const out = normalized(raw);
  assert.ok(out.includes(`<mask id="a"/><path fill="currentColor" d="M0 0"/>`));
  assert.ok(out.includes(`<mask id="b"><rect fill="white" width="8" height="8"/></mask>`));
});

// Figma's export of a one-colour icon: the shape in a group clipped to the
// frame, and the clip a white rect in <defs>. A clip never paints, so its white
// is no second colour (release 11, O2b; O1's review, "a <clipPath>'s fill").
const FIGMA = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1_2)">
<path d="M12 2L2 22h20L12 2z" fill="black"/>
</g>
<defs>
<clipPath id="clip0_1_2">
<rect width="24" height="24" fill="white"/>
</clipPath>
</defs>
</svg>`;

test("Figma: a clip's white is no colour — the black shape is themed, the clip kept", () => {
  const out = normalized(FIGMA);
  assert.deepEqual(fills(out), ["none", "currentColor", "white"]);
  assert.equal(
    out,
    FIGMA.replace(' width="24" height="24" viewBox', ' viewBox')
      .replace("<svg ", '<svg aria-hidden="true" ')
      .replace('fill="black"', 'fill="currentColor"'),
  );
  // A self-closing clipPath passes over just itself; a clip with two colours
  // inside still counts as none of the icon's.
  const selfClosed =
    `<svg viewBox="0 0 8 8"><clipPath id="c"/><path fill="#fff" d="M0 0"/>` +
    `<clipPath id="d"><rect fill="white"/><circle fill="#f00"/></clipPath></svg>`;
  const out2 = normalized(selfClosed);
  assert.ok(out2.includes(`<clipPath id="c"/><path fill="currentColor" d="M0 0"/>`));
  assert.ok(out2.includes(`<clipPath id="d"><rect fill="white"/><circle fill="#f00"/></clipPath>`));
});

test("idempotent: a stored icon normalizes to itself", () => {
  for (const raw of [X_COM, KIWI_FARMS, FIXTURE, BARE, YOUTUBE, BADGE, FIGMA]) {
    const once = normalized(raw);
    assert.equal(normalized(once), once);
  }
});

test("still refuses what is unsafe to inline", () => {
  assert.equal(normalizeSocialSvg(`<svg viewBox="0 0 1 1"><script>x()</script></svg>`), null);
  assert.equal(normalizeSocialSvg(`<svg viewBox="0 0 1 1" onload="x()"></svg>`), null);
  assert.equal(normalizeSocialSvg(`<svg><path fill="white"/></svg>`), null, "no viewBox");
});

// A ROOT WITH A SIZE AND NO viewBox. A vendor's file often carries only its
// width and height; it used to be refused as pasted, and the operator had to
// add a viewBox by hand. Its size now becomes `viewBox="0 0 W H"` before the
// size is stripped. A synthetic two-colour disc with a letter, shaped like such
// a file: a dark offset disc, a light disc with a dark outline, a dark glyph,
// `fill="none"` on the root.
const SIZED_DISC =
  `<svg xmlns="http://www.w3.org/2000/svg" width="81" height="81" fill="none">` +
  `<circle cx="44" cy="43" r="37" fill="#1a1a1a"/>` +
  `<circle cx="39" cy="39" r="38" fill="#f4c542" stroke="#1a1a1a" stroke-width="1.5"/>` +
  `<path fill="#1a1a1a" d="M30 22h20v8H38v6h10v8H38v14h-8z"/></svg>`;

test("a disc pasted with only its size: accepted, its size made the viewBox, both colours kept", () => {
  const out = normalized(SIZED_DISC);
  assert.ok(
    out.startsWith('<svg aria-hidden="true" viewBox="0 0 81 81" xmlns="http://www.w3.org/2000/svg" fill="none">'),
    out.slice(0, 120),
  );
  assert.ok(!/\s(width|height)\s*=\s*"81"/.test(out.slice(0, out.indexOf(">"))), "size stripped");
  assert.deepEqual(fills(out), ["none", "#1a1a1a", "#f4c542", "#1a1a1a"]);
  // Nothing below the root moved.
  assert.equal(out.slice(out.indexOf(">")), SIZED_DISC.slice(SIZED_DISC.indexOf(">")));
});

test("a size in px or unitless, either quote, decimals: the viewBox is the numbers", () => {
  const box = (open: string) => {
    const out = normalized(`${open}<path fill="#fff" d="M0 0"/></svg>`);
    return /\sviewBox="([^"]*)"/.exec(out)?.[1];
  };
  assert.equal(box(`<svg width="24" height="24">`), "0 0 24 24");
  assert.equal(box(`<svg width="24px" height='16PX'>`), "0 0 24 16");
  assert.equal(box(`<svg height=" 12.5 " width="30">`), "0 0 30 12.5");
  assert.equal(box(`<svg width="048" height=".5">`), "0 0 48 0.5");
  // stroke-width on the root is not a width.
  assert.equal(box(`<svg stroke-width="2" width="10" height="20">`), "0 0 10 20");
  // A size spelled inside another attribute's value is not the root's size.
  assert.equal(
    normalizeSocialSvg(`<svg data-a=' width="7" height="9"'><path d="M0 0"/></svg>`),
    null,
  );
});

test("a size that is not a pixel size is still refused", () => {
  for (const open of [
    `<svg width="100%" height="100%">`,
    `<svg width="2em" height="2em">`,
    `<svg width="24">`,
    `<svg height="24">`,
    `<svg width="0" height="24">`,
    `<svg width="24" height="0">`,
    `<svg width="" height="24">`,
    `<svg width="-24" height="24">`,
    `<svg width="auto" height="24">`,
    `<svg stroke-width="2">`,
  ]) {
    assert.equal(normalizeSocialSvg(`${open}<path d="M0 0"/></svg>`), null, open);
    assert.equal(socialSvgProblem(`${open}<path d="M0 0"/></svg>`), SVG_PROBLEM.viewBox, open);
  }
});

test("a viewBox already there is never replaced by the size", () => {
  const raw = `<svg width="81" height="81" viewBox="0 0 24 24"><path fill="#fff" d="M0 0"/></svg>`;
  assert.equal(
    normalized(raw),
    `<svg aria-hidden="true" fill="currentColor" viewBox="0 0 24 24"><path fill="currentColor" d="M0 0"/></svg>`,
  );
  // A single-quoted viewBox was refused before this change and still is: the
  // size never adds a second one.
  assert.equal(
    normalizeSocialSvg(`<svg width="8" height="8" viewBox='0 0 8 8'><path d="M0 0"/></svg>`),
    null,
  );
});

test("idempotent with a synthesized viewBox", () => {
  const once = normalized(SIZED_DISC);
  assert.equal(normalized(once), once);
  const sized = normalized(`<svg width="24" height="24"><path fill="#fff" d="M0 0"/></svg>`);
  assert.equal(normalized(sized), sized);
});

// ── WHAT AN ICON MAY CONTAIN ────────────────────────────────────────────────
// The review's five inputs, each accepted by the old text denylist and each
// running script in Chromium, then one case per class the allowlist refuses.

const REVIEW_BYPASSES: Record<string, string> = {
  slash_handler: `<svg/onload="window.__x=1" viewBox="0 0 8 8"><path d="M0 0"/></svg>`,
  deletion_join: `<svg viewBox="0 0 8 8" o width="1"nload="window.__x=1"><path d="M0 0"/></svg>`,
  image_slash: `<svg viewBox="0 0 8 8"><image href="x:"/onerror="window.__x=1"/></svg>`,
  charref_js: `<svg viewBox="0 0 8 8"><a href="jav&#97;script:window.__x=1"><rect width="8" height="8"/></a></svg>`,
  breakout_img: `<svg viewBox="0 0 8 8"><img src="x:"/onerror="window.__x=1"></svg>`,
};

test("the review's five bypasses are refused", () => {
  for (const [name, raw] of Object.entries(REVIEW_BYPASSES)) {
    assert.equal(normalizeSocialSvg(raw), null, name);
    assert.ok(socialSvgProblem(raw), name);
  }
});

const OK = (inner: string, open = `<svg viewBox="0 0 8 8">`) => `${open}${inner}</svg>`;

test("an event handler is refused wherever an attribute can start", () => {
  for (const raw of [
    `<svg viewBox="0 0 8 8" onload="x()"><path d="M0 0"/></svg>`,
    `<svg viewBox="0 0 8 8"\tonload="x()"><path d="M0 0"/></svg>`,
    `<svg viewBox="0 0 8 8"\nONLOAD="x()"><path d="M0 0"/></svg>`,
    `<svg viewBox="0 0 8 8"\fonclick="x()"><path d="M0 0"/></svg>`,
    OK(`<path d="M0 0" onmouseover="x()"/>`),
    OK(`<animate attributeName="onclick" to="x()"/>`),
  ]) {
    assert.equal(socialSvgProblem(raw), SVG_PROBLEM.handler, raw);
  }
  // A `/` between attributes (which HTML takes as a separator) is not markup
  // this reads.
  assert.equal(socialSvgProblem(`<svg/onload="x()" viewBox="0 0 8 8"></svg>`), SVG_PROBLEM.markup);
});

test("a script, or a link that runs one, in any spelling", () => {
  for (const raw of [
    OK(`<script>x()</script>`),
    OK(`<rect fill="url(#a)" style="fill:java&#x73;cript:x()"/>`),
    OK(`<rect data-x="jav&#97script:x()"/>`),
    OK(`<rect data-x="java&Tab;script:x()"/>`),
    OK(`<rect data-x="java&#10;script:x()"/>`),
    OK(`<rect data-x="javascript&colon;x()"/>`),
    OK(`<rect data-x="VBScript:x()"/>`),
  ]) {
    assert.equal(socialSvgProblem(raw), SVG_PROBLEM.script, raw);
  }
});

test("a link to anything but a fragment of this icon", () => {
  for (const raw of [
    OK(`<use href="https://x.example/i.svg#a"/>`),
    OK(`<use xlink:href="data:image/svg+xml,&lt;svg/&gt;"/>`),
    OK(`<use href="&#35;a&quot;"/>`),
    OK(`<linearGradient id="g" href="//x.example/g"/>`),
    OK(`<rect fill="url(https://x.example/p.svg#a)"/>`),
    OK(`<rect style="fill:url(data:image/png;base64,AAAA)"/>`),
    OK(`<rect mask="url( '//x.example' )"/>`),
    OK(`<set attributeName="href" to="#a"/>`),
  ]) {
    assert.equal(socialSvgProblem(raw), SVG_PROBLEM.external, raw);
  }
  // A fragment, in each spelling a reference takes, is fine.
  for (const raw of [
    OK(`<defs><linearGradient id="g"/></defs><use href="#g"/><use xlink:href="#g"/>`),
    OK(`<rect fill="url(#g)" style="fill:url('#g')" mask="url(&quot;#g&quot;)"/>`),
  ]) {
    assert.equal(socialSvgProblem(raw), null, raw);
  }
});

test("elements an icon has no use for, named", () => {
  for (const [inner, name] of [
    [`<foreignObject><div/></foreignObject>`, "foreignObject"],
    [`<style>@import "x";</style>`, "style"],
    [`<a href="#a"><rect/></a>`, "a"],
    [`<image href="#a"/>`, "image"],
    [`<iframe/>`, "iframe"],
    [`<object/>`, "object"],
    [`<embed/>`, "embed"],
    [`<audio/>`, "audio"],
    [`<video/>`, "video"],
    [`<img/>`, "img"],
    [`<p>x</p>`, "p"],
    [`<sodipodi:namedview/>`, "sodipodi:namedview"],
  ] as const) {
    assert.equal(socialSvgProblem(OK(inner)), SVG_PROBLEM.element(name), inner);
  }
});

test("only a drawing program's leftovers say how to export: a style, metadata, its own namespace", () => {
  const HINT = /presentation attributes rather than a style block \(in Inkscape, save as Plain SVG\)$/;
  for (const inner of [
    `<style>path{fill:red}</style>`,
    `<metadata><x/></metadata>`,
    `<sodipodi:namedview/>`,
    `<rect inkscape:label="x"/>`,
    `<rect style="position:fixed"/>`,
  ]) {
    assert.match(socialSvgProblem(OK(inner)) ?? "", HINT, inner);
  }
  for (const inner of [
    `<a href="#a"><rect/></a>`,
    `<image href="#a"/>`,
    `<title><path/></title>`,
    `<foreignObject/>`,
    `<rect src="x"/>`,
    `<rect formaction="x"/>`,
  ]) {
    const problem = socialSvgProblem(OK(inner));
    assert.ok(problem, inner);
    assert.doesNotMatch(problem, /presentation attributes|Plain SVG/, inner);
  }
});

test("attributes an icon has no use for, named; a style with an escape or an import", () => {
  assert.equal(socialSvgProblem(OK(`<rect src="x"/>`)), SVG_PROBLEM.attribute("src"));
  assert.equal(socialSvgProblem(OK(`<rect formaction="x"/>`)), SVG_PROBLEM.attribute("formaction"));
  assert.equal(socialSvgProblem(OK(`<rect inkscape:label="x"/>`)), SVG_PROBLEM.attribute("inkscape:label"));
  assert.equal(socialSvgProblem(OK(`<rect style="fill:u\\72l(x)"/>`)), SVG_PROBLEM.style);
  assert.equal(socialSvgProblem(OK(`<rect style="@import 'x'"/>`)), SVG_PROBLEM.external);
});

test("markup that is not one well-formed <svg>: declarations, CDATA, instructions, strays", () => {
  for (const raw of [
    OK(`<![CDATA[x]]>`),
    OK(`<!ENTITY x "y">`),
    OK(`<?php x ?>`),
    OK(`<path d="M0 0">`), // never closed
    OK(`</g>`), // closed, never opened
    `<svg viewBox="0 0 8 8"></svg><svg viewBox="0 0 8 8"></svg>`,
    `<svg viewBox="0 0 8 8"></svg>text<svg></svg>`,
    OK(`<path d=M0/>`), // an unquoted value
    OK(`<path d="M0 0"/ >`),
  ]) {
    assert.equal(socialSvgProblem(raw), SVG_PROBLEM.markup, raw);
  }
});

test("comments are removed first; an XML declaration and a plain DOCTYPE at the start are too", () => {
  const out = normalized(
    `<?xml version="1.0" encoding="UTF-8"?>\n<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">\n` +
      `<!-- Generator: a drawing app --><svg viewBox="0 0 8 8"><!-- a --><path d="M0 0"/></svg>`,
  );
  assert.equal(out, `<svg aria-hidden="true" fill="currentColor" viewBox="0 0 8 8"><path d="M0 0"/></svg>`);
  // A comment cannot hide a handler: what is left after removal is checked.
  assert.equal(socialSvgProblem(`<svg viewBox="0 0 8 8" on<!-- -->load="x()"></svg>`), SVG_PROBLEM.handler);
  // A DOCTYPE with an internal subset is not removed, and is refused with
  // what to do about it.
  assert.equal(socialSvgProblem(`<!DOCTYPE svg [<!ENTITY x "y">]><svg viewBox="0 0 8 8"></svg>`), SVG_PROBLEM.doctype);
});

test("an id a rendered copy cannot prefix safely is refused", () => {
  for (const id of ["->", "-!>", "1a", "a b", "a&amp;b", ""]) {
    assert.equal(socialSvgProblem(OK(`<path id="${id}" d="M0 0"/>`)), SVG_PROBLEM.id, id);
  }
  assert.equal(socialSvgProblem(OK(`<path id="a.b:c-d_1" d="M0 0"/>`)), null);
});

// The shapes an operator's icons take keep passing: a gradient body with a
// solid part, a single path drawn white, a two-colour disc.
test("the shapes real icons take are accepted", () => {
  const gradient =
    `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><defs>` +
    `<linearGradient id="grad_1" x1="0" y1="0" x2="0" y2="1" gradientUnits="objectBoundingBox">` +
    `<stop offset="0" stop-color="#e0a030"/><stop offset="1" style="stop-color:#b04020"/></linearGradient></defs>` +
    `<path fill="url(#grad_1)" style="fill:url(#grad_1)" d="M12 2 20 20H4z"/><circle fill="#333" cx="12" cy="15" r="2"/></svg>`;
  const single = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2 2h20v20H2z" fill="white"/></svg>`;
  for (const raw of [gradient, single, SIZED_DISC]) {
    assert.equal(socialSvgProblem(raw), null, raw.slice(0, 60));
    const out = normalized(raw);
    assert.equal(socialSvgProblem(out), null);
  }
});

// ── THE RE-REVIEW (R1, R2, R5, R6, the style properties) ────────────────────

test("R1: a title or desc with text only is removed; with a child element it is refused", () => {
  assert.equal(
    normalized(OK(`<title>A name</title><desc/><path d="M0 0"/>`)),
    `<svg aria-hidden="true" fill="currentColor" viewBox="0 0 8 8"><path d="M0 0"/></svg>`,
  );
  for (const raw of [
    OK(`<title><path d="M0 0"/></title>`),
    OK(`<desc><g></g></desc>`),
    OK(`<title><svg viewBox="0 0 1 1"><title>t</title></svg></title>`),
  ]) {
    assert.equal(socialSvgProblem(raw), SVG_PROBLEM.element(raw.includes("<desc>") ? "desc" : "title"), raw);
  }
});

test("R2: the eight inputs that loaded from another origin are refused", () => {
  for (const name of LOADS_ELSEWHERE) {
    assert.equal(normalizeSocialSvg(ADVERSARIAL[name]), null, name);
  }
  for (const raw of [
    OK(`<rect fill="\\75 rl(#a)"/>`),
    OK(`<rect style="fill:url/**/(#a)"/>`),
    OK(`<rect mask="cross-fade(url(#a), url(#b))"/>`),
    OK(`<rect mask="-webkit-cross-fade(url(#a), url(#b))"/>`),
    OK(`<rect style="fill:element(#a)"/>`),
    OK(`<rect style="fill:-moz-element(#a)"/>`),
    OK(`<rect style="fill:image(#a)"/>`),
    OK(`<rect style="fill:src(#a)"/>`),
    OK(`<rect style="fill:paint(x)"/>`),
    OK(`<rect style="fill:expression(x)"/>`),
    OK(`<rect><set attributeName="fill" to="image-set('${"https://x.example"}/a.png' 1x)"/></rect>`),
  ]) {
    assert.ok(socialSvgProblem(raw), raw);
  }
});

test("a style holds presentation properties only", () => {
  for (const decl of ["position:fixed", "inset:0", "z-index:9", "top:0", "width:100vw", "background:red", "cursor:pointer", "transform:scale(9)"]) {
    assert.equal(socialSvgProblem(OK(`<rect style="${decl}"/>`)), SVG_PROBLEM.style, decl);
  }
  assert.equal(
    socialSvgProblem(OK(`<rect style="fill:#fff; stroke:#000;stroke-width:2;opacity:.5;paint-order:stroke;display:inline"/>`)),
    null,
  );
});

test("R5: an animation targets nothing named href and no handler, in any spelling", () => {
  for (const attr of ["x:href", " HREF ", "xlink:href", "href"]) {
    assert.equal(socialSvgProblem(OK(`<set attributeName="${attr}" to="#a"/>`)), SVG_PROBLEM.external, attr);
  }
  for (const attr of ["onclick", "xlink:onclick", "x:onload"]) {
    assert.equal(socialSvgProblem(OK(`<set attributeName="${attr}" to="1"/>`)), SVG_PROBLEM.handler, attr);
  }
});

test("R6: a reference the render cannot scope is refused: an encoded or padded fragment", () => {
  for (const raw of [
    OK(`<defs><g id="a"/></defs><use href="&#35;a"/>`),
    OK(`<defs><g id="a"/></defs><use href=" #a "/>`),
    OK(`<defs><g id="a"/></defs><rect fill="url(#&#97;)"/>`),
    OK(`<defs><g id="a"/></defs><rect fill="&#117;rl(#a)"/>`),
  ]) {
    assert.equal(socialSvgProblem(raw), SVG_PROBLEM.external, raw);
  }
  // …and each accepted spelling is one scopeSvgIds rewrites.
  const ok = normalized(OK(`<defs><g id="a"/></defs><use href="#a"/><rect fill="url(#a)" mask="url(&quot;#a&quot;)" style="fill:url('#a')"/>`));
  const scoped = scopeSvgIds(ok, "s");
  assert.ok(!/#a\b/.test(scoped.replace(/#s-a/g, "")), scoped);
});

test("the shapes real icons take pass, stay stable and survive the render", () => {
  for (const [name, raw] of Object.entries(REAL_SHAPES)) {
    const out = normalizeSocialSvg(raw);
    assert.ok(out, `${name}: ${socialSvgProblem(raw)}`);
    assert.equal(normalizeSocialSvg(out), out, `${name} idempotent`);
    assert.ok(normalizeSocialSvg(sizeSocialSvg(scopeSvgIds(out, "sl_S_1_-0"))), `${name} rendered`);
  }
  assert.ok(normalized(REAL_SHAPES.gradient_outlined).includes('viewBox="-3 -3 76.3 80.8"'));
});

// The review's whole battery: an input is refused, or its output is stable,
// survives the render's scoping and sizing, and — the structural half of R1's
// invariant — holds only SVG elements the HTML parser keeps in foreign content
// (no title, desc, foreignObject or HTML element can reach a page). The
// browser half (a real parser, #after outside the icon) is the homepage e2e's
// svg-vectors.spec.ts: the repo has no HTML parser to run it here.
const FOREIGN_SAFE = new Set([
  "svg", "g", "defs", "symbol", "use", "path", "rect", "circle", "ellipse", "line",
  "polyline", "polygon", "text", "tspan", "lineargradient", "radialgradient", "stop",
  "pattern", "clippath", "mask", "filter", "feblend", "fecolormatrix",
  "fecomponenttransfer", "fecomposite", "fedropshadow", "feflood", "fefunca", "fefuncb",
  "fefuncg", "fefuncr", "fegaussianblur", "femerge", "femergenode", "femorphology",
  "feoffset", "animate", "animatetransform", "set",
]);

test("every adversarial input is refused, or accepted in a form that stays inside its <svg>", () => {
  let accepted = 0;
  for (const [name, raw] of Object.entries(ADVERSARIAL)) {
    const out = normalizeSocialSvg(raw);
    if (out === null) {
      assert.ok(socialSvgProblem(raw), name);
      continue;
    }
    accepted += 1;
    assert.equal(normalizeSocialSvg(out), out, `${name} idempotent`);
    const rendered = sizeSocialSvg(scopeSvgIds(out, "sl_S_1_-0"));
    assert.ok(normalizeSocialSvg(rendered), `${name} rendered`);
    // Tag names outside attribute values (a quoted `<img>` is a value, and inert).
    const markup = rendered.replace(/"[^"]*"|'[^']*'/g, '""');
    for (const m of markup.matchAll(/<\/?([A-Za-z][\w:.-]*)/g)) {
      assert.ok(FOREIGN_SAFE.has(m[1].toLowerCase()), `${name}: <${m[1]}>`);
    }
    assert.ok(!/<!|<\?/.test(markup), `${name}: markup`);
  }
  assert.ok(accepted > 10, `${accepted} accepted`);
  for (const name of ["title_child_el", "desc_child_el", "title_title", "title_svg_title", "overlay_style", ...LOADS_ELSEWHERE]) {
    assert.equal(normalizeSocialSvg(ADVERSARIAL[name]), null, name);
  }
});