Pass an Array as Props - problem with the challenge

Tell us what’s happening:

Your code so far


const List= (props) => {
  { /* change code below this line */ }
  return <p> {props.tasks.join(", ")}</p>
  { /* change code above this line */ }
};

class ToDo extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <div>
        <h1>To Do Lists</h1>
        <h2>Today</h2>
        { /* change code below this line */ }
        <List tasks={["do homework", "lunch"]}/>
        <h2>Tomorrow</h2>
        <List tasks={["walk dog", "workout","eat"]}/>
        { /* change code above this line */ }
      </div>
    );
  }
};

I don’t understand why my code doesn’t work, I compared it to the hint part and is the same.

Link to the challenge:

So very very close!

Take a look at this line:

  return <p> {props.tasks.join(", ")}</p>

… there’s an extra space right after the opening paragraph tag. That’s what is failing the tests.

1 Like

Really? That is weird!

1 Like

Not as weird as you think.The test suite (pretty much any test suite) does exactly what you tell it. If you tell it “i want an opening paragraph, this exact string, and a closing paragraph…” anything else go boom.

1 Like

wow…thank you! I don’t think I’d come up with this in like million years :smiley:

1 Like

you’re doing a great job, and with time and practice, you’ll just keep getting better. I’ll be looking forward to seeing how it goes with you, and keep in touch!

Best regards.

1 Like