# React/redux Manage State Locally First :Why are the tests failed

**URL:** <https://forum.freecodecamp.org/t/react-redux-manage-state-locally-first-why-are-the-tests-failed/269557>\
**Category:** General\
**Created:** [April 6, 2019, 12:59am UTC](https://forum.freecodecamp.org/t/react-redux-manage-state-locally-first-why-are-the-tests-failed/269557 "2019-04-06T00:59:05Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![karlpo](https://avatars.discourse-cdn.com/v4/letter/k/5f9b8f/32.png) [@karlpo](https://forum.freecodecamp.org/u/karlpo)\
**Post date:** [April 6, 2019, 12:59am UTC](https://forum.freecodecamp.org/t/react-redux-manage-state-locally-first-why-are-the-tests-failed/269557/1 "2019-04-06T00:59:05Z")

</div>

**Tell us what’s happening:**  
I’m a bit confused because my code seems to work, and yet it fails most of the tests. Thanks if you take a look!

**Your code so far**

```auto

class DisplayMessages extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      input: '',
      messages: []
    }
    this.submitMessage = this.submitMessage.bind(this);
    this.handleChange = this.handleChange.bind(this);
  };
  // add handleChange() and submitMessage() methods here

  submitMessage() {
    this.setState({input:'',messages:this.state.messages.concat(this.state.input)});
  };
  handleChange() {
    this.setState({input:document.getElementById("input").value});
  };
  render() {
    return (
      <div>
        <h2>Type in a new Message:</h2>
        { /* render an input, button, and ul here */ }
        <input id="input" value = {this.state.input} onChange = {this.handleChange}/>
        <button onClick = {this.submitMessage}>Add messages</button>
        <ul>{this.state.messages.map(x => <li>{x}</li>)}</ul>

        { /* change code above this line */ }
      </div>
    );
  }
};

```

**Your browser information:**

User Agent is: `Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36`.

---

<div class="post-metadata">

**Author:** ![karlpo](https://avatars.discourse-cdn.com/v4/letter/k/5f9b8f/32.png) [@karlpo](https://forum.freecodecamp.org/u/karlpo)\
**Post date:** [April 6, 2019, 1:37am UTC](https://forum.freecodecamp.org/t/react-redux-manage-state-locally-first-why-are-the-tests-failed/269557/2 "2019-04-06T01:37:33Z")

</div>

I solved the problem by using event.target.value instead of getDocumentById

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [January 17, 2021, 8:03pm UTC](https://forum.freecodecamp.org/t/react-redux-manage-state-locally-first-why-are-the-tests-failed/269557/3 "2021-01-17T20:03:22Z")

</div>


