Lightning Web Components Specialist Superbadge - Challenge 5 - boatTile - Answers - Salesforce Trailblazer Community
Trailblazer Community
Ask Search:
Jason DenHollanderJason DenHollander 

Lightning Web Components Specialist Superbadge - Challenge 5 - boatTile

I keep hitting this error for the boatTile challenge (Challenge 5) of the LWC Superbadge.

Challenge Not yet complete... here's what's wrong:
We can’t find the correct settings for selectBoat() in the component boatTile JavaScript file. Make sure the function was created properly, dispatching the event boatselect with the correct detail and settings, according to the requirements, using the proper case-sensitivity and quotation.

Here is my selectBoat function from boatTile:
selectBoat() {
      const boatselectEvent = new CustomEvent('boatselect', {
        // detail contains only primitives
        detail: {boatId: this.boat.Id}
      });
      this.dispatchEvent(boatselectEvent);
    }
I went ahead and created some of the supporting components (boatSearch, boatSearchResults) to make testing the event/boatTile easier.  The selection is working so I suspect there is something specific I'm missing that the checker is looking for.
 
Best Answer chosen by Jason DenHollander
Jean-Noel CasassusJean-Noel Casassus
Just in case, try to remove your comment in the CustomEvent

All Answers

Jean-Noel CasassusJean-Noel Casassus
Just in case, try to remove your comment in the CustomEvent
This was selected as the best answer
Paul McCollumPaul McCollum
What about this: "For this reason, the JavaScript file requires two different attributes to receive information about the boat that displays in the tile (boat) and the currently selected boat Id (selectedBoatId). Make sure to use the correct decorators for these attributes." I only see 1 attribute in the event. Id.
 
Paul McCollumPaul McCollum
And here's the format of another event Dispatch block. I'd make your code follow this pattern. 
// Fires event that the search option has changed.
  // passes boatTypeId (value of this.selectedBoatTypeId) in the detail
  handleSearchOptionChange(event) {
    // Create the const searchEvent
    // searchEvent must be the new custom event search
    searchEvent;
    this.dispatchEvent(searchEvent);
  }

 
Rachel FrazerRachel Frazer
Before creating the event you need to assign this.selectedBoatId, then use that variable in event detail. Other than that, your event should be fine.