0

Situation: Up to a few days ago every time a user would open a new salesforce tab when opening support cases I was able to create a new aura:component and push a JS static resource to the body of the new aura:component we just created without affecting the other aura:components that are rendered in the DOM with its own state of the static resource in the v.body (which for each tab is different). Once the API version of my org change to 48.0 with salesforce new update now when I set the body of the new aura:component it also sets it to all of the other aura:components bodies overriding what they already had rendered.

**EDITED CODE WITH FIRST ANSWER SUGGESTIONS **

My Comp:

  <aura:component implements="flexipage:availableForAllPageTypes
      access="global"
      controller="auraController"
    >
      <aura:handler name="init" value="{!this}" action="{!c.init}" />
      <aura:attribute name="reactApp" type="Aura.Component[]" access="global"/>
      <aura:attribute name="reactAppBundle" type="Aura.Component[]" access="global" />
      <lightning:card aura:id="reactApp" class="customCardClass">{!v.reactApp}</lightning:card>
      <div aura:id="reactBundle">{!v.reactAppBundle}</div>
    </aura:component>

My JS Controller:

  ({init: function(cmp) {
    let idD = Math.random()

    $A.createComponent(
      "div",
      {
        id: idD,
      },
      function(methods) {
       cmp.set("v.reactApp", [methods]);
      }
    );

 $A.createComponent(
    "c:Lwc",
  {
     id: idD,
    },
    function(methods) {
    cmp.set("v.reactAppBundle", [methods]);
   }
  );
 }
});

Wondering if anyone has any advice on how to make it so when I set the body of this component I'm creating every time a user opens a new tab within salesforce it keeps its own state without overriding the other components that are already rendered on DOM.

0

What you're doing should (probably) never have worked to begin with. {!v.body} in your component refers to the current component's body, not the body of the elements in which it is contained. I'm honestly not surprised you have some odd behavior going on (it's more surprising to me that this ever would have worked).

Instead, you can either (a) just set the body directly, without a reference to {!v.body}, or perhaps more idiomatic would be to (b) set the components to an attribute and use that instead.

<aura:attribute name="cardBody" type="Aura.Component[]" default="[]" />
<aura:attribute name="appBundleBody" type="Aura.Component[]" default="[]" />

<lightning:card class="customCardClass">{!v.cardBody}</lightning:card>
<div>{!v.appBundleBody}</div>

You can simplify your script as well:

function(bn) {
    cmp.set("v.cardBody", [bn]);
}

The framework automatically disposes of anything that was in the previous attribute when using Aura.Component[], so there's no need to go through the song-and-dance of setting an empty array, pushing, etc.


$A.createComponent is deprecated. Consider using $A.createComponents instead. The callback will return components in the same order they're created:

$A.createComponents(
 [ { "div", { id: Id } }, { "c:Lwc", { Id: Id } } ],
 function(results) {
   cmp.set("v.cardBody", [results[0]]);
   cmp.set("v.appBundleBody", [results[1]]);
 });

Finally, the render hook is likely unnecessary here. Just use init instead:

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

Using render may have some performance implications.


Edit: I just realized that perhaps you meant to put the div in the card? It's unclear how you meant to go about this, it definitely looks like you were triggering some kind of bug.

2
  • Hi sfdcfox, yes I create the card and then I put the div inside of the card. The div inside of the card contains the javascript that gets populated inside the card. – Gigi Feb 13 '20 at 18:23
  • I was able to implement the modifications you suggested and unfortunately even when setting the component into the attribute once a new tab is opened and we create a new component (which should be unique for this tab) and you go back to the salesforce tab you have already opened (which doesn't trigger a refresh) then the body of the aura:components rendered get overridden by the body of the new aura:component we just created. Would you have any other advice on this? – Gigi Feb 13 '20 at 22:38

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.