Phaser, flatted don’t get along, “ERROR TypeError: can’t access property “toJSON””

Phaser 3
1

I try to serialize an object (with flatted) which also contains phaser objects. I don’t even know which code am I supposed to paste here.

I import flatted functions like this:

import {stringify, toJSON, fromJSON} from “flatted”;

and when calling:

serializeData = stringify(this);

inside an object I want to serialize, I get an error inside the browser console:

ERROR TypeError: can’t access property “toJSON”, this.anims.get(…) is undefined
toJSON phaser.js:5947
stringify index.js:96
save workspace.ts:27
HomePage_Template_ion_button_click_17_listener home.page.html:49
Angular 27
HomePage_Template home.page.html:49
Angular 16
RxJS 79
core.mjs:6531:23

EDIT:

I am using the 4.0.0 version of phaser

The code inside phaser.js, the error points to the function:

/**
 * Returns the Animation data as JavaScript object based on the given key.
 * Or, if no key is defined, it will return the data of all animations as array of objects.
 *
 * @method Phaser.Animations.AnimationManager#toJSON
 * @since 3.0.0
 *
 * @param {string} [key] - The animation to get the JSONAnimation data from. If not provided, all animations are returned as an array.
 *
 * @return {Phaser.Types.Animations.JSONAnimations} The resulting JSONAnimations formatted object.
 */
toJSON: function (key)
{
    var output = {
        anims: [],
        globalTimeScale: this.globalTimeScale
    };

    if (key !== undefined && key !== '')
    {
//error here
        output.anims.push(this.anims.get(key).toJSON());
    }
    else
    {
        this.anims.each(function (animationKey, animation)
        {
            output.anims.push(animation.toJSON());
        });
    }

    return output;
},

Maybe someone has experience with that. Thank you!

​

2

:waving_hand: I think this is actually a problem with AnimationManager#toJSON(). You can add a fix before new Phaser.Game():

Phaser.Animations.AnimationManager.prototype.toJSON = function () {
    var output = {
        anims: [],
        globalTimeScale: this.globalTimeScale
    };

    this.anims.each(function (animationKey, animation) {
        output.anims.push(animation.toJSON());
    });

    return output;
}