While working through the Trailhead for Lightning Components Basics - Handle Actions with Controllers, I got to the Check Challenge and got stumped because the system was telling me:
The campingListItem JavaScript controller isn't disabling the button correctly

I was fairly certain this message was incorrect. I even built a app that used an aura:iteration to display a group of c:campingListItem instances, and my approach was indeed disabling the button when you click on it, as specified.

My approach:

<!--  campingListItem.cmp  -->
  ...
  <ui:button label="Packed!" disabled="{!v.item.Packed__c}" press="{!c.packItem}"/>

//  campingListItemController.js
({
    packItem : function(component, event, helper) {
        var item = component.get("v.item");
        item.Packed__c = true;
        component.set("v.item", item);
    }
})

But it turns out the Trailhead Check Challenge doesn't expect you to use an expression (in markup) for the disabled attribute of the ui:button, it expects you to set the disabled attribute in the javascript controller:

//  campingListItemController.js
({
    packItem : function(component, event, helper) {
        var item = component.get("v.item");
        item.Packed__c = true;
        component.set("v.item", item);

        var btnClicked = event.getSource();
        btnClicked.set("v.disabled", true);
    }
})

Does anyone have an opinion or insight on this?  Should Check Challenge be changed to expect either approach?

While working through the Trailhead for Lightning Components Basics - Handle Actions with Controllers, I got to the Check Challenge and got stumped because the system was telling me:
The campingListItem JavaScript controller isn't disabling the button correctly

I was fairly certain this message was incorrect. I even built a app that used an aura:iteration to display a group of c:campingListItem instances, and my approach was indeed disabling the button when you click on it, as specified.

My approach:

<!--  campingListItem.cmp  -->
  ...
  <ui:button label="Packed!" disabled="{!v.item.Packed__c}" press="{!c.packItem}"/>

//  campingListItemController.js
({
    packItem : function(component, event, helper) {
        var item = component.get("v.item");
        item.Packed__c = true;
        component.set("v.item", item);
    }
})

But it turns out the Trailhead Check Challenge doesn't expect you to use an expression (in markup) for the disabled attribute of the ui:button, it expects you to set the disabled attribute in the javascript controller:

//  campingListItemController.js
({
    packItem : function(component, event, helper) {
        var item = component.get("v.item");
        item.Packed__c = true;
        component.set("v.item", item);

        var btnClicked = event.getSource();
        btnClicked.set("v.disabled", true);
    }
})

Does anyone have an opinion or insight on this?  Should Check Challenge be changed to expect either approach?

I am having trouble completing the challenge for the "Create and Edit Lightning Components" module of the "Lightning Components Basics" trail. Here is the challenge:

Create a camping component that contains a campingHeader and a campingList component.
    The campingList component contains an ordered list of camping supplies that include Bug Spray, Bear Repellant, and Goat Food.
    The campingHeader component contains an H1 heading style with a font size of 18 points and displays 'Camping List'.

Here is my code:

camping.cmp

<aura:component >   
    <c:campingHeader/>
    <c:campingList/>
</aura:component>

campingHeader.cmp

<aura:component >
    <H1>Camping List</H1>
</aura:component>

campingHeader.css

.THIS {
}

H1.THIS {
    font-size: 18px;
}

campingList.cmp

<aura:component >
    <aura:attribute name="campingSupplies" type="List" default="['Bear Repellant', 'Bug Spray', 'Goat Food']" />
</aura:component>

When I check the challenge, I get the error message:

Challenge Not yet complete... here's what's wrong:
The component is not using the correct font size.

Any help is greatly appreciated.

I am having trouble completing the challenge for the "Create and Edit Lightning Components" module of the "Lightning Components Basics" trail. Here is the challenge:

Create a camping component that contains a campingHeader and a campingList component.
    The campingList component contains an ordered list of camping supplies that include Bug Spray, Bear Repellant, and Goat Food.
    The campingHeader component contains an H1 heading style with a font size of 18 points and displays 'Camping List'.

Here is my code:

camping.cmp

<aura:component >   
    <c:campingHeader/>
    <c:campingList/>
</aura:component>

campingHeader.cmp

<aura:component >
    <H1>Camping List</H1>
</aura:component>

campingHeader.css

.THIS {
}

H1.THIS {
    font-size: 18px;
}

campingList.cmp

<aura:component >
    <aura:attribute name="campingSupplies" type="List" default="['Bear Repellant', 'Bug Spray', 'Goat Food']" />
</aura:component>

When I check the challenge, I get the error message:

Challenge Not yet complete... here's what's wrong:
The component is not using the correct font size.

Any help is greatly appreciated.