1

I am getting this error message when dynamically adding a lightning component:

Definition does not exist on the client for descriptor:markup://c:MyCustomLightningComponent. Client side caches have been cleared. Please reload the page. Callback failed: aura://ComponentController/ACTION$getComponent]

I use this function to inject the component:

injectComponent: function (cmp, name) {

    var self = this;
    var activeScreen = cmp.find('activeScreen');

    if (activeScreen) {
        activeScreen.destroy();
    }

    var target = cmp.find('main');

    $A.createComponent(name, {
        "aura:id": "activeScreen"
    }, function (contentComponent, status, error) {
        if (status === "SUCCESS") {
            target.set('v.body', contentComponent);
            self.displayButtons(cmp);
            self.setTitle(cmp);
            self.loadModel(cmp);
        }else if (status === "INCOMPLETE") {
            console.log("No response from server or client is offline.")
        } else if (status === "ERROR") {
            console.log(error);
            throw new Error(error);
        }
    });
},

But dynamically loading components has been working in my code and I haven't recently changed this method.

Additionally, I know the above code works, because it successfully loads the first component, it when I try and load either of the second components that it fails.

I know the component names, i.e. c:MyCustomLightningComponent exist.

I am not using a custom component namespace.

The only thing that has changed recent relates to the code that runs prior to the injectComponent method, I have 5 Promises running and I noticed in the console log that entries appear after the error message, not sure if this is relevant.

JavaScript promises code:

saveStuff : function(cmp, model){

    var self = this;
    var savePromise1;        
    var savePromise1;
    var savePromise3;
    var savePromise4;
    var promises = [];

    promises.push(savePromise1);
    promises.push(savePromise3);

    if (model.foobar == 'true'){
        promises.push(savePromise2);
    }

    if (model.banana.foobar == 'true'){
        promises.push(savePromise4);
    }

    savePromise1 = this.saveBanana(cmp, model).then(function(result){
        model.banana.id = result;

        if (model.foobar == 'true'){

            savePromise2 = self.saveFoobar(cmp, model).then(function(result){
                model.foobar.id = result;

                if (model.apple == 'true'){
                    self.sendAppleEmail(cmp, model);
                    next = screenEnum.END;
                }

                return self.saveAppleRelationship(cmp, model).then(function(result) {
                    model.relationship.id = result; 
                }); 
            });   

        } else {

            if (model.apple == 'true'){
                self.sendAppleEmail(cmp, model);
                next = screenEnum.END;
            }
        }

        savePromise3 = self.saveOrange(cmp, model).then(function(result){
            model.orange.id = result;
        });

        if (model.banana.foobar == 'true'){

            savePromise4 = self.saveBananaFoobar(cmp, model).then(function(result){
                model.banana.foobar.id = result;        
            });    
        }
    });

    Promise.resolve(savePromise1).catch(function(error) {
        console.log('error: ' + JSON.stringify(error));
    });

    Promise.resolve(savePromise2).catch(function(error) {
        console.log('error: ' + JSON.stringify(error));
    });

    Promise.resolve(savePromise3).catch(function(error) {
        console.log('error: ' + JSON.stringify(error));
    });

    Promise.resolve(savePromise4).catch(function(error) {
        console.log('error: ' + JSON.stringify(error));
    });

    Promise.all(promises).then(function(values) {
        var next = self.getNextScreen(cmp, model);
        self.handleChange(cmp, next);
    });      
},

I am not sure where to look next - any suggestions?

0

I solved this by refactoring the JavaScript Promises to chain them together so they had all finished before the methods in Promise.all were run.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.