fix(popup): reposition if under axis

bpmn-io · Nov 21, 2023 · 8e05cfd · 8e05cfd
1 parent f125138
commit 8e05cfd
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 0 deletions.
diff --git a/lib/features/popup-menu/PopupMenu.js b/lib/features/popup-menu/PopupMenu.js
@@ -341,6 +341,11 @@ PopupMenu.prototype._ensureVisible = function(container, position) {
     top = position.y - containerBounds.height;
   }
 
+  // underAxis
+  if (position.y < documentBounds.top) {
+    top = position.y + containerBounds.height;
+  }
+
   return {
     x: left,
     y: top

diff --git a/test/spec/features/popup-menu/PopupMenuSpec.js b/test/spec/features/popup-menu/PopupMenuSpec.js
@@ -1653,6 +1653,29 @@ describe('features/popup-menu', function() {
     }));
 
 
+    it('should open within bounds bellow', inject(function(popupMenu) {
+
+      // given
+      var documentBounds = document.documentElement.getBoundingClientRect();
+
+      const y = - 5;
+      var cursorPosition = { x: documentBounds.left + 100, y: documentBounds.top + y };
+
+      // when
+      popupMenu.open({}, 'custom-provider', cursorPosition);
+
+      var menu = queryPopup('.djs-popup');
+
+      var menuDimensions = {
+        width: menu.scrollWidth,
+        height: menu.scrollHeight
+      };
+
+      // then
+      expect(menu.offsetTop).to.be.closeTo(y + menuDimensions.height, 3);
+    }));
+
+
     it('should open within bounds above (limited client rect height)', inject(
 
       function(popupMenu) {