The SVG spec states that I should be able to "truncate" overflowing text using an ellipsis, and gives a nice example (with an image of it working). See here:-

https://www.w3.org/TR/SVG2/text.html#TextOverflowProperty

<svg xmlns="http://www.w3.org/2000/svg"
     width="300" height="150" viewBox="0 0 300 150">
  <style>
    text { font: 25px sans-serif; white-space: pre; }
    path { fill: none; stroke: #add8e6; }
  </style>

  <path d="m  50,0 0,150"/>
  <path d="m 200,0 0,150"/>

  <text x="50" y="35"  inline-size="100" style="overflow:visible">SVG is awesome</text>
  <text x="50" y="85"  inline-size="100" style="text-overflow:clip">SVG is awesome</text>
  <text x="50" y="135" inline-size="100" style="text-overflow:ellipsis">SVG is awesome</text>
</svg>

But if I actually try their own SVG, then no such truncation occurs !!

Is this a known bug?

I know similar questions have been posted but they are 5+ years old so are (possibly) out-of-date.

解决方案

Multiline text with auto-wrapping, being prerequisite for ellipsis, as well as basically all white-space and even overflow CSS properties of text nodes are all newcomers to SVG coming along with the "new" SVG2, if we can use that word for a spec that originates from 2012.

As of 2026, there is (still) little to no progress in SVG2 adoption among major browsers in this particular area (*).

Even humbly looking white-space alone has diverging outcomes between browsers as of now:

<svg style="background: mark">
  <text y="20" style="white-space: pre-line">
   Foo
   Bar&#x0A;Baz
  </text>
</svg>

This will show you three lines in Firefox, but single line in Chrome.

As C3roe mentioned, the specification pages are "faking" the illustrations of the code snippets outcomes, for a pretty clear reason: simply to deliver the intended outcome to readers that are using browsers with currently supported subset of SVG. Using the "baseline" SVG seems like pragmatic choice, considering that the only alternative could be embedding raster pictures. It might seem misleading, but really makes sense: they do not document the present they try to describe the future.

(*) See https://wpt.fyi/results/svg/text/reftests It might be a bit better among SVG authoring software, for example Inkscape can at least auto-wrap text during authoring, but outputs positioned tspans in the resulting document, probably for pragmatic compatibility reasons.