[FIX] web_tour: do not reposition pointer if the anchor didn't move
Before this fix, the tour pointer is always repositioned and the animation is behaving very poorly. Like it's suffering from epilepsy. This is because `reposition` method relies on dom mutation to calculate the correct position which is detected by the tour runner and the tour runner thinks that it needs to check the current step which eventually calls the `reposition` method again, being stuck in a loop. In this commit, we introduce and additional check before calling `reposition`. If the last x and y of the anchor (current step's element) changed by less than a pixel, we consider it as static, and we don't call the `reposition` function. Task-id: 3369617 X-original-commit: cf42ed86220a397f24fca497bf5a77e2b72ba4e2 Part-of: odoo/odoo#125262
This commit is contained in:
@@ -54,6 +54,7 @@ export class TourPointer extends Component {
|
||||
let dimensions = null;
|
||||
let lastMeasuredContent = null;
|
||||
let lastOpenState = this.isOpen;
|
||||
let [anchorX, anchorY] = [0, 0];
|
||||
|
||||
useEffect(
|
||||
() => {
|
||||
@@ -90,7 +91,16 @@ export class TourPointer extends Component {
|
||||
if (!this.isOpen) {
|
||||
const { anchor } = this.props.pointerState;
|
||||
if (anchor) {
|
||||
const { x, width } = anchor.getBoundingClientRect();
|
||||
const { x, y, width } = anchor.getBoundingClientRect();
|
||||
const [lastAnchorX, lastAnchorY] = [anchorX, anchorY];
|
||||
[anchorX, anchorY] = [x, y];
|
||||
// Let's just say that the anchor is static if it moved less than 1px.
|
||||
const delta = Math.sqrt(
|
||||
Math.pow(x - lastAnchorX, 2) + Math.pow(y - lastAnchorY, 2)
|
||||
);
|
||||
if (delta < 1) {
|
||||
return;
|
||||
}
|
||||
const wouldOverflow =
|
||||
window.innerWidth - x - width / 2 < dimensions?.width;
|
||||
el.classList.toggle("o_expand_left", wouldOverflow);
|
||||
|
||||
Reference in New Issue
Block a user