Overlay Widget Jump Stutter

  $(window).on('dialog:aftercreate', function (event, dialog, $dialog) {
    if ($dialog[0].id.indexOf('lpb-dialog-') === 0) {
      clearInterval(lpDialogInterval);
      lpDialogInterval = setInterval(repositionDialog.bind(null, lpDialogInterval), 500);
    }
  });

Shouldn't we be removing this whole block of code? If we remove the line lpDialogInterval = setInterval(repositionDialog.bind(null, lpDialogInterval), 500); isn't all the rest of the above code pointless?

Facing the same issue. #9 doesn't seem to affect the behaviour.

While I agree that removing the setInterval call here:

lpDialogInterval = setInterval(repositionDialog.bind(null, lpDialogInterval), 500);

will correct the stuttering behavior, it doesn't address the need to reposition the dialog when its height changes (see https://www.drupal.org/project/layout_paragraphs/issues/3252978 → and https://stackoverflow.com/questions/5456298/refresh-jquery-ui-dialog-pos...).

We had some logic that used to test for whether the dialog height had changed but that logic was removed in commit b95cccc3.

In a moment I'll add a patch that only repositions when the height of the dialog has changed (while maintaining the logic that handles multiple dialogs).

Patch attached.

The last submitted patch, 19: layout_paragraphs-overlay_widget_jump_stutter-3276258-19.patch, failed testing. View results →

Updated my patch; revised patch attached.

#21 works much better than #9 for me - I can now scroll again

If you use a media library and this overlay opens, i.e. via the paragraph overlay (or replaces it), then it will not be re-aligned in size and you cannot scroll. I don't know if that plays a role here at the moment. For me the overlay is too big after adding the image.

#21 does stop the jumping back to the top on scroll, but it doesn't keep the modal within the viewport. So the issue with #21 is on long pages with the edit dialog open, one could lose where the dialog is open/visible if they scroll too far above or below it.

Found the problem for my particular issue. My issue was resolved by setting the configuration on /admin/config/content/layout_paragraphs/modal-settings. Specifically I set: width to 90%; height to auto; and checked the "Modal autoresize" option.

We are using #21 for a long time on few big customer websites

Here's the patch attached of the current PR