如何在Firefox中使svg元素中的文本居中？

<text x="50%" y="50%" text-anchor="middle" dominant-baseline="middle">居中文本</text>

<text x="50%" y="50%" text-anchor="middle" dominant-baseline="middle">
  <tspan x="50%" dy="0">第一行文本</tspan>
  <tspan x="50%" dy="1.2em">第二行文本</tspan>
</text>

<svg id="mySvg" width="100%" height="100%">
  <text id="myText">居中文本</text>
</svg>
<script>
  var svg = document.getElementById("mySvg");
  var text = document.getElementById("myText");
  var svgWidth = svg.clientWidth;
  var svgHeight = svg.clientHeight;
  var textWidth = text.getBBox().width;
  var textHeight = text.getBBox().height;
  text.setAttribute("x", (svgWidth - textWidth) / 2);
  text.setAttribute("y", (svgHeight - textHeight) / 2);
</script>