Skip to content

Keep imported inline SVG editor-valid with explicit sizing; convert SVG-in-link to core/button#492

Merged
chubes4 merged 2 commits into
trunkfrom
fix/inline-svg-native-block
Jul 4, 2026
Merged

Keep imported inline SVG editor-valid with explicit sizing; convert SVG-in-link to core/button#492
chubes4 merged 2 commits into
trunkfrom
fix/inline-svg-native-block

Conversation

@chubes4

@chubes4 chubes4 commented Jul 4, 2026

Copy link
Copy Markdown
Contributor

Problem

Imported inline <svg> elements fell back to core/html with no explicit sizing. When the source page sized them via stylesheet rules that are not applied to the imported candidate, they rendered at intrinsic/oversized dimensions — the dominant contributor to visual-parity mismatch on SSI fixture-matrix fixtures (up to 96% pixel mismatch on SVG-heavy pages).

Why not core/icon

An intermediate attempt routed inline SVG to core/icon. The package test suite passed — but the real editor invalidated 4/7 matrix fixtures: core/icon is a dynamic block whose registered contract carries a registered icon name (WP_Icons_Registry), not arbitrary SVG markup (verified against wordpress-develop: wp-includes/blocks/icon/block.json, icon.php, class-wp-icons-registry.php). Package-level validation cannot catch this class of error because CanonicalSaveShapeValidator intentionally skips dynamic blocks — only live editor validation surfaces it. That dead end is documented here so it isn't retried.

Fix

  • Inline drawable SVG stays sanitized core/html, and viewBox-only SVGs get explicit width/height derived from the viewBox so rendering no longer depends on unapplied stylesheet rules.
  • SVG inside button-like links is stripped from the label and converted to native core/button.
  • External-sprite-only SVGs (<use href="…#id"> with no inlinable drawable content) remain a diagnostic fallback — the referenced symbol is outside the imported markup and would render broken.
  • Parity fixtures added for decorative icon, sized hero graphic, and SVG-in-link shapes.

Verification

  • Full suite green: composer test (canonical + 203 parity fixtures + packaging).
  • SSI fixture matrix (complexity-1 lane, real WP sandbox): 7/7 pass, 0 editor-invalid blocks, aggregate native rate/block counts unchanged (the change lives inside fallback payloads by design). Pixel-level visual impact is deliberately not claimed here: the visual-parity channel currently swings too widely across runs to attribute (theme-stylesheet application on candidates is a known open issue tracked separately).

AI assistance

  • AI assistance: Yes
  • Tool(s): Claude Opus 4.5 (claude-fable-5) via opencode, orchestrated agent workflow
  • Used for: Root-cause investigation, the core/icon contract verification against WordPress core source, implementation, and fixture-matrix verification. Reviewed and verified by Chris Huber via the SSI fixture matrix quality gates.

@chubes4 chubes4 merged commit 8c7c496 into trunk Jul 4, 2026
1 check passed
@chubes4 chubes4 deleted the fix/inline-svg-native-block branch July 4, 2026 17:09
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant