There are instructions on how to use the demo, and how to reproduce the bug step-by-step in the demo.
Steps to reproduce the problem
Create a virtual element that will be the reference point for positioning the tooltip
Create a tooltip with :
a placement "top"
an offset big enough to position an arrow inside
a reference to an arrow element
Place the virtual element so that the tooltip would collide with the borders if placed above the reference
the tooltip will flip to place under the virtual element
the arrow should place itself above the tooltip but remains under
Alternative that causes the same bug
Follow the same procedure as above, but use a placement "left" this time
The arrow never positions itself properly between the tooltip and the virtual element, whether the tooltip has flipped or not
What is the expected behaviour?
The arrow element should always place itself between the virtual element and the tooltip, even when the tooltip is flipped to avoid collisions with the window border.
What went wrong?
When flipping the tooltip across the vertical axis, the arrow remains positioned under the tooltip instead of translating above of it.
When using an horizontal axis, the arrow element remains inside the tooltip instead of outside, and the same issue with the flipping not moving the arrow to be placed between the tooltip and the origin happens as well.
Reproduction demo
Code sandbox link
There are instructions on how to use the demo, and how to reproduce the bug step-by-step in the demo.
Steps to reproduce the problem
Alternative that causes the same bug
What is the expected behaviour?
What went wrong?
Any other comments?
Not sure whether this bug is caused by :
Packages versions