0

I'm working on lightning out app to authenticate and expose few lightning components for an external node app. OAuth Access Token is used to authenticate user. It seems to be working fine just that components which aren't added to lightning out app as dependency are still available for creation in node app. Not sure, if this is expected behavior.

For ex.
Lightning out app code:

<aura:application access="GLOBAL" extends="ltng:outApp">
  <aura:dependency resource="c:HPE_TestUI_Cmp" type="COMPONENT" />
  <aura:dependency resource="c:ContactList" type="COMPONENT" />
  <aura:dependency resource="lightning:listView" type="COMPONENT" />
</aura:application>

Node Js Code:

<script>
var access_token = "<%= access_token %>";
console.log("​access_token", access_token);
$Lightning.use("c:HPE_TestLightningOutApp", // name of the Lightning app
    function () { // Callback once framework and app loaded
        console.log("​'came here'", 'came here');
        $Lightning.createComponent(
            "c:HPE_TestUI_Cmp", // top-level component of your app
            {}, // attributes to set on the component when created
            "lightningLocator", // the DOM location to insert the component
            function (cmp) {}
        );
        $Lightning.createComponent(
            "lightning:listView", // top-level component of your app
            {
                "aura:id": "findableAuraId",
                "objectApiName": "Case",
                "listName": "AllOpenCases"
            }, // attributes to set on the component when created
            "NewCaseSection", // the DOM location to insert the component
            function (cmp) {
                // callback when component is created and active on the page
                //alert('Lightning Out App has loaded!');
            }
        );
        $Lightning.createComponent(
            "c:ContactList", // top-level component of your app
            {}, // attributes to set on the component when created
            "ContactSection", // the DOM location to insert the component
            function (cmp) {
                // callback when component is created and active on the page
                // alert('Lightning Out App has loaded!');
            }
        );
        $Lightning.createComponent(
            "c:SkipLoginFlow_Cmp", // top-level component of your app
            {}, // attributes to set on the component when created
            "LoginFlowSection", // the DOM location to insert the component
            function (cmp) {
                // callback when component is created and active on the page
                alert('Lightning Out App has loaded!');
            }
        );
    },
    'https://caphpe01-capg-hpe.cs21.force.com', // Community endpoint
    access_token
);
console.log('done');
</script>

All components listed in node js script are getting created and shown properly on node app UI even if these components aren't added as dependency in ltng out app. Is this an expected behavior or I am missing something.

  • It throws an error if user is not authenticated and app is allowed guest access. In guest access case, It makes sure that dependencies are added properly. Seems like a bug to me. – Ashish Sharma Jan 14 '19 at 7:43
2

Adding aura:dependency is good practice but not required. As written in salesforce docs :-

When a Lightning components app is initialized using Lightning Out, Lightning Out loads the definitions for the components in the app. To do this efficiently, Lightning Out requires you to specify the component dependencies in advance, so that the definitions can be loaded once, at startup time.

https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/lightning_out_dependencies.htm

So dependency is used to load definition of dynamically created component in advance only.

The tag enables you to declare dependencies, which improves their discoverability by the framework. The framework automatically tracks dependencies between definitions, such as components, defined in markup. This enables the framework to send the definitions to the browser. However, if a component’s JavaScript code dynamically instantiates another component or fires an event that isn’t directly referenced in the component’s markup, use in the component’s markup to explicitly tell the framework about the dependency.

https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/ref_tag_dependency.htm

| improve this answer | |
  • Thanks!! It means it is just a best practice. But this should be restricted as it exposes all the lightning components of an Org even if Org Owner does not want to. – Ashish Sharma Jan 14 '19 at 9:17
  • No, I don't know anything in components that will make them invisible in lightning out. One thing you can do is create a package and then make components global and public to make your some components invisible. – Manjot Singh Jan 14 '19 at 10:12

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.