I migrated kendo-angular-grid from 7.4.0 -> 14.2.0 and kendo-angular-menu from 4.0.3 -> 14.2.0 and observe that now the context menu sometimes causes the whole grid to shift upwards and off screen when displayed. Examples of normal behaviour (good.jpg) and corrupt behaviour (corrupt.jpg) are attached below.
If you look at the top attribute in the style applied to the kendo-popup (630px), the value is much too high. If I manually reduce it to say 200px (see corrected.jpg attached) then whole grid shifts back down to normal position.
If I console log the originalEvent.pageY value then this is value I see getting set as the top attribute value for the kendo-popup and isn't taking into account the height of the popup and whether placing it here will cause viewport overflow. Whereas when using the earlier versions of your libraries (see above), if for example the originalEvent.pageY was reported as 772, the top value for the kendo-popup was assigned a value of 317, meaning the popup would always fit in the available viewport and not overflow it.
Can you please investigate and fix.
1 Answer, 1 is accepted
Hi Murray,
Thank you for the provided screenshots.
In general, the ContextMenu popup calculates the space and decides in which direction to display. For more details check the viewport boundary detection of the Popup.
When the menu items are more and the space up and down the anchor isn't enough in both directions, such shifting might appear (to avoid cutting the options inside). What could be done is to reduce the height of the ContextMenu popup using CSS, for example:
https://stackblitz.com/edit/angular-w65kxs
Let me know how it goes or if I can assist you any further on this case.
Regards,
Martin
Progress Telerik