react-relative-portal is a package that is used to create the html outside the component so as to ignore the overflow properties. The issue being that when I test the react component and the part that I want to test is outside the scope of the mounted component.I am not sure how to proceed with testing it.
class MyComponent extends Component{
constructor(){
this.state={
showPotal: false
}
}
handleClick = () => {
this.setState((prevState) =>{
showPortal: !prevState.showPortal
})
}
render(){
<button onClick={this._handleClick}>show portal</button>
{this.state.showPortal && (
<RelativePortal component="div">
<Portal />
</RelativePortal>
)}
}
}
As you can see since <Portal />
is inside <RelativePortal />
and thus rendered outside the component. I am not sure how to find the <Portal />
in the context of <MyComponent />