javascript - Why is wecomponentsjs/custom-elements-es5-adapter.js not working -


i converting polymer app polymer 2. i'm changing components es6 class syntax (yes know leave them in v1.7 hybrid style them es6 classes).

however when transpile code es5 (with babeljs) run known issue regarding es5 'classes' extending native elements (https://github.com/babel/babel/issues/4480).

i tried babel-plugin-transform-custom-element-classes didn't work. so tried webcomponents shim meant fix issue: https://github.com/webcomponents/webcomponentsjs#custom-elements-es5-adapterjs

but shim doesn't work! don't know i'm doing wrong :(

<script src="webcomponentsjs/custom-elements-es5-adapter.js"></script> <script src="webcomponentsjs/webcomponents-lite.js"></script> ... <y-example></y-example> ... <script>   /* transpiled es5 */   class yexample extends htmlelement {}   customelements.define('y-example', yexample); </script> 

here jsbin: http://jsbin.com/feqoniz/edit?html,js,output

notice i'm including custom-elements-es5-adapter.js, notice js panel using es6/babel.

if remove custom-elements-es5-adapter.js , change js panel normal javascript (not es6/babel) works fine.

you can include or remove adapter (leaving es6/babel) , error same thing, except when adapter included comes adapter code instead: failed construct 'htmlelement': please use 'new' operator, dom object constructor cannot called function.

i must doing silly? ideas?

well, doing silly.. should have tried upgrading babel package.

upgraded babeljs 6.23.1 latest 6.24.1 , fixed problem. :p


Comments

Popular posts from this blog

How to understand 2 main() functions after using uftrace to profile the C++ program? -

c# - Update a combobox from a presenter (MVP) -

How to put a lock and transaction on table using spring 4 or above using jdbcTemplate and annotations like @Transactional? -