Skip to content

[dialog] Drag-resize issues when content of the dialog is an iframe #740

Open
@jtreml

Description

@jtreml

Issue 1:
When the content of a dialog is an iframe, if you try to resize more or less quickly and thus the mouse enters the iframe area while resizing, the resizing is interrupted/frozen.

Issue 2: If the above happens and you then release the mouse button while over the iframe, once you leave the iframe the resizing will continue even though you're no longer holding the mouse button down.

Originally found using Java/Flow, but confirmed to be the case also with pure client-side Dialog.
Pre-Flow Vaadin 8 Window doesn't suffer from the same issue.

resizing

      <vaadin-dialog id="dialog" modeless draggable resizable></vaadin-dialog>
      <vaadin-button id="button">Show dialog</vaadin-button>
      ready() {
        super.ready();

        const dialog = this.$.dialog;
        dialog.renderer = function(root, dialog) {
          const el = document.createElement('iframe');
          el.setAttribute('src', 'https://www.google.com');
          root.appendChild(el);
        };

        this.$.button.addEventListener('click', function() {
          dialog.opened = true;
        });
      }

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions