Polyfill-service: classList polyfill doesn't apply to SVGElement in IE11

Created on 12 Oct 2017  路  5Comments  路  Source: Financial-Times/polyfill-service

This applies to scenario when SVG is embedded directly into HTML and you want to use classList.add on one of its nodes.

Most helpful comment

I believe I am still experiencing this issue. If I use any of the following URIs, then the classList polyfill is not downloaded for IE11, and I get errors when trying to work with classList on SVG elements.

  • https://cdn.polyfill.io/v2/polyfill.js?features=default&flags=gated
  • https://cdn.polyfill.io/v2/polyfill.js?features=default,Element.prototype.classList&flags=gated

The following URI _does_ download the polyfill, and has been my only workaround thus far.

  • https://cdn.polyfill.io/v2/polyfill.js?features=default,Element.prototype.classList|always&flags=gated

All 5 comments

This will be fixed by #1347

Just in case I missed something in this PR (I'm not 100% sure SVGElement inherits from Element), one issue I ran through when trying to polyfill this myself is that SVGElement.className is not a String like on regular Element its an Object, so I had to revert to reading classes from attribute instead. I guess what I'm saying is make sure you test it with real SVG nodes :)

@stsvilik Thanks, we are aware of the difference between DOMTokenList support for Element and SVGElement, I haven't added SVGElement support yet, it will be added later before the PR is merged.

This will be fixed via #1347 as it has SVG support now

I believe I am still experiencing this issue. If I use any of the following URIs, then the classList polyfill is not downloaded for IE11, and I get errors when trying to work with classList on SVG elements.

  • https://cdn.polyfill.io/v2/polyfill.js?features=default&flags=gated
  • https://cdn.polyfill.io/v2/polyfill.js?features=default,Element.prototype.classList&flags=gated

The following URI _does_ download the polyfill, and has been my only workaround thus far.

  • https://cdn.polyfill.io/v2/polyfill.js?features=default,Element.prototype.classList|always&flags=gated
Was this page helpful?
0 / 5 - 0 ratings