Accessible names not computed correctly when using SVG's <title> elements.

[Lukas-Kullmann]

This issue results from testing-library/dom-testing-library#1295

The problem is that the <title> element seems to be ignored on all SVG elements except the topmost <svg> element (so on things like <g>).

This means that these WPT fail: https://github.com/web-platform-tests/wpt/blob/master/svg-aam/name/comp_host_language_label.html

In short, a test like this fails:

<svg viewbox="0 0 300 100">
  <circle cx="26" cy="26" r="25" data-expectedlabel="circle label" data-testname="circle > title" class="ex"><title>circle label</title></circle>
  <rect x="60" y="1" width="50" height="50" data-expectedlabel="rect label" data-testname="rect > title" class="ex"><title>rect label</title></rect>
  <polygon points="100,100 150,25 150,75 200,0" fill="none" stroke="black" data-expectedlabel="polygon label" data-testname="polygon > title" class="ex"><title>polygon label</title></polygon>
</svg>

Note that it works if you explicitly define aria-labelledby:

<svg viewbox="0 0 300 100">
  <circle cx="26" cy="26" r="25" data-expectedlabel="circle label" data-testname="circle > title" class="ex" aria-labelledby="circle-id"><title id="circle-id">circle label</title></circle>
  <rect x="60" y="1" width="50" height="50" data-expectedlabel="rect label" data-testname="rect > title" class="ex" aria-labelledby="rect-id"><title id="rect-id">rect label</title></rect>
  <polygon points="100,100 150,25 150,75 200,0" fill="none" stroke="black" data-expectedlabel="polygon label" data-testname="polygon > title" class="ex" aria-labelledby="polygon-id"><title id="polygon-id">polygon label</title></polygon>
</svg>