Changing tool dynamically randomly ends up with undefined tool sometimes
```
handleClickTool(event) {
    const value = event.target.innerText;
    this.setState({
      selectedTool: value
    });
  }
render() {
  console.log(this.state.selectedTool);
  const width = window.innerWidth;
  const height = window.innerHeight;
  return (
    <div>
      <ToolPanel handleClickTool={this.handleClickTool} selectedTool={this.state.selectedTool} />
      <SketchField
        ref={(c) => this._sketch = c} 
        style={{position: 'absolute'}}
        width={width} 
        height={height} 
        tool={this.state.selectedTool}
        color='black'
        lineWidth={3}
      />
    </div>
  );
}
```

Selected tool always has a valid string value but the tool will randomly end up being a pencil even when the valid tool is supplied.