Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

babel({ presets: ['es2015']})) breaks google-map #353

Open
ZepAviator opened this issue Feb 16, 2017 · 3 comments
Open

babel({ presets: ['es2015']})) breaks google-map #353

ZepAviator opened this issue Feb 16, 2017 · 3 comments

Comments

@ZepAviator
Copy link

I am using the Polymer framework, and specifically the polymer-build toolchain.

bower.json entry is:

"dependencies": {
  "google-map": "GoogleWebComponents/google-map#^1.2.0"
}

We are using these npm versions to compile from ES6

    "babel-core": "^6.23.1",
    "babel-eslint": "^7.1.1",
    "babel-preset-es2015": "^6.22.0",

In the gulp process, I have this:

.pipe(polymerProject.splitHtml())
.pipe(gulpif(/(?!\.min)[\w]{4}\.js$/, babel({ presets: ['es2015']})))
.pipe(gulpif(/(?!\.min)[\w]{4}\.js$/, uglify()))  // .pipe(gulpif(/\.js$/, uglify()))
.pipe(gulpif(/\.css$/, cssSlam()))
.pipe(gulpif(/\.html$/, htmlMinifier({collapseWhitespace: true, removeComments: true})))
.pipe(polymerProject.rejoinHtml())

All works, but the babel compiling down will result with the following error:

Uncaught TypeError: Cannot set property markers of #<google-map> which has only a getter
    at HTMLElement._updateMarkers (google-map.html:13)
    at HTMLElement._initGMap (google-map.html:13)
    at HTMLElement.attached (google-map.html:13)
    at polymer-micro.html:1
    at Object.whenReady (polymer-micro.html:1)
    at HTMLElement.attachedCallback (polymer-micro.html:1)
    at HTMLElement.attachedCallback (polymer-mini.html:1)
    at HTMLElement._finishDistribute (polymer-mini.html:2)
    at HTMLElement._readyClients (polymer-mini.html:1)
    at HTMLElement._ready (polymer-mini.html:1)
_updateMarkers @ google-map.html:13
_initGMap @ google-map.html:13
attached @ google-map.html:13
(anonymous) @ polymer-micro.html:1
whenReady @ polymer-micro.html:1
attachedCallback @ polymer-micro.html:1
attachedCallback @ polymer-mini.html:1
_finishDistribute @ polymer-mini.html:2
_readyClients @ polymer-mini.html:1
_ready @ polymer-mini.html:1
_tryReady @ polymer-mini.html:1
_initFeatures @ polymer.html:3
__initialize @ polymer-micro.html:1
createdCallback @ polymer-micro.html:1
window.Polymer @ polymer-micro.html:1
(anonymous) @ property-detail.html:37
@ZepAviator
Copy link
Author

I have to do further testing, but it might be that this is a Vulcanize issue and might be fine with polymer-build 0.8.0.

@ZepAviator
Copy link
Author

Found the issue. Line 557 of google-map.html:
this.markers = this._setMarkers(newMarkers);

markers is a readOnly property and thus has no setter. For some reason Polymer 1.0 without ES6 babel compiling has no issue with it. After running Polymer through babel though, this is an error.

It should be an error regardless. What does work is changing the line to :
this._setMarkers(newMarkers);

ZepAviator added a commit to ZepAviator/google-map that referenced this issue Feb 17, 2017
…s = VALUE results in a setter error. _setMarkers(VALUE) is enough.

Fixes issue GoogleWebComponents#353
@ZepAviator
Copy link
Author

Fixed with PR #354

Until it's merged, if someone else runs across the same issue, I'll keep this branch updated with master:
https://github.com/ZepAviator/google-map/tree/markers_no_setter_fix

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant