Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

No style on tooltip when rendered in React Fragment #643

Closed
mawilmouth opened this issue Nov 16, 2020 · 2 comments
Closed

No style on tooltip when rendered in React Fragment #643

mawilmouth opened this issue Nov 16, 2020 · 2 comments

Comments

@mawilmouth
Copy link

When rendering a tooltip next to the target element in a React Fragment, the tooltip is not styled. Upon hovering, the tooltip does appear but does not have any styles applied to it. When I wrapped them in a div, it worked fine. I understand that this may not be a huge issue but I do think that a Fragment wrapper should be handled.

This does not work

<React.Fragment>
   <div
     data-tip
     data-for="githubTest"
     data-testid="ownershipIconContainer"
   >
        <p>hover me</p>
   </div>
   <ReactTooltip
     type="dark"
     effect="solid"
     place="top"
     id="githubTest"
   >
        <p data-testid="ownershipTipText">{ownershipText}</p>
   </ReactTooltip>
</React.Fragment>

This works

<div>
   <div
     data-tip
     data-for="githubTest"
     data-testid="ownershipIconContainer"
   >
        <p>hover me</p>
   </div>
   <ReactTooltip
     type="dark"
     effect="solid"
     place="top"
     id="githubTest"
   >
        <p data-testid="ownershipTipText">{ownershipText}</p>
   </ReactTooltip>
</div>
@lordvcs
Copy link

lordvcs commented Feb 15, 2022

Same issue here too

@lordvcs
Copy link

lordvcs commented Feb 15, 2022

#610 (comment)
this solved the issue for me

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants