React: Access Props Using this.props (error)

class ReturnTempPassword extends React.Component {
  constructor(props) {
    super(props);

  }
  render() {
    return (
        <div>
            { /* change code below this line */ }
            <p>Your temporary password is: <strong>         {this.props.tempPassword}</strong></p>
            { /* change code above this line */ }
        </div>
    );
  }
};

class ResetPassword extends React.Component {
  constructor(props) {
    super(props);

  }
  render() {
    return (
        <div>
          <h2>Reset Password</h2>
          <h3>We've generated a new temporary password for you.</h3>
          <h3>Please reset this password from your account settings ASAP.</h3>
          { /* change code below this line */ }
          
            <ReturnTempPassword tempPassword='abcdefghi'/>
            
          { /* change code above this line */ }
        </div>
    );
  }
};

Why my above code is not running, it says “The ReturnTempPassword component should display the password you create as the tempPassword prop within strong tags.”
but it displays the password.

link for problem : https://learn.freecodecamp.org/front-end-libraries/react/access-props-using-this-props/

1 Like

I’ve edited your post for readability. When you enter a code block into the forum, precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.

markdown_Forums

Thank you for the edit

The tests apparently can’t handle whitespace. You will have to remove all spaces in between <strong></strong>, so that you get:
<strong>{this.props.tempPassword}</strong>
instead of:
<strong> {this.props.tempPassword}</strong>

4 Likes

It should work as intended, whats is exactly the problem?

Thank you for the reply Alexander… It shows below error
“// running test
The ReturnTempPassword component should display the password you create as the tempPassword prop within strong tags.
// tests completed”

but it shows expected result as shown below,

but it did not pass the problem

Did this work for you?

1 Like

Yes it works.
Thank you so much BenGitter

:grinning::grinning::grinning:

1 Like