diff --git a/lib/features/context-pad/ContextPadProvider.js b/lib/features/context-pad/ContextPadProvider.js index 1536ae48..b7ecd2d9 100644 --- a/lib/features/context-pad/ContextPadProvider.js +++ b/lib/features/context-pad/ContextPadProvider.js @@ -77,9 +77,10 @@ ContextPadProvider.prototype.getContextPadEntries = function(element) { padRect = pad.getBoundingClientRect(); var top = padRect.top - diagramRect.top; + var left = padRect.left - diagramRect.left; var pos = { - x: padRect.left, + x: left, y: top + padRect.height + Y_OFFSET }; diff --git a/test/spec/features/context-pad/ContextPadProviderSpec.js b/test/spec/features/context-pad/ContextPadProviderSpec.js index 6ede5dc9..7f3b83fa 100644 --- a/test/spec/features/context-pad/ContextPadProviderSpec.js +++ b/test/spec/features/context-pad/ContextPadProviderSpec.js @@ -28,4 +28,35 @@ describe('features - context-pad', function() { })); }); + + + describe('should show chooser/replace menu in the correct position ', function() { + + it('for a diagram element', inject(function(elementRegistry, eventBus, contextPad, popupMenu) { + + // given + var text = document.createElement("SPAN"); + text.innerText = "Pushing the canvas a bit to the right"; + document.body.insertBefore(text, document.body.firstChild); + TestHelper.insertCSS('diagram.css', 'div[class=test-container]{display: inline-block;}'); + + var element = elementRegistry.get('StartEvent_1'); + var replaceMenuRect; + var padMenuRect; + + // when + eventBus.on('contextPad.open', function(event) { + event.current.entries.replace.action.click(null, element); + replaceMenuRect = popupMenu._instances['replace-menu']._container.getBoundingClientRect(); + padMenuRect = contextPad.getPad(element).html.getBoundingClientRect(); + }); + eventBus.fire('element.click', { element: element }); + + + // then + expect(replaceMenuRect.left).not. + toBeGreaterThan(padMenuRect.left); + })); + }); + });