Polymer dependencies

Hello everyone, I know that maybe it is not the best place to ask this, but I am not able to solve the problem … I am making an application for a project and I am using vaadin design to create the different interfaces. As the documentation says, it is necessary to have the polymer dependencies to access the viewport, which is why I installed the polymer dependencies, but for some reason I am not able to make it work properly …
That is why I would like to know if anyone knows which dependencies should be installed to work properly.
Thanks in advance!

Hi,

could your post your template file? Also, have you started your project from a downloaded starter at https://vaadin.com/start/latest?

For example, I have a simple CustomDiv.js file and Polymer definitions there are :

import {PolymerElement,html} from '@polymer/polymer/polymer-element.js';

, which are located in the top of the file.
As an example this is the whole file :

import {PolymerElement,html} from '@polymer/polymer/polymer-element.js';
import '@polymer/paper-input/paper-input.js';

class CustomDiv extends PolymerElement {

    static get template() {
        return html`
        <style>
            .displayColumn {
                display: flex;
                flex-direction: column;
                background-color: antiquewhite;
            }
        </style>
            <div id="customDivContainer" class="displayColumn">
                <paper-input id="inputId" label="Put your name here!"></paper-input>
                <button style="width:120px" on-click="handleClick">Alert the name!</button>
            </div>`;
    }

    static get is() {
        return 'custom-div';
    }
    handleClick(){
        alert(this.$.inputId.value)
    }
}
customElements.define(CustomDiv.is, CustomDiv);

What is the issue you are having? Any errors in console? Have you created a Design file using Designer tool? And if so, have you used utility of a IDE?

Hi,

First of all, thanks for answering!

The image of my template can be found in the attached image (template.png).

Instead of using that link, I used the option to create a vaadin project directly from Eclipse. Could this be the problem?

The main issue is that I can add more designs, fallowing the steps that appears in the documentation of Vaadin Designer, but I am not able to see the palette view that allows me to drag and drop the components. And as I don’t have any kind of console error, I can execute the project and see the design made in the main view without problems.

18103568.png

This should not be a problem :slight_smile:

Your template seems fine, but you are not defining any content. (So your html part contains only styles definition and no other tags, thus it will be empty) Could you check in your browser DevTools, is there a <interfaz-pilotos> element on a page?

That’s right, the template is empty because I haven’t introduced anything in it yet. And yes, I can see the page from my browser’s developer tools, so I can access it.

But, I still can’t see this (attached image of the vaadin documentation), which is what I’m interested in being able to see
18103691.png