Use Advanced JavaScript in React Render Method - can't pass it

Tell us what’s happening:

Your code so far


const inputStyle = {
width: 235,
margin: 5
}

class MagicEightBall extends React.Component {
constructor(props) {
  super(props);
  this.state = {
    userInput: '',
    randomIndex: ''
  }
  this.ask = this.ask.bind(this);
  this.handleChange = this.handleChange.bind(this);
}
ask() {
  if (this.state.userInput) {
    this.setState({
      randomIndex: Math.floor(Math.random() * 20),
      userInput: ''
    });
  }
}
handleChange(event) {
  this.setState({
    userInput: event.target.value
  });
}
render() {
  const possibleAnswers = [
    'It is certain',
    'It is decidedly so',
    'Without a doubt',
    'Yes, definitely',
    'You may rely on it',
    'As I see it, yes',
    'Outlook good',
    'Yes',
    'Signs point to yes',
    'Reply hazy try again',
    'Ask again later',
    'Better not tell you now',
    'Cannot predict now',
    'Concentrate and ask again',
    'Don\'t count on it',
    'My reply is no',
    'My sources say no',
    'Most likely',
    'Outlook not so good',
    'Very doubtful'
  ];
  const answer = possibleAnswers[this.state.randomIndex];
  return (
    <div>
      <input
        type="text"
        value={this.state.userInput}
        onChange={this.handleChange}
        style={inputStyle} /><br />
      <button onClick={this.ask}>
        Ask the Magic Eight Ball!
      </button><br />
      <h3>Answer:</h3>
      <p> 
        { /* change code below this line */ }
          {answer}  
        { /* change code above this line */ }
      </p>
    </div>
  );
}
};

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.3 Safari/605.1.15.

Challenge: Use Advanced JavaScript in React Render Method

Link to the challenge:
https://www.freecodecamp.org/learn/front-end-libraries/react/use-advanced-javascript-in-react-render-method

It keeps saying " When text is entered into the input element and the button is clicked, the MagicEightBall component should return a p element that contains a random element from the possibleAnswers array.
But my console is woking fine.

Your code passes for me.
Maybe try a hard refresh of your browser, or clear cache/history…

Thanks! Will try and see if it works.

Check for explanations and the suggested solutions by clicking on the “Get a hint” button.

I also had this problem using Safari. Re-ran code in Firefox and tests passed.

1 Like

@runthejewels thanks!