Need to update the position of edit dropdown menu while zooming out/in in the canvas

This seems closely related to 🐛 The XB annotations and labels should not change size when zooming Needs work , so adding to https://contribkanban.com/board/experience_builder!

I think i know a better solution that this.Assigning it to myself.

I have added my simple solution into a separate MR 3473222-zoomadjusted-contextual-position.Marking it needs review to get other's opinion about the 2 different solutions.@gauravvvv if you think that mine solution is considerable then it would be great to close one of the 2 MR's.Thanks!

bnjmnm → closed merge request !309

bnjmnm → reopened merge request !309

bnjmnm → closed merge request !309

Closed the first MR in favor of the newer solution

Will need tests. We have https://github.com/dmtrKovalenko/cypress-real-events running which I recommend using for the right clicks.

The test can probably compare pointer coordinates to the menu coordinates and allow for a certain range of difference since the location might not be 100% consistent.

If pointer coordinates seems too flaky, the distance from a specific corner of the component with the menu might work. Even just confirming the menu top left corner is inside the component dimensions could work. Pick your fave.

I know that the tests are failing which means solution might not be correct, I'll try to figure out the solution as i think the tests are correct according to my little knowledge of writing cypress tests.

This is now ready for review as this now has test coverages as well.Marking it NR.

See MR

MR comment addressed along with what we discussed, please review.

What we have done assuming to remove test case mentioned by @balintbrews in the current MR is working on my local environment but the same is not working/passing the test on GitHub - so in short we cannot move ahead with this approach.

I tried to assert contextualMenuRect.left = clickEvent.pageX + iframeRect.left but this calculation is not working - note that clickEvent.pageX is returning left position relative to the iframe where the mouse was clicked so adding iframeRect.left + clickEvent.pageX, that should be equal to contextualMenuRect.left(as contextual menu is being appended to main viewport). I did same for top position as well using contextualMenuRect.top = clickEvent.pageY + iframeRect.top but no luck.

Apart from above I tried few more ways around it but no luck.

Responded to my own feedback and got the tests passing

Unfortunately the file ui/src/features/layout/preview/RightClickMenu.tsx is about to be deleted in 🌱 [Proposal] A different approach to the iFrame preview interactions Active which will remove the fix added here. However I think the test still has merit. I've marked this as postponed pending 🌱 [Proposal] A different approach to the iFrame preview interactions Active being merged at which point the test should be added to ensure the new solution still works!

Fixed in 🌱 [Proposal] A different approach to the iFrame preview interactions Active . Contextual menu now opens in the correct place and is automatically closed on zooming or panning the canvas.

@jessebaker can we get credit for the issue creation? or a different issue MR is fixing this issue.

wim leers → closed merge request !336

MR closed.

@shyam_bhatt: credited you :)

bnjmnm → reopened merge request !336

The reported bug was addressed in another issue, but the test is worth keeping to ensure this does not regress. Remove the changes to RightClickMenu but keep the test

If we do want to keep the test from this MR, the test needs to be almost totally re-written since 🌱 [Proposal] A different approach to the iFrame preview interactions Active landed.

The new contextMenu (since the iFrame overlay was implemented) uses the Radix ContextMenu component which handles the positioning of the menu internally (and one would assume they have tests for this already). It's rendered a level above the one where the canvas is scaled.

However we should ensure that a future refactor/code change doesn't suddenly render the contextMenu at "the wrong level" such that it becomes affected by the scaling so there is a valid case to still implement a test here.