I am getting this error This page has an error. You might just need to refresh it. Error during init [Error in $A.getCallback() [Cannot read property 'apply' of undefined]] when I try to open a record in vf page with lightning component embedded in the page. My page is MerchandiseLightningPage.vf

<apex:page >
    <apex:includeScript value="/lightning/lightning.out.js"/>
        $Lightning.use("c:MerchandiseLightningApp", function() {
                function(cmp) {
                    console.log("Component created!");
   <div id="theLead"></div> 

My lightning component is MerchandiseLightning.cmp

    <aura:component controller="MerchandiseLightningController" access="global" implements="forceCommunity:availableForAllPageTypes,force:hasRecordId">
    <aura:attribute name="merchandise" type="Merchandise__c"/>
    <aura:attribute name="recordId" type="Id" />

    <aura:handler name="init" value="{!this}" action="{!c.init}" />

    <div class="slds-grid">
        <div class="slds-col slds-size--2-of-6">
            <img src="{!merchandise.Image_URL__c}"  alt="No Product Image" width="80" height="80" border="0" style="margin-top: 20px;"/>
        <div class="slds-col slds-size--4-of-6">
            <div style="padding-top: 10px;color: cornflowerblue;">
                <ui:outputText value="{!merchandise.Name}"/>
            <div style="color: grey;">
                <ui:outputText value="{!merchandise.Price__c}"/>


My component controller class is MerchandiseLightningConroller.js

    init : function(component, event, helper) {
            //first load the current value of the lookup field


My component helper class is MerchandiseLightningHelper.js

    loadMerchandise : function(component) {

        var action = component.get("c.getMerchandise");

            "merchandiseId" : component.get("v.recordId");

        action.setCallback(this, function(response){
            if(response.error && response.error.length){
                return $A.error('Unexpected error: '+response.error[0].message);
            var data = response.getReturnValue();
            if(data != null){
                component.set("v.merchandise", data);
            } else{
                console.error("No errors found");

Finally my Lightning controller class is MerchandiseLightningController.apxc

public class MerchandiseLightningController {

    public static Merchandise__c getMerchandise(Id merchandiseId){
        return [SELECT Id, Name, Price__c, Image_URL__c FROM Merchandise__c WHERE Id =: merchandiseId];


In your component helper, you just have an extra ; at the end of the line where you're setting your params:

    "merchandiseId" : component.get("v.recordId") -->**;**<--

It should be

    "merchandiseId" : component.get("v.recordId")

For this you can use Salesforce Lightning CLI on your components, it will look at your code and give you details on this kind of errors:

enter image description here

|improve this answer|||||
  • I've just added some details about Lightning CLI that you can use if you have this kind of error again in the future. – Fabien Taillon Dec 6 '16 at 14:23

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.