Translate-ShadowDOM

Translates your HTML and CSS both ways between Shadow DOM V0 and V1.
Works for strings and document fragments, as a module or online editor.

View full docs and more on GitHub

The migration between Shadow DOM V0 and V1 may be a painful task, especialy in large projects.

So, I wrote Translate-ShadowDOM to automate many of the steps involved in upgrading. Translate-ShadowDOM works for string as well as full DOM DocumentFragment. That's why, you can use it as a tool to migrate you code base, as well as call it in runtime, to addapt to unknown environment.

For example, you can use it to prepare you web components in V1 syntax and still make them work with old V0 Polyfills. Or otherwise, you can use it in V1 environment to support some legacy code. You will be able to make your vanilla JS custom elements "hybrid" like Polymer ones.

Install it with npm install --save Translate-ShadowDOM or bower install --save Translate-ShadowDOM

Then use the API, for example: TranslateShadowDOM.v0tov1.fragment(myTemplate.content);

Check out the README on github for a complete list of current and planned transformations, or check out the online migration demo bellow.