Front end project doesnt recognise react IDs?

[anilsiv]

Hi FCC Forumers, I’m currently doing the front end project 1: random quote machine.

CodePen here: https://codepen.io/anilsiv/pen/NWROxwG?editors=1010

But the test script doesn’t recognise the IDs in the built react app - I assume it is looking for them in the HTML but as it’s a react app it’s only mounting on a root div! Once in there the back half of the tests are passing but not the simple tests that look for the IDs… any advice would be much apprecaited!

EDIT: I even tried putting in Pseudo-Divs to trick the script but it’s not having any of it.

[Sky020]

Welcome, anilsiv.

React components do not have HTML attributes like id:

<QuoteBox id="quote-box" className="container" text={this.state.quoteText} author={this.state.quoteAuthor} newQuote={this.newQuote} color={this.state.color}/>

What this is doing is passing a prop named id to QuoteBox.

The tests are set up to work well with React. There is no need for pseudo-divs

Hope this clarifies

[anilsiv]

Thanks for the swift reply Sky! I see now what you mean about the id passed as props!

For anyone making the same error I did I renamed the ReactDOM render div to id=“quote-box” and that sorted it

Thanks Sky