Tools: --js-compile doesn't compile arrow functions (causing errors on IE11)

[davidmaxwaterman]

This is a follow-up to https://github.com/Polymer/polymer-cli/issues/622 which didn't get any resolution but was closed, so I'd like to find out why this isn't working for polymer build out-of-the-box.

(cut&paste from 622)
I'm seeing something like this too. As you can see from the steps below, it is easy to reproduce from the shop app, just by changing a function to an arrow function.

Any clues what I might be doing wrong? I had thought this was working ok, so I'm wondering what I might have changed to break this.

maxw@~$ mkdir tmp && cd tmp

maxw@tmp$ polymer init shop

info:    Running template polymer-init-shop:app...
info:    Finding latest ^1.0.0 release of Polymer/shop
info:    Downloading v1.1.2 of Polymer/shop
info:    Unpacking template files
info:    Finished writing template files


I'm all done. Running bower install for you to install the required dependencies. If this fails, try running the command yourself.


bower app-storage#^0.9.6        cached https://github.com/polymerelements/app-storage.git#0.9.8
bower app-storage#^0.9.6      validate 0.9.8 against https://github.com/polymerelements/app-storage.git#^0.9.6
bower app-layout#^0.10.0        cached https://github.com/polymerelements/app-layout.git#0.10.7
bower app-layout#^0.10.0      validate 0.10.7 against https://github.com/polymerelements/app-layout.git#^0.10.0
bower iron-flex-layout#^1.0.0   cached https://github.com/polymerelements/iron-flex-layout.git#1.3.7
bower iron-flex-layout#^1.0.0 validate 1.3.7 against https://github.com/polymerelements/iron-flex-layout.git#^1.0.0
bower app-route#^0.9.1          cached https://github.com/polymerelements/app-route.git#0.9.3
bower app-route#^0.9.1        validate 0.9.3 against https://github.com/polymerelements/app-route.git#^0.9.1
bower iron-media-query#^1.0.0   cached https://github.com/polymerelements/iron-media-query.git#1.0.8
bower iron-media-query#^1.0.0 validate 1.0.8 against https://github.com/polymerelements/iron-media-query.git#^1.0.0
bower iron-icon#^1.0.0          cached https://github.com/polymerelements/iron-icon.git#1.0.13
bower iron-icon#^1.0.0        validate 1.0.13 against https://github.com/polymerelements/iron-icon.git#^1.0.0
bower iron-overlay-behavior#^1.0.0           cached https://github.com/polymerelements/iron-overlay-behavior.git#1.10.4
bower iron-overlay-behavior#^1.0.0         validate 1.10.4 against https://github.com/polymerelements/iron-overlay-behavior.git#^1.0.0
bower iron-pages#^1.0.0                      cached https://github.com/polymerelements/iron-pages.git#1.0.9
bower iron-pages#^1.0.0                    validate 1.0.9 against https://github.com/polymerelements/iron-pages.git#^1.0.0
bower polymer#^1.4.0                         cached https://github.com/polymer/polymer.git#1.9.1
bower polymer#^1.4.0                       validate 1.9.1 against https://github.com/polymer/polymer.git#^1.4.0
bower iron-form#^1.0.0                       cached https://github.com/polymerelements/iron-form.git#1.1.5
bower iron-form#^1.0.0                     validate 1.1.5 against https://github.com/polymerelements/iron-form.git#^1.0.0
bower iron-iconset-svg#^1.0.0                cached https://github.com/polymerelements/iron-iconset-svg.git#1.1.1
bower iron-iconset-svg#^1.0.0              validate 1.1.1 against https://github.com/polymerelements/iron-iconset-svg.git#^1.0.0
bower paper-icon-button#^1.0.0               cached https://github.com/polymerelements/paper-icon-button.git#1.1.6
bower paper-icon-button#^1.0.0             validate 1.1.6 against https://github.com/polymerelements/paper-icon-button.git#^1.0.0
bower iron-selector#^1.0.0                   cached https://github.com/polymerelements/iron-selector.git#1.5.3
bower iron-selector#^1.0.0                 validate 1.5.3 against https://github.com/polymerelements/iron-selector.git#^1.0.0
bower paper-spinner#^1.0.0                   cached https://github.com/polymerelements/paper-spinner.git#1.2.1
bower paper-spinner#^1.0.0                 validate 1.2.1 against https://github.com/polymerelements/paper-spinner.git#^1.0.0
bower web-component-tester#^4.0.0            cached https://github.com/Polymer/web-component-tester.git#4.3.6
bower web-component-tester#^4.0.0          validate 4.3.6 against https://github.com/Polymer/web-component-tester.git#^4.0.0
bower promise-polyfill#^1.0.0                cached https://github.com/polymerlabs/promise-polyfill.git#1.0.1
bower promise-polyfill#^1.0.0              validate 1.0.1 against https://github.com/polymerlabs/promise-polyfill.git#^1.0.0
bower iron-scroll-target-behavior#^1.0.0     cached https://github.com/PolymerElements/iron-scroll-target-behavior.git#1.1.1
bower iron-scroll-target-behavior#^1.0.0   validate 1.1.1 against https://github.com/PolymerElements/iron-scroll-target-behavior.git#^1.0.0
bower iron-location#^0.8.1                   cached https://github.com/polymerelements/iron-location.git#0.8.11
bower iron-location#^0.8.1                 validate 0.8.11 against https://github.com/polymerelements/iron-location.git#^0.8.1
bower iron-resizable-behavior#^1.0.0         cached https://github.com/PolymerElements/iron-resizable-behavior.git#1.0.6
bower iron-resizable-behavior#^1.0.0       validate 1.0.6 against https://github.com/PolymerElements/iron-resizable-behavior.git#^1.0.0
bower iron-meta#^1.0.0                       cached https://github.com/polymerelements/iron-meta.git#1.1.3
bower iron-meta#^1.0.0                     validate 1.1.3 against https://github.com/polymerelements/iron-meta.git#^1.0.0
bower iron-fit-behavior#^1.0.0               cached https://github.com/PolymerElements/iron-fit-behavior.git#1.2.6
bower iron-fit-behavior#^1.0.0             validate 1.2.6 against https://github.com/PolymerElements/iron-fit-behavior.git#^1.0.0
bower iron-a11y-keys-behavior#^1.0.0         cached https://github.com/PolymerElements/iron-a11y-keys-behavior.git#1.1.9
bower iron-a11y-keys-behavior#^1.0.0       validate 1.1.9 against https://github.com/PolymerElements/iron-a11y-keys-behavior.git#^1.0.0
bower iron-ajax#^1.0.0                       cached https://github.com/PolymerElements/iron-ajax.git#1.4.4
bower iron-ajax#^1.0.0                     validate 1.4.4 against https://github.com/PolymerElements/iron-ajax.git#^1.0.0
bower webcomponentsjs#^0.7.24                cached https://github.com/Polymer/webcomponentsjs.git#0.7.24
bower webcomponentsjs#^0.7.24              validate 0.7.24 against https://github.com/Polymer/webcomponentsjs.git#^0.7.24
bower paper-styles#^1.0.0                    cached https://github.com/PolymerElements/paper-styles.git#1.3.1
bower paper-styles#^1.0.0                  validate 1.3.1 against https://github.com/PolymerElements/paper-styles.git#^1.0.0
bower paper-behaviors#^1.0.0                 cached https://github.com/PolymerElements/paper-behaviors.git#1.0.13
bower paper-behaviors#^1.0.0               validate 1.0.13 against https://github.com/PolymerElements/paper-behaviors.git#^1.0.0
bower test-fixture#^1.0.0                    cached https://github.com/polymerelements/test-fixture.git#1.1.2
bower test-fixture#^1.0.0                  validate 1.1.2 against https://github.com/polymerelements/test-fixture.git#^1.0.0
bower accessibility-developer-tools#^2.10.0  cached https://github.com/GoogleChrome/accessibility-developer-tools.git#2.12.0
bower accessibility-developer-tools#^2.10.0         validate 2.12.0 against https://github.com/GoogleChrome/accessibility-developer-tools.git#^2.10.0
bower async#^1.5.0                                    cached https://github.com/caolan/async.git#1.5.2
bower async#^1.5.0                                  validate 1.5.2 against https://github.com/caolan/async.git#^1.5.0
bower chai#^3.2.0                                     cached https://github.com/chaijs/chai.git#3.5.0
bower chai#^3.2.0                                   validate 3.5.0 against https://github.com/chaijs/chai.git#^3.2.0
bower mocha#^2.3.0                                    cached https://github.com/mochajs/mocha.git#2.5.3
bower mocha#^2.3.0                                  validate 2.5.3 against https://github.com/mochajs/mocha.git#^2.3.0
bower lodash#^3.7.0                                   cached https://github.com/lodash/lodash.git#3.10.1
bower lodash#^3.7.0                                 validate 3.10.1 against https://github.com/lodash/lodash.git#^3.7.0
bower sinon-chai#^2.7.0                               cached https://github.com/domenic/sinon-chai.git#2.10.0
bower sinon-chai#^2.7.0                             validate 2.10.0 against https://github.com/domenic/sinon-chai.git#^2.7.0
bower sinonjs#^1.14.1                                 cached https://github.com/blittle/sinon.js.git#1.17.1
bower sinonjs#^1.14.1                               validate 1.17.1 against https://github.com/blittle/sinon.js.git#^1.14.1
bower stacky#^1.3.0                                   cached https://github.com/PolymerLabs/stacky.git#1.3.2
bower stacky#^1.3.0                                 validate 1.3.2 against https://github.com/PolymerLabs/stacky.git#^1.3.0
bower font-roboto#^1.0.1                              cached https://github.com/PolymerElements/font-roboto.git#1.0.2
bower font-roboto#^1.0.1                            validate 1.0.2 against https://github.com/PolymerElements/font-roboto.git#^1.0.1
bower paper-ripple#^1.0.0                             cached https://github.com/PolymerElements/paper-ripple.git#1.0.10
bower paper-ripple#^1.0.0                           validate 1.0.10 against https://github.com/PolymerElements/paper-ripple.git#^1.0.0
bower iron-behaviors#^1.0.0                           cached https://github.com/PolymerElements/iron-behaviors.git#1.0.18
bower iron-behaviors#^1.0.0                         validate 1.0.18 against https://github.com/PolymerElements/iron-behaviors.git#^1.0.0
bower iron-checked-element-behavior#^1.0.0            cached https://github.com/PolymerElements/iron-checked-element-behavior.git#1.0.6
bower iron-checked-element-behavior#^1.0.0          validate 1.0.6 against https://github.com/PolymerElements/iron-checked-element-behavior.git#^1.0.0
bower iron-form-element-behavior#^1.0.0               cached https://github.com/PolymerElements/iron-form-element-behavior.git#1.0.7
bower iron-form-element-behavior#^1.0.0             validate 1.0.7 against https://github.com/PolymerElements/iron-form-element-behavior.git#^1.0.0
bower iron-validatable-behavior#^1.0.0                cached https://github.com/PolymerElements/iron-validatable-behavior.git#1.1.2
bower iron-validatable-behavior#^1.0.0              validate 1.1.2 against https://github.com/PolymerElements/iron-validatable-behavior.git#^1.0.0
bower app-storage#^0.9.6                             install app-storage#0.9.8
bower iron-media-query#^1.0.0                        install iron-media-query#1.0.8
bower app-layout#^0.10.0                             install app-layout#0.10.7
bower iron-flex-layout#^1.0.0                        install iron-flex-layout#1.3.7
bower app-route#^0.9.1                               install app-route#0.9.3
bower iron-pages#^1.0.0                              install iron-pages#1.0.9
bower iron-icon#^1.0.0                               install iron-icon#1.0.13
bower iron-overlay-behavior#^1.0.0                   install iron-overlay-behavior#1.10.4
bower iron-form#^1.0.0                               install iron-form#1.1.5
bower polymer#^1.4.0                                 install polymer#1.9.1
bower iron-iconset-svg#^1.0.0                        install iron-iconset-svg#1.1.1
bower paper-icon-button#^1.0.0                       install paper-icon-button#1.1.6
bower iron-selector#^1.0.0                           install iron-selector#1.5.3
bower paper-spinner#^1.0.0                           install paper-spinner#1.2.1
bower web-component-tester#^4.0.0                    install web-component-tester#4.3.6
bower promise-polyfill#^1.0.0                        install promise-polyfill#1.0.1
bower iron-scroll-target-behavior#^1.0.0             install iron-scroll-target-behavior#1.1.1
bower iron-location#^0.8.1                           install iron-location#0.8.11
bower iron-resizable-behavior#^1.0.0                 install iron-resizable-behavior#1.0.6
bower iron-meta#^1.0.0                               install iron-meta#1.1.3
bower iron-fit-behavior#^1.0.0                       install iron-fit-behavior#1.2.6
bower iron-a11y-keys-behavior#^1.0.0                 install iron-a11y-keys-behavior#1.1.9
bower iron-ajax#^1.0.0                               install iron-ajax#1.4.4
bower webcomponentsjs#^0.7.24                        install webcomponentsjs#0.7.24
bower paper-styles#^1.0.0                            install paper-styles#1.3.1
bower paper-behaviors#^1.0.0                         install paper-behaviors#1.0.13
bower test-fixture#^1.0.0                            install test-fixture#1.1.2
bower accessibility-developer-tools#^2.10.0          install accessibility-developer-tools#2.12.0
bower async#^1.5.0                                   install async#1.5.2
bower chai#^3.2.0                                    install chai#3.5.0
bower mocha#^2.3.0                                   install mocha#2.5.3
bower sinon-chai#^2.7.0                              install sinon-chai#2.10.0
bower lodash#^3.7.0                                  install lodash#3.10.1
bower sinonjs#^1.14.1                                install sinonjs#1.17.1
bower stacky#^1.3.0                                  install stacky#1.3.2
bower font-roboto#^1.0.1                             install font-roboto#1.0.2
bower iron-checked-element-behavior#^1.0.0           install iron-checked-element-behavior#1.0.6
bower paper-ripple#^1.0.0                            install paper-ripple#1.0.10
bower iron-behaviors#^1.0.0                          install iron-behaviors#1.0.18
bower iron-form-element-behavior#^1.0.0              install iron-form-element-behavior#1.0.7
bower iron-validatable-behavior#^1.0.0               install iron-validatable-behavior#1.1.2

