title: Measure not yet created SVG text in javascript
body: <p>I'm trying to create a function that will measure how big a text element will be in a SVG element. The code examples I found at Stack Overflow does not work and gives a width of zero. If I delay the measurement I can get the text, but not right away. How is this solved?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var messureSVGtext = function(text, svg, options){
     var text = document.createElementNS(svgns, 'text');
     text.style.fontFamily = options.font;
  
     text.setAttribute("style",
          "font-family:" + options.font + ";" +
          "font-size:" + options.fontSize + "px;"
     );
  
     var textNode = document.createTextNode(text);
  
     text.appendChild(textNode);
  
     svg.appendChild(text);
  
     // This does not work
     console.log(text.clientWidth);
        
     //This does
     setTimeout(function(){
        console.log(text.clientWidth);
     }, 100);
  }</code></pre>
  </div>
  </div>
  </p>