All geek questions in one place

Are web components available in IE11 and Edge?

Web components are a hot new thing and a true web standard, everyone talks about them and seems to use them, and they seemed like the perfect solution to the problem we have (sharing components on a wide variety of sites).

So, we are creating a couple of web components. Work is great in Chrome, but not in IE11. Perhaps Polina? https://www.webcomponents.org/polyfills has a ton of polyfills, but IE11 continues to complain about the class .

Perhaps compile to ES5? Various sources claim that web components require ES6 because you are not getting the same inheritance from HTMLElement in IE11. There is custom-elements-es5-adapter.js, but for some reason this does not work. If I compile, the web components do not work. If I do not, IE11 will fail with a class error.

And yet everyone uses web components. How do you do it? You do not support IE11 / Edge at all? Am I doing something wrong?

+5
source share
1 answer

If all you want is Custom Elements, you can get them to work with IE11 and Edge. Shadow DOM and HTML Imports can work with IE11 and Edge, but I personally do not like to use Shadow DOM, except for browsers that support it natively.

Firefox and Edge will only work with regular polyfill.

IE11 needs to be converted to ES5 and then use polyfill and custom-elements-es5-adapter.js

Some people use webcomponents-lite.js , which will automatically download the necessary polyfill files. Others download a specific polyfill, for example webcomponents-hi-ce.js (HTML import and user elements) or webcomponents-sd-ce.js (Shady DOM and user elements)

https://github.com/WebComponents/webcomponentsjs

+1
source

Source: https://habr.com/ru/post/1274215/

More articles:


All Articles