my reusable component looks like this `jsx
return <div>
<label className="label" htmlFor={name}>
</label>
<textarea
name={name}
aria-label={name}
id={id || name}
onChange={this.onChange}
value={value}
/>
</div>;
and its being pulled in like this below inside another component like this
<TxtareaComp
name="Lorem"
value={this.props.lorem}
id="lorem-ipsum"
onChange={this.props.lorem}
/>
and when its rendered it looks like this
<div><label class="label" for="Lorem">Lorem</label>
<textarea name="lorem" " id="Lorem">
</textarea>
</div>
works perfectly fine, but the problem is the its failing tests for accessibility
Its saying I am missing a label
Sniffybara::PageNotAccessibleError:
Form elements must have labels
Elements:
<TxtareaComp...
["#lorem-ipsum"]
Although there is a label, how can i bypass to fix this... while using the existing component?