Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
When a tooltip or popover does not fit in the containing element, this causes the
PopperContent
component to get into an infinite loop of switching betweenplacement
s in its state. This is because we attempt to updatethis.state.placement
everytime popper.js flips the placement to find a better fit and pass it back as theplacement
property toReactPopper
.This is a problem because the
PopperContent
component has two sources of truth for its placement. One coming from its ownplacement
property, and one coming from the internal data ofReactPopper
.This commit fixes the issue by using
PopperContent
'splacement
property as the initial placement of theReactPopper
component and allowingReactPopper
to manage its own updates (i.e. if the popover needs to be flipped because there's not enough room for the specified placement.)I manually tested this by reproducing the issues linked below at https://reactstrap.github.io/components/popovers/, and making sure that the page wouldn't crash when I followed the same steps on the changes in this branch.
Fixes #1482
Fixes #1488
Fixes #1664