Hyperapp: IE 9: cannot set the SVG requiredFeatures attribute to an empty string or remove the requiredFeatures attribute

[infinnie]

Changing

<g requiredFeatures="some"/>

to

<g/>

Would not work in Hyperapp. We should fall back to an existing feature that is supported by all SVG-compatible browsers to cope with the problem.

[jorgebucaran]

@infinnie Could you try harder to explain _what_ the problem is?

What about IE10 or IE11?

[infinnie]

Yes. The problem is demonstrated in this piece of JavaScript code:

var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
svg.setAttribute("requiredFeatures", "NotExistingFeature");
svg.getAttribute("requiredFeatures"); // "NotExistingFeature"
svg.setAttribute("requiredFeatures", "");
svg.getAttribute("requiredFeatures"); // "NotExistingFeature" in IE 9
// Update: needs testing
svg.removeAttribute("requiredFeatures");
svg.getAttribute("requiredFeatures"); // ???
svg.setAttribute("requiredFeatures", " "); // A space
svg.getAttribute("requiredFeatures"); // ""

// What works for class should work here, but not in IE 9
svg.setAttribute("class", "NotExistingFeature");
svg.getAttribute("class"); // "NotExistingFeature"
svg.setAttribute("class", "");
svg.getAttribute("class"); // ""

I haven’t tested IE 10/11 or other browsers yet but I will, ASAP.

[jorgebucaran]

@infinnie Sorry, were you able to test IE10/11?

[infinnie]

I wasn’t able to test them back then, but I’ve just tested the code on IE11. Although removeAttribute() is supported for requiredFeatures on that browser, setAttribute("requiredFeatures", "") would not work.

[infinnie]

But all in all, an empty string for requiredFeatures would make an SVG element fail to get rendered.

[infinnie]

If the attribute is not present, then its implicit evaluated value is true. If a null string or empty string value is given to attribute requiredFeatures, the attribute is evaluate to false.

—https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/requiredFeatures

[infinnie]

So in all, though it affects IE 11, it doesn’t break our app logic. IE 9 needs further testing, however.

[jorgebucaran]

@infinnie What about IE10?

[infinnie]

I don’t know but IE 11 seems to behave differently in IE9 Standards mode from IE 9 itself. Further testing is needed.

[jorgebucaran]

@infinnie Hmm, what about using oncreate or onupdate on an element and use it to set or remove the requiredFeatures attribute?

Adding a special condition to the code that updates attributes just for IE9's requiredFeatures lack of support is definitely outside the scope of Hyperapp.

[jorgebucaran]

Going to close here as wontfix.