vaadin / designer

Public repository for Vaadin Designer
https://vaadin.com/designer
15 stars 3 forks source link

Designer paper can be set to invalid state by draggin sub components of vaadin-login-form #2264

Open johannesh2 opened 4 years ago

johannesh2 commented 4 years ago

Steps to reproduce

With the attached layout it is possible to drag-and-drop sub-components of the vaadin-login-form. Designer is visually broken after dnd operations. Refreshing returns the correct rendering.

IDE, Designer and OS version

Designer 4.4.1, Windows 10, Designer in Chrome

File

import { PolymerElement } from "@polymer/polymer/polymer-element.js";
import { html } from "@polymer/polymer/lib/utils/html-tag.js";
import "@vaadin/vaadin-lumo-styles/all-imports.js";
import '@vaadin/vaadin-login/src/vaadin-login-form.js';

class LoginView extends PolymerElement {
  static get template() {
    return html`
<style include="shared-styles lumo-badge lumo-typography">
        :host {
          background-color: var(--lumo-contrast-10pct);
          display: block;
          height: 100%;
          overflow: auto;
        }

        .card {
          border-radius: var(--lumo-border-radius);
          box-shadow: var(--lumo-box-shadow-m);
          margin: var(--lumo-space-l) auto;
          overflow: hidden;
          width: calc(var(--lumo-size-m) * 10);
        }

        .brand {
          background-color: var(--lumo-primary-color);
          box-sizing: border-box;
          display: flex;
          flex-direction: column;
          justify-content: flex-end;
          min-height: calc(var(--lumo-size-m) * 5);
          padding: var(--lumo-space-l);
        }

        h1 {
          color: var(--lumo-primary-contrast-color);
          margin: 0;
        }

        span {
          color: var(--lumo-tint-70pct);
        }

        vaadin-login-form {
          display: flex;
        }
      </style>
<div class="card">
 <div class="brand">
  <h1>App name</h1>
  <span>Application description</span>
 </div>
 <vaadin-login-form></vaadin-login-form>
</div>
`;
  }

  static get is() {
    return "login-view";
  }

  static get properties() {
    return {
      // Declare your properties here.
    };
  }
}

customElements.define(LoginView.is, LoginView);
stale[bot] commented 3 years ago

Hello there!

It looks like this issue hasn't progressed lately. There are so many issues that we just can't deal them all within a reasonable timeframe.

There are a few things you could help to get things rolling on this issue (this is an automated message, so expect that some of these are already in use):

Thanks again for your contributions! Even though we haven't been able to get this issue fixed, we hope you to report your findings and enhancement ideas in the future too!