How to save spaces in svg text

Question

To save spaces in textelement svg, use 'xml: space = "save" as a text attribute (jsfiddle) . However, it does not work. What am I doing wrong?

    // init snap
    var svgElement=document.getElementById("mainSvgId");
    var s = Snap(svgElement).attr({height: 300, width: 300});

    // greate group with rectanle
    var parentGroup=s.g().attr({id: "parent"});
    var rect1 = s.rect(0, 0, 200, 200).attr({fill: "#bada55"});
    parentGroup.add(rect1);

    // add text with preserve attribute
    var text = s.text(0, 20, "   text1    text2");
    text.node.setAttribute("xml:space", "preserve");
    parentGroup.add(text);

Answer 1

You are almost there. You need to correctly create an attribute in the xml namespace for which you need setAttributeNS, not setAttribute

text.node.setAttributeNS("http://www.w3.org/XML/1998/namespace", "xml:space", "preserve");