Https://www.freecodecamp.org/learn/front-end-libraries/react/add-inline-styles-in-react

JavaScript
1

Tell us what’s happening:
The challenge description doesn’t say that the styles constant needs to be outside the Colorful class declaration. The solution I have below works, but does not pass the tests.

Your code so far


// Change code above this line
class Colorful extends React.Component {
render() {
  // Change code below this line
  const styles = {
    color: "purple", 
    fontSize: 40, 
    border: "2px solid purple"
  }
  return (
    <div style={styles}>Style Me!</div>
  );
  // Change code above this line
}
};

Your browser information:

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4240.185 Safari/537.36.

Challenge: Add Inline Styles in React

Link to the challenge:

2

it’s not accessible by the tests if you create it in local scope, to be able to be tested, the object needs to be in the global scope

3

Maybe it could be made a bit clearer in the question that the object needs to be in the global scope, and also put a // Change code below this line at the beginning of the code followed by an empty line since I missed the comment on the first line as well.

4

would you open a github issue on this?

Thank you for helping make FCC better. Bugs can be reported as GitHub Issues. Whenever reporting a bug, please check first that there isn’t already an issue for it and provide as much detail as possible.