How do i unit test a react app that has all the text fields in the children components?

I have created a react application that has all the logic (like onchange functions) in the parent and all the html rendering in the children components.

In order to test if the right state changes are happening i have to enter text to the input fields and enter values but the only problem is I dont know how to access the children elements when i mount the parent in js dom.

Should i move logic into the child components or should i only unit test the functions of the parent component?

This is from the parent

    render() {
    if (!this.state.accessTokenEntered) {
        return <AccessTokenPage _onChange={this._onChange}
                                accessToken={this.state.inputs.accessToken}
                                env={this.state.inputs.env}
                                _onFirstClick={this._onFirstClick}/>;

and this is the child

const AccessToken = props =>(
<Layout>
    <Input name={"accessToken"} displayName={"Access Token"} _onChange={props._onChange}
           value={props.accessToken}/>


    <DropDown name={"env"} displayName={"Environment"} _onChange={props._onChange}
              data={['ppe', 'prod']} multiple={false}
              value={props.env}/>

    <br/>

    <div style=textAlign>
        <input type="button" onClick={props._onFirstClick} className="btn btn-primary" value="Submit"/>
    </div>
</Layout>
);

and this is the childs child

const Input = props => (
<div className="form-group row">
    <label className="col-xs-2 col-form-label">{props.displayName}</label>

    <div className="col-xs-10">
        <input name={props.name} className="form-control" value={props.value}
               onChange={props._onChange}/></div>
</div>
);