When I need to find the component to expect that display correctly like...
user_detail.tsx
...
return <div>
{isTrue ? <Avatar /> : <Title> }
</div>
user_detail.spec.tsx
...
it('Should render Avatar when flag isTrue is true', () => {
expect(screen.findByRole('Avatar')).not.toBeFalsy()
})
I always got an error Unable to find an accessible element with the role "Avatar"
Is there any solution to find elements by component name?