[Error][CC 3.3] AnimationClip.createWithSpriteFrames *NOT* working

Cocos Creator Version: 3.3.0

How to reproduce: Simply create an AnimationClip using “AnimationClip.createWithSpriteFrames” from script. When that animation is played, nothing is shown on UI/screen.

Sample Code:

import { _decorator, Component, Node, SpriteFrame, Sprite, Animation, AnimationClip, CCInteger } from 'cc';
const { ccclass, property } = _decorator;
export class AnimationTest extends Component {
    public target: Node;

    public frames: [SpriteFrame];

    public animSpeed: number;


        let item = this.target;
        let animation = item.addComponent(Animation);

        let clip = AnimationClip.createWithSpriteFrames(this.frames, this.animSpeed);
        clip.name = 'item';

        animation.on(Animation.EventType.FINISHED, () => {
            // This message being shown in console. So, the animation is somehow playing. 
            console.log("Animation Finished");

        let state = animation.createState(clip, 'item')!;


Sample Project: attached

AnimationError.zip (86.6 KB)

I shall ask engineering to take a look


As always, thanks for your kind help.
That was working fine in 3.2.0.

If I may suggest, Cocos Team should do more unit-tests.
You fixed some things, but broke some things else which were perfectly working fine in previous versions. Just my two cents. :slight_smile:

This issue has been fixed in 3.3.1 and you can merge this pr:


Thanks a lot for the update :slight_smile:

Any release date for 3.3.1?

I noticed that, that PR added the below line to animation-clip.ts :


But, it didn’t fix the issue. :confused:
I just tested.
You may please try it as well.

I test is normal can be fixed, you have recompiled the engine:

Could you please try with the project I provided above?

I didn’t change the engine, but I modified the engine code and made sure that new file is used. From Sources tab, I could see the new change (I could intercept with a breakpoint as well. So, the change was applied).

Here is the video file of my test,
Before modification:20210914_173357.zip (49.1 KB)
Modified:20210914_174216.zip (93.1 KB)
Modify the engine source code, it needs to be recompiled to take effect.
If there is in effect, this file is modified inside.
File path:3.3.0\resources\resources\3d\engine\bin.cache\dev\preview\bundled\index.js
before modification:


It’s working perfectly now :slight_smile:

I don’t know how to recompile form Current CC installer folder. (if you teach me, I’m willing to learn).
So, I just modified the bundled\index.js directly. :stuck_out_tongue:
And it worked.

Many thanks!!!

This document is an introduction to the compilation engine.

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.