From dadec4852d841c8642e3a9d1832225856549def0 Mon Sep 17 00:00:00 2001
From: Nico Rehwaldt <nico.rehwaldt@camunda.com>
Date: Fri, 28 Jun 2024 09:57:51 +0200
Subject: [PATCH] chore(context-pad): update position in next frame

We'll otherwise force the browser into expensive re-flows.
---
 lib/features/context-pad/ContextPad.js | 45 ++++++++++++++------------
 1 file changed, 25 insertions(+), 20 deletions(-)

diff --git a/lib/features/context-pad/ContextPad.js b/lib/features/context-pad/ContextPad.js
index 6a87cc05c..a757ceba6 100644
--- a/lib/features/context-pad/ContextPad.js
+++ b/lib/features/context-pad/ContextPad.js
@@ -611,29 +611,34 @@ ContextPad.prototype._getPosition = function(target) {
  * Update context pad position.
  */
 ContextPad.prototype._updatePosition = function() {
-  if (!this.isOpen()) {
-    return;
-  }
 
-  var html = this._current.html;
+  const updateFn = () => {
+    if (!this.isOpen()) {
+      return;
+    }
 
-  var position = this._getPosition(this._current.target);
+    var html = this._current.html;
 
-  if ('x' in position && 'y' in position) {
-    html.style.left = position.x + 'px';
-    html.style.top = position.y + 'px';
-  } else {
-    [
-      'top',
-      'right',
-      'bottom',
-      'left'
-    ].forEach(function(key) {
-      if (key in position) {
-        html.style[ key ] = position[ key ] + 'px';
-      }
-    });
-  }
+    var position = this._getPosition(this._current.target);
+
+    if ('x' in position && 'y' in position) {
+      html.style.left = position.x + 'px';
+      html.style.top = position.y + 'px';
+    } else {
+      [
+        'top',
+        'right',
+        'bottom',
+        'left'
+      ].forEach(function(key) {
+        if (key in position) {
+          html.style[ key ] = position[ key ] + 'px';
+        }
+      });
+    }
+  };
+
+  this._scheduler.schedule(updateFn, 'ContextPad#_updatePosition');
 };
 
 /**