Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Mangesh Khapre 3Mangesh Khapre 3 

Trailhead challenge Stuck - Secure Your Component Communication

Hi, I am bit stuck on this challenge

I made the attribute private and removed it from the wrapper, which I don't think is right way to do. as we just need to control the attributes access.
However, it was not letting me save it. and the challenge is failing with -

The 'LTNG_Access_Control_Challenge_Wrapper' component does not appear to contain the correct code to call the 'LTNG_Access_Control_Challenge' component.



LTNG_ACCESS_CONTROL_CHALLENGE

<aura:component access="global">
    <aura:attribute name="personQuota" access="private" type="Decimal" default="25"/>
    <aura:attribute name="currentPeople" access="private" type="Decimal" default="10" />
      <!-- Global may be too permissive here, private would be better since only the CEO decides commissions -->
      <aura:attribute name="guardAsleep" access="private" type="Boolean" default="false" /> <!-- CHANGE 1 HERE -->
      
      <div class="slds-row slds-align--absolute-center">
      <div class="slds-panel slds-size--4-of-6">
        <article class="slds-card">
            <div class="slds-card__header">
                Welcome to the castle.  We have a strict quota of {!v.personQuota} citizens
            </div>
            <div class="slds-card__body">
                <ui:outputNumber value="{!v.currentPeople}"/> People<br />
                <ui:button press="{!c.attemptEntry}" label="Enter"/>
            </div>
        </article>
    </div>
  </div>
</aura:component>

LTNG_ACCESS_CONTROL_CHALLENGE_WRAPPER

<aura:component implements="force:appHostable" access="global">
 <!--<c:LTNG_Access_Control_Challenge guardAsleep="{!v.sleepingGuard}"/>-->
    <div class="slds-row slds-align--absolute-center">
        <div class="slds-size--3-of-6">
            <div class="slds-row slds-align--absolute-center">
                <div class="slds-panel slds-size--4-of-6 ">
                    <h2 class="slds-text-heading--medium">Welcome to the castle.  Be warned, a guard will keep the castle from going over its person allocation</h2>
                    <ui:inputCheckbox label="Guard Asleep?" value="{!v.sleepingGuard}" />
                </div>
                <div class="slds-pabel slds-size--2-of-6">
                     <!--<c:LTNG_Access_Control_Challenge guardAsleep="{!v.sleepingGuard}"/>-->
                </div>  
            </div>
        </div>
    </div>
    <hr />
    <div class="slds-row slds-align--absolute-center">
        <div class="slds-size--4-of-6">
            <c:CodeInstructions componentName="LTNG_Access_Control_Demo" />
        </div>
    </div>
</aura:component>
 
Amanda RollinsAmanda Rollins
I'm having this issue as well. Did you by chance figure it out?
Linda KalasnikovaLinda Kalasnikova
Hi. You just simply need to remove value="{!v.sleepingGuard}" from  <c:LTNG_Access_Control_Challenge/>.

<aura:component implements="force:appHostable" access="global">
    <aura:attribute name="sleepingGuard" default="false" type="Boolean" />
    <div class="slds-row slds-align--absolute-center">
        <div class="slds-size--3-of-6">
            <div class="slds-row slds-align--absolute-center">
                <div class="slds-panel slds-size--4-of-6 ">
                    <h2 class="slds-text-heading--medium">Welcome to the castle.  Be warned, a guard will keep the castle from going over its person allocation</h2>
                    <ui:inputCheckbox label="Guard Asleep?" value="{!v.sleepingGuard}" />
                </div>
                <div class="slds-pabel slds-size--2-of-6">
                    <c:LTNG_Access_Control_Challenge/>
                </div>
            </div>
        </div>
    </div>
    <hr />
    <div class="slds-row slds-align--absolute-center">
        <div class="slds-size--4-of-6">
            <c:CodeInstructions componentName="LTNG_Access_Control_Demo" />
        </div>
    </div>
</aura:component>
Amit Singh 1Amit Singh 1
Hi,

Use below code

Challenge Wrapper 
<aura:component implements="force:appHostable" access="global">
    <aura:attribute name="sleepingGuard" default="false" type="Boolean" access="private"/>
    <div class="slds-row slds-align--absolute-center">
        <div class="slds-size--3-of-6">
        	<div class="slds-row slds-align--absolute-center">
        		<div class="slds-panel slds-size--4-of-6 ">
                    <h2 class="slds-text-heading--medium">Welcome to the castle.  Be warned, a guard will keep the castle from going over its person allocation</h2>
                    <ui:inputCheckbox label="Guard Asleep?" value="{!v.sleepingGuard}" />
                </div>
                <div class="slds-pabel slds-size--2-of-6">
                     <c:LTNG_Access_Control_Challenge /> 
                </div>
    		</div>
        </div>
    </div>
    <hr />
    <div class="slds-row slds-align--absolute-center">
        <div class="slds-size--4-of-6">
    		<c:CodeInstructions componentName="LTNG_Access_Control_Demo" />
        </div>
    </div>
</aura:component>

Challenge 
<aura:component access="global">
	<aura:attribute name="personQuota" access="private" type="Decimal" default="25"/>
	<aura:attribute name="currentPeople" access="private" type="Decimal" default="10" />
  	<!-- Global may be too permissive here, private would be better since only the CEO decides commissions -->
  	<aura:attribute name="guardAsleep" access="private" type="Boolean" default="false" />
  	
  	<div class="slds-row slds-align--absolute-center">
  	<div class="slds-panel slds-size--4-of-6">
        <article class="slds-card">
        	<div class="slds-card__header">
                Welcome to the castle.  We have a strict quota of {!v.personQuota} citizens
            </div>
            <div class="slds-card__body">
                <ui:outputNumber value="{!v.currentPeople}"/> People<br />
                <ui:button press="{!c.attemptEntry}" label="Enter"/>
            </div>
        </article>
    </div>
  </div>
</aura:component>

Challenge Controller 
({
	attemptEntry : function(component, event, helper) {
		var currentPeople = component.get("v.currentPeople");
        var guardAsleep = component.get("v.guardAsleep");
        currentPeople += 5;
        if(currentPeople <= 25 || guardAsleep) {
            component.set("v.currentPeople", currentPeople);
        } 
        else {
    		var toastEvent = $A.get("e.force:showToast");
    		toastEvent.setParams({
        		"title": "Guard Says",
        		"message": "No more people allowed in...!!"
    		});
   		 	toastEvent.fire();
        } 
	}
})

Thanks,
Amit Singh
https://sfdcpanther.wordpress.com/
Ivan VrtacnikIvan Vrtacnik
The above answers are correct, however the problem appears if you modify the Challenge component before modifying the Challenge Wrapper. First remove the guardAsleep attribute from the Challenge component in the wrapper, and only then will you be able to set the guardAsleep attribute access to "private" in the Challenge component.