Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[0.8] IE9 styles broken #1464

Closed
webdesserts opened this issue Apr 29, 2015 · 2 comments
Closed

[0.8] IE9 styles broken #1464

webdesserts opened this issue Apr 29, 2015 · 2 comments

Comments

@webdesserts
Copy link

Hello!

In IE9 Polymer 0.8 breaks with the following error when you attempt to include a style tag in your element:

SCRIPT5007: Unable to get value of the property 'removeChild': object is null or undefined

This specific error is referring to the _unapplyStyles function under the standard/styling.html feature. When debugging the function it shows parentNode returning null.

This can be reproduced by trying to include the following element into your page:

<dom-module id="my-element">
  <style></style> <!-- remove this line and everything works -->
  <template>Hello, World</template>
</dom-module>

<script>Polymer({ is: 'my-element' })</script>

I realize 0.8 is still in an alpha state and you're probably a bit more worried about the api than IE9 bugs right now, but the company I work for is very interested in using 0.8-1.0 as it stabilizes and IE9 is one of our target browsers. I thought I would start including errors as I run into them. On that note, will IE9 still be partially supported for the 1.0 release?

Thanks

@webdesserts
Copy link
Author

Dug into this a little more.

I included the following logs into the _unapplyStyles function:

      _unapplyStyles: function(styles) {
        for (var i=0, l=styles.length, s; (i<l) && (s = styles[i]); i++) {
          console.log('original', s)
          console.log('orignal parent', s.parentNode)
          console.log('applied', s.__appliedElement)
          console.log('applied parent', s.__appliedElement.parentNode)
          s = s.__appliedElement || s;
          console.log(s.parentNode)
          s.parentNode.removeChild(s);
        }
      },

I checked the result in both firefox and IE9 and I see these differences.

polymer-styles-error

It looks like the __appliedElement.parentNode returns the <head> element normally, but in IE9 it returns null. Not sure how the __appliedElement.parentNode is returning <head> in the first place as the <style> tag doesn't seem to be attached to the document? Not sure.

@sorvell
Copy link
Contributor

sorvell commented May 21, 2015

Polymer relies on the WebComponents polyfills and supports the same browsers and versions that these polyfills do. The oldest supported version of IE is IE10.

@sorvell sorvell closed this as completed May 21, 2015
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants