v135 · miscellaneous

Support rel / relList attributes for SVGAElement

The SVGAElement interface in SVG 2.0 allows manipulation of <a> elements similar to HTML anchor elements. Supporting the rel and relList attributes enhances security and privacy for developers. This alignment with HTML anchor elements ensures consistency and ease of use across web technologies.

concepts

  1. SVG <a> rel

    Probe an SVG anchor for the new rel property surface.

  2. SVG anchors finally match HTML anchors

    Side-by-side HTML and SVG anchors with live relList.add() / relList.remove() — the operations used to throw on the SVG side.

  3. SVG anchor rel playground

    Toggle any of six rel tokens (noopener, noreferrer, nofollow, prefetch, preload, external) on an inline SVG <a> and watch relList + generated markup update.

  4. SVG security audit

    Paste SVG markup with <a> elements. The auditor uses SVGAElement.relList (Chrome 135) to find external links missing noopener/noreferrer, shows tabnapping risk per link, and offers a one-click fix to patch all unsafe SVG anchors.

why it shipped

SVG 2.0 specifies the rel and relList attributes in the SVGAElement interface. Similar to its HTML counterpart, the rel attribute (with values like "noreferrer" and "noopener") is useful for enhancing both privacy and security.

references