TypeError: Cannot assign to read only property 'target' of object '#<AnimationPlaybackEvent>'

[web-padawan]

This error appears with latest 2.2.3 release.

TypeError: Cannot assign to read only property 'target' of object '#<AnimationPlaybackEvent>'

Not yet managed to create a small repro, will investigate.

[ztzven]

+1

Had to downgrade our version to 2.2.2 to get things working. Had the boss yelling down my ear at this one! (CI live site deploy for-the-fail 😭 )

[LarsDenBakker]

We have this error as well.

[gmcinalli]

Me too, I had to downgrade to 2.2.2.

[misterzorgy]

Yeah..downgraded to 2.2.2

[ghost]

Just curious, what behavior is affected by this error? Currently I only see this error when clicking on paper-icon-buttons, and at least the functionality appears to be intact.

[web-padawan]

Some elements using animations like paper-menu-button, paper-dropdown-menu, paper-dialog etc are broken and might not open at all.

[abdonrd]

I have the same problem!

[ronnyroeller]

Same issue here

[DarkSideOfMo0n]

Up! 2.2.3 Breaks almost every Polymer app.

[samuelli]

This has been fixed in #124. Please update to 2.2.4!

[emilio-martinez]

@samuelli FYI, I'm not seeing 2.2.4 deployed in npm. I see it on the repo releases but not npm.

[samuelli]

cc @alancutter: looks like NPM publishing didn't work. Can you re-publish to NPM? Thanks.

[alancutter]

Apologies. The npm release should be at 2.2.4 now.

[emilio-martinez]

@alancutter thank you!

[lousley]

this problem isn't fix with 2.2.4 --> tested with paper-dialog and i have the same error message!

[samuelli]

@lousley: can you provide reproduction steps?

Can you run cat bower_components/web-animations-js/History.md | head -1 to confirm the version of web-animations that you have? I tried paper-dialog and don't see any errors.

[lousley]

I found the problem in the library web-animations-next-lite.min.js.gz! Is it possible that you have forgot update the .gz file?

[alancutter]

Uhoh, the .gz file isn't even supposed to be there. The release instructions should probably be updated to use *.min.js{,.map} instead of *.min.js* to avoid picking up more files than intended.

[lousley]

ah ok :) do you make a new version?

[alancutter]

Thanks for reporting the mishap, removed the erroneous *.gz files in https://github.com/web-animations/web-animations-js/releases/tag/2.2.5.

[lousley]

@alancutter thank you!

[BorntraegerMarc]

I am experiencing this issue again when I updated all my dependencies to Polymer 2.0. Has anybody also experienced this issue again in Polymer 2.0?

[BorntraegerMarc]

BTW: The warning in the console disappears when I add the import <link rel="import" href="assets/bower_components/neon-animation/web-animations.html"> manually but the scroll issue persists. So it breaks my app at the moment...

[samuelli]

@BorntraegerMarc: can you remove your bower_components and run bower install again?

If it's still broken can you dump your bower.json and the contents of bower list?

[BorntraegerMarc]

@samuelli Thanks for the fast feedback. I did as you asked but the error still persists. Here is the dump of my dependencies:

"dependencies": {
    "app-layout": "PolymerElements/app-layout#2.0.0",
    "iron-flex-layout": "PolymerElements/iron-flex-layout#2.0.0",
    "paper-checkbox": "PolymerElements/paper-checkbox#2.0.0",
    "paper-styles": "PolymerElements/paper-styles#2.0.0",
    "paper-icon-button": "PolymerElements/paper-icon-button#2.0.0",
    "polymer": "Polymer/polymer#2.0.0",
    "iron-icons": "PolymerElements/iron-icons#2.0.0",
    "paper-button": "PolymerElements/paper-button#2.0.0",
    "paper-dialog": "PolymerElements/paper-dialog#2.0.0",
    "paper-input": "PolymerElements/paper-input#2.0.0",
    "paper-card": "PolymerElements/paper-card#2.0.0",
    "paper-toast": "PolymerElements/paper-toast#2.0.0",
    "paper-item": "PolymerElements/paper-item#2.0.0",
    "paper-ripple": "PolymerElements/paper-ripple#2.0.0",
    "paper-menu-button": "PolymerElements/paper-menu-button#2.0.0",
    "paper-dialog-scrollable": "PolymerElements/paper-dialog-scrollable#2.0.0",
    "vaadin-upload": "v2.0.0-alpha3",
    "iron-collapse": "PolymerElements/iron-collapse#2.0.0",
    "font-roboto": "PolymerElements/font-roboto-local#1.0.1",
    "iron-dropdown": "PolymerElements/iron-dropdown#2.0.0",
    "paper-spinner": "PolymerElements/paper-spinner#2.0.0",
    "paper-search": "Collaborne/paper-search#1.4.0",
    "paper-listbox": "PolymerElements/paper-listbox#2.0.0",
    "web-animations-js": "web-animations/web-animations-js#2.2.5",
    "paper-avatar": "Abe90/paper-avatar#1.0.3"
  }

I already had the issue with version 2.2.3 and Polymer 1. But then with the next released the issue got fixed and now after the upgrade I experience the error again.

[BorntraegerMarc]

I think this element PolymerElements/iron-dropdown#132 uses web-animations-js and caused it to fail, maybe?

[Serginho]

Same problem using angular@8.2.14 with "web-animations-js": "^2.3.2" when I use in the tsconfig.json "target": "es2015"

Uncaught TypeError: Cannot assign to read only property 'target' of object '[object AnimationPlaybackEvent]'
    at push../node_modules/web-animations-js/web-animations-next.min.js.b.Animation.<anonymous> (web-animations-next.min.js:15)
    at ZoneDelegate.invokeTask (zone-evergreen.js:391)
    at Object.onInvokeTask (core.js:39680)
    at ZoneDelegate.invokeTask (zone-evergreen.js:390)
    at Zone.runTask (zone-evergreen.js:168)
    at ZoneTask.invokeTask [as invoke] (zone-evergreen.js:465)
    at invokeTask (zone-evergreen.js:1603)
    at Animation.globalZoneAwareCallback (zone-evergreen.js:1629)

Any fix?