You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
When an event listener attached to a Bootstrap popover for show.bs.popover returns event.preventDefault(), the popover is not displayed (the correct behavior) the first time, but it will no longer be possible to trigger the popover. The button associated with the popover cannot cause the popover to open again.
Based on my examination, calling the popover sets the this._isHovered variable to true (_enter function). This, however, unintentionally prevents the popover from being reopened.
The issue arises because even if the event hasn't been prevented (showEvent.defaultPrevented is false), and the popover is in the DOM (isInTheDom is true) , the this._isHovered variable is still set to true and this unintendedly prevents the popover from being reopened in subsequent interactions.
in the show function we have two conditions that make reopening not work:
1.
if (!(this._isWithContent() && this._isEnabled)) {
return;
}
if (showEvent.defaultPrevented || !isInTheDom) {
return;
}
A possible solution would be to set this._isHovered to false before the return statement within the show function. This ensures that the this._isHovered state is reset, allowing the popover to be reopened if the conditions for displaying it are met again.
What operating system(s) are you seeing the problem on?
Windows, macOS, Android, iOS, Linux
What browser(s) are you seeing the problem on?
Chrome, Firefox
What version of Bootstrap are you using?
v5.3.3
The text was updated successfully, but these errors were encountered:
Prerequisites
Describe the issue
When an event listener attached to a Bootstrap popover for
show.bs.popover
returnsevent.preventDefault()
, the popover is not displayed (the correct behavior) the first time, but it will no longer be possible to trigger the popover. The button associated with the popover cannot cause the popover to open again.Based on my examination, calling the popover sets the
this._isHovered
variable to true (_enter
function). This, however, unintentionally prevents the popover from being reopened.The issue arises because even if the event hasn't been prevented (
showEvent.defaultPrevented
is false), and the popover is in the DOM (isInTheDom
is true) , thethis._isHovered
variable is still set to true and this unintendedly prevents the popover from being reopened in subsequent interactions.in the show function we have two conditions that make reopening not work:
1.
Reduced test cases
Link for V5 JS Bin test case:
https://output.jsbin.com/madagiqotu
Solution:
A possible solution would be to set
this._isHovered
to false before the return statement within the show function. This ensures that thethis._isHovered
state is reset, allowing the popover to be reopened if the conditions for displaying it are met again.What operating system(s) are you seeing the problem on?
Windows, macOS, Android, iOS, Linux
What browser(s) are you seeing the problem on?
Chrome, Firefox
What version of Bootstrap are you using?
v5.3.3
The text was updated successfully, but these errors were encountered: