Animation Issue with Separate Model and Animation Files

I’m trying to understand why I can’t get the animation to work. I’ve followed this documentation on Animation-system but still can’t get the animation to play on my 3D model. There are no errors or warnings; the animation simply doesn’t start. I thought perhaps it’s because I’m using two separate files, one for the animation and one for the model. In fact, when I combine them into one file, the animation works without any issues.

I also considered that the issue might be with the AnimationMixer object needing its update() method to be called, so I connected it to the game loop, but I only saw a slight movement of the model for one frame, not the complete animation.

import * as THREE from 'three';
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';

export class Test {
    constructor() {

        this.scene = new THREE.Scene(); = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 10000);
        this.renderer = new THREE.WebGLRenderer({ antialias: true });
        this.ambientLight = new THREE.AmbientLight(0xFFFFFF, 0.7);
        this.renderer.setSize(window.innerWidth, window.innerHeight);


    loadModel(modelUrl) {
        const gltfLoader = new GLTFLoader();
        gltfLoader.load(modelUrl, (gltfScene) => {
            const mixer = new THREE.AnimationMixer(gltfScene.scene);


    loadAnimation(mixer) {
        const animationLoader = new GLTFLoader();
        animationLoader.load("dance.glb", (anim) => {
            const action = mixer.clipAction(anim.animations[0]);

    animate() {
        requestAnimationFrame(() => this.animate());

i solved it, fact is that in all of the world wide web , including videos and documentation nobody told that in order to progress with the animation you need to set time. mixer.setTime(time++). I wonder how all NPC knows such things from nothings, guess im the main char.