Injecting global styles to shadow: true Custom Elements

[wbern]

Hello! Me and my org were recently very impressed with your hard work to support slots and property reflection.

A common developer issue when you start having Custom Elements with Shadow DOM enabled, is to somehow inject styles into the element. Sometimes you don't have the luxury of being able to inject the needed stylings directly into the Custom Element's Shadow DOM.

After my org forked the @vue/web-component-wrapper to add support for IE 11, we added functionality for injecting global styles using a mutation observer in our fork, named @telia/vue-web-component-wrapper-ie11. Link to relevant code from the fork can be found somewhere around here.

This approach seems to have surprisingly good performance (partly because browsers seem to cache style-elements that have identical contents), and since we'll definitely need this in our experiment to turn React components into Web Components, we figured this functionality would fit well within your wrapper.

Please let us know what you think!