Vertical alignment of popovers

[julien-deramond]

Prerequisites

• I have searched for duplicate or closed issues
• I have validated any HTML to avoid common problems
• I have read the contributing guidelines

Describe the issue

There is an issue in the main branch about popovers vertical alignment; they are slightly too low.
I would say it happens since fa33e83. There were other issues regarding this topic at the same moment so I'm not 100% sure.

Reference: https://getbootstrap.com/docs/5.1/components/popovers/#example

main branch rendering:

Additional note: if you switch browser tabs or scroll until they are hidden and scroll back until they are visible, the issue is fixed. So the issue seems to appear only at the init phase and is fixed after that the popovers are redrawn.

Reduced test cases

This issue is visible in the main branch.

What operating system(s) are you seeing the problem on?

Linux

What browser(s) are you seeing the problem on?

Chrome, Firefox

What version of Bootstrap are you using?

v5.2.0 (current main branch)

[XhmikosR]

I would say it happens since fa33e83. There were other issues regarding this topic at the same moment so I'm not 100% sure.

This is impossible to have caused the issue 🙂

@GeoSot will identify the issue, but if you beat us to it, let us know.

[julien-deramond]

This is impossible to have caused the issue slightly_smiling_face

I didn't understand your answer at first but yeah of course I copy pasted the wrong commit 😇. I thought it was the next one 94a596f.
Actually if you checkout 374eeec and replace SELECTOR_TOOLTIP_ARROW with .${this.constructor.NAME}-arrow in tooltip.js: it is well-aligned. If you do the same with 6f077ff: you'll see the issue.