app-storage#0.9.8 bower_components/app-storage
├── polymer#1.9.1
└── promise-polyfill#1.0.1

iron-media-query#1.0.8 bower_components/iron-media-query
└── polymer#1.9.1

app-layout#0.10.7 bower_components/app-layout
├── iron-flex-layout#1.3.7
├── iron-media-query#1.0.8
├── iron-resizable-behavior#1.0.6
├── iron-scroll-target-behavior#1.1.1
└── polymer#1.9.1

iron-flex-layout#1.3.7 bower_components/iron-flex-layout
└── polymer#1.9.1

app-route#0.9.3 bower_components/app-route
├── iron-location#0.8.11
└── polymer#1.9.1

iron-pages#1.0.9 bower_components/iron-pages
├── iron-resizable-behavior#1.0.6
├── iron-selector#1.5.3
└── polymer#1.9.1

iron-icon#1.0.13 bower_components/iron-icon
├── iron-flex-layout#1.3.7
├── iron-meta#1.1.3
└── polymer#1.9.1

iron-overlay-behavior#1.10.4 bower_components/iron-overlay-behavior
├── iron-a11y-keys-behavior#1.1.9
├── iron-fit-behavior#1.2.6
├── iron-resizable-behavior#1.0.6
└── polymer#1.9.1

iron-form#1.1.5 bower_components/iron-form
├── iron-ajax#1.4.4
└── polymer#1.9.1

polymer#1.9.1 bower_components/polymer
└── webcomponentsjs#0.7.24

iron-iconset-svg#1.1.1 bower_components/iron-iconset-svg
├── iron-meta#1.1.3
└── polymer#1.9.1

paper-icon-button#1.1.6 bower_components/paper-icon-button
├── iron-icon#1.0.13
├── paper-behaviors#1.0.13
├── paper-styles#1.3.1
└── polymer#1.9.1

iron-selector#1.5.3 bower_components/iron-selector
└── polymer#1.9.1

paper-spinner#1.2.1 bower_components/paper-spinner
├── iron-flex-layout#1.3.7
├── paper-styles#1.3.1
└── polymer#1.9.1

web-component-tester#4.3.6 bower_components/web-component-tester
├── accessibility-developer-tools#2.12.0
├── async#1.5.2
├── chai#3.5.0
├── lodash#3.10.1
├── mocha#2.5.3
├── sinon-chai#2.10.0
├── sinonjs#1.17.1
├── stacky#1.3.2
└── test-fixture#1.1.2

promise-polyfill#1.0.1 bower_components/promise-polyfill
└── polymer#1.9.1

iron-scroll-target-behavior#1.1.1 bower_components/iron-scroll-target-behavior
└── polymer#1.9.1

iron-location#0.8.11 bower_components/iron-location
└── polymer#1.9.1

iron-resizable-behavior#1.0.6 bower_components/iron-resizable-behavior
└── polymer#1.9.1

iron-meta#1.1.3 bower_components/iron-meta
└── polymer#1.9.1

iron-fit-behavior#1.2.6 bower_components/iron-fit-behavior
└── polymer#1.9.1

iron-a11y-keys-behavior#1.1.9 bower_components/iron-a11y-keys-behavior
└── polymer#1.9.1

iron-ajax#1.4.4 bower_components/iron-ajax
├── polymer#1.9.1
└── promise-polyfill#1.0.1

webcomponentsjs#0.7.24 bower_components/webcomponentsjs

paper-styles#1.3.1 bower_components/paper-styles
├── font-roboto#1.0.2
├── iron-flex-layout#1.3.7
└── polymer#1.9.1

paper-behaviors#1.0.13 bower_components/paper-behaviors
├── iron-behaviors#1.0.18
├── iron-checked-element-behavior#1.0.6
├── paper-ripple#1.0.10
└── polymer#1.9.1

test-fixture#1.1.2 bower_components/test-fixture

accessibility-developer-tools#2.12.0 bower_components/accessibility-developer-tools

async#1.5.2 bower_components/async

chai#3.5.0 bower_components/chai

mocha#2.5.3 bower_components/mocha

sinon-chai#2.10.0 bower_components/sinon-chai

lodash#3.10.1 bower_components/lodash

sinonjs#1.17.1 bower_components/sinonjs

stacky#1.3.2 bower_components/stacky

font-roboto#1.0.2 bower_components/font-roboto

iron-checked-element-behavior#1.0.6 bower_components/iron-checked-element-behavior
├── iron-form-element-behavior#1.0.7
├── iron-validatable-behavior#1.1.2
└── polymer#1.9.1

paper-ripple#1.0.10 bower_components/paper-ripple
├── iron-a11y-keys-behavior#1.1.9
└── polymer#1.9.1

iron-behaviors#1.0.18 bower_components/iron-behaviors
├── iron-a11y-keys-behavior#1.1.9
└── polymer#1.9.1

iron-form-element-behavior#1.0.7 bower_components/iron-form-element-behavior
└── polymer#1.9.1

iron-validatable-behavior#1.1.2 bower_components/iron-validatable-behavior
├── iron-meta#1.1.3
└── polymer#1.9.1

maxw@tmp$ sed -i '/afterNextRender/s/function()/() =>/' src/shop-app.html

maxw@tmp$ grep -r '=>' src

src/shop-app.html:        Polymer.RenderStatus.afterNextRender(this, () => {
src/shop-app.html:          Polymer.RenderStatus.afterNextRender(this, () => {

maxw@tmp$ polymer build --js-compile

warn: [polymer-project-config]    "sourceGlobs" config option has been renamed to "sources" and will no longer be supported in future versions
warn: [polymer-project-config]    "includeDependencies" config option has been renamed to "extraDependencies" and will no longer be supported in future versions
info:    Clearing build/ directory...
info:    (default) Building...
info:    (default) Build complete!

maxw@tmp$ grep -r '=>' build/default/src

build/default/src/shop-app.html:        Polymer.RenderStatus.afterNextRender(this, () => {
build/default/src/shop-app.html:          Polymer.RenderStatus.afterNextRender(this, () => {

maxw@tmp$ polymer --version

1.0.2

maxw@tmp$ npm ls -g polymer-build

/home/maxw/.nvm/versions/node/v7.8.0/lib
└─┬ [email protected]
  └── [email protected]

[rictic]

Hm, it looks the issue here is that --js-compile isn't working. I can repro your steps, but when I specify that js should be compiled via polymer.json it does compile as expected.

[FredKSchott]

Blah, I think you're right that the flag is not working anymore.

There was a change that was done quickly here to support the preset argument in time for v1.0, it looks like it may be the cause.

Will work on a fix for this, thanks for reporting/following up. As a work around, please set your build options in a project polymer.json.

[usergenic]

wrt the --js-compile option not working. NONE of the hyphenated command options are working for the build command. Fixed this in PR https://github.com/Polymer/polymer-cli/pull/817

[usergenic]

Fixed in #817