manolo / gwt-api-generator Goto Github PK

I have a local Polymer element on my machine that is not hosted on github.
Can I use gwt-api-generator to generate the GWT wrapper for it?

Can you please help me with generating gwt widget out of my custom web component?
I tried using
@jstype(isNative=true)
public interface MyAppElement {

@JsOverlay public static final String TAG = "mba-app";

// @JsOverlay public static final String SRC = "my-app/mba-app.html";

@JsOverlay public static final String SRC = "my-app/mba-app.html";

}

but it is unable to find my html element.

Thanks,
Gaurav

Seems like it's a very common use case to want some javascript wrapped and this should be easier.

Thinking of adding a gulp.task('starter', function(){... to gulp.js in order to create the kind of project you write about in the instructions. Namely: pom.xml, bowser.js and config for the generator.

I think that this should run off a single gwt-api-conf.js or similar and be able to generate a sample one if that doesn't exist, so you just have to fill that out.

A single file should have all the configuration needed to generate most wrapper projects.

Think I'll prototype something.

What do you think @manolo?

Everything related with a collection should be under it's unique namespace, right now there are a mess of namespaces because events go arbitrary to locations related with it's name instead of it's package.

Attached screenshots how it's currently and how it should be:

connects to vaadin/components-team-tasks#34

An example of this is iron-form, which extends the default form element.

The generated IronForm widget doesn't function properly.
It specifies an <iron-form> tag instead of <form is="iron-form">

Moreover, the get/setAction and get/setMethod are not inherited.

When you're adding widgets on the fly programmatically for the first time (ex : new PaperButton x5 in a for)
the import is imported multiple time because the href is not fully loaded between each instanciation.
urlImported.add(href); should be added directly to avoid the issue.
Maybe remove it if the script fail to load ?

public static void importHref(String hrefOrTag, final Function ok, Function err) {
if (!hrefOrTag.startsWith("http")) {
// It's a tag
if (hrefOrTag.matches("[\w-]+")) {
hrefOrTag = hrefOrTag + "/" + hrefOrTag + ".html";
}
// It's not prefixed with the bower_components convention
if (!hrefOrTag.startsWith("bower_components")) {
hrefOrTag = "bower_components/" + hrefOrTag;
}
hrefOrTag = GWT.getModuleBaseForStaticFiles() + hrefOrTag;
}
if (!urlImported.contains(hrefOrTag)) {
final String href = hrefOrTag;
importHrefImpl(href, new Function() {
public Object call(Object arg) {
// Don't update the list until the import is actually loaded
urlImported.add(href);
if (ok != null) {
ok.call(arg);
}
return null;
}
}, err);
} else if (ok != null) {
ok.call(hrefOrTag);
}
}

In the Polymer class the performance field has been introduced:
here
which makes the previously not null performance undefined. This causes an exception for example in iron-list.html where the window.performance.now() is called without checking whether the performance has a value or not.

In Polymer.java:

public static void importHref(String hrefOrTag, final Function ok, final Function err) {
    final String href = absoluteHref(hrefOrTag);
    if (!urlImported.contains(href)) {
        urlImported.add(href);
        whenPolymerLoaded(new Function() {
            public Object call(Object arg) {
                Base.importHref(href, ok, err);
                return null;
            }
        });
    }
}

The problem i see is that if urlImported already has the imported elements, the ok function is not fired, necessitating a manual check for the element (essentially isRegistered, which is private).

Or maybe i'm going about this all wrong. How do i know if a polymer element has been imported into gwt?

Reference: http://www.gwtproject.org/doc/latest/DevGuideUiBinder.html#Simple_binding

The generated Events do not extend GwtEvent, so the simple binding does not work.

I'm trying to expose AppLocalizeBehavior's localize method by introducing a custom component that I want to use on the GWT side.

I added a simple function

translate: function (language, resources, formats) {
        return this.__computeLocalize(language, resources, formats);
}

or even a simpler case with

testreturn: function () {
        return "something";
    }

However the problem is the generated code still uses void

public void translate(Object e, Object o, Object n) {
        getPolymerElement().translate(e, o, n);
    }

What am I missing here?

Example code:

// Load 
grid.getPolymerElement().addEventListener(SelectedItemsChangedEvent.NAME, event -> {
    JsArrayNumber n = grid.getSelection().selected(null, 0, 200).cast();
    if (n.length() == 1) {
        grid.getItem(n.get(0), new Function<JavaScriptObject, Object>() {
            @Override
            public JavaScriptObject call(Object arg) {
                main.load(arg);
                return null;
            }
        }, false);
    }
});

The Object arg always seems to be null, regardless of which row is selected.

The issue seems to be that getItem() should take a function with two inputs (JSFunction2 in vaadin-grid's gwt code).
function (error, item) {}

Perhaps arg is simply the "error" input? (Which would make sense, as it should be null.)

There's not currently any way to easily get a specific row's data via the generated code.

Some event comments of the paper-drawer-panel generates invalid event classes.

• paper-responsive-change
• iron-select
• iron-deselect

The problem seems the to be the hyphen at the end of the line of these comments:

* @event iron-select {{item: Object}} detail -
*     item: The panel that the event refers to.

Regards
BM

Polymer.java already implements a couple of methods from Polymer.Base, it should as well make other useful functions available in the API:

https://www.polymer-project.org/1.0/docs/devguide/utility-functions.html

In GWT we have only the Editor framework which does a correct databinding between POJOs and Widgets.

I've tried with no success Errai Databinding, to simplistic for a complex interface.

Unfortunately generated widgets are Panels, and as such they don't implement IsEditor interface, which is what the Editor framework uses for integration between generated Autobeans and Wdgets.

I would like the generator to change how it works so that we obtain Widgets compatible with it.

In case I can contribute, but I need to know if you have any suggestions for this.

Thank you.

I'm able to add elements using Polymer.dom(parentElement).appendChild(childElement), but I'm not able to remove them as Polymer.dom(parentElement).removeChild is not a valid function.

Am I missing something?

We are using polymer-bundler to import all needed elements at once. Because of that the method named whenPolymerLoaded is never called in com.vaadin.polymer.Polymer so for example the Polymer & Base will be null although we might still want to use that class which is not possible without those references.

Line 79 of Widget.template makes use of Polymer.property() but there's no import com.vaadin.polymer.Polymer;

There is a duplicate method ensureRipple in the Widget and Element class because paper-icon-button-light.html defines ensureRipple: function(var_args) and uses paper-ripple-behavior.html which defines ensureRipple: function(optTriggeringEvent)

If you use a groupId other than --groupId=com.vaadin.polymer the build will fail due to the Ant rule to clean the directory.

Since today, i've some errors while compiling
because package com.google.gwt.core.client.js does not exist anymore.

Right now it is mandatory to pass bower packages so as they are downloaded and installed before parsing them.

But it should be nice to allow parsing all packages installed by hand by the user in the current folder so as this simple procedure works:

 $ bower install gitusername/mypolymerelement
 $ gwt-api-generator

Hi,
Is it possible to generate gwt-api for vaadin/charts-component ?
Because when I did it there is no error, but for example the VChart class is nearly empty.

Regards.

PaperSlider has setMin(double), setMin(String), setMax(double), setMax(String) but only setValue(String)

The cause is that paper-slider extends two behaviors and each one has one signature, we should produce signature for both: https://elements.polymer-project.org/elements/iron-form-element-behavior?active=Polymer.IronFormElementBehavior and https://elements.polymer-project.org/elements/iron-range-behavior?active=Polymer.IronRangeBehavior

Due to project rename of Hydrolysis to Polymer-Analyzer the dependency path has to be changed to:
"hydrolysis": "git://github.com/Polymer/polymer-analyzer#v1.22.0",

With the newest version (1.24.1) the generator does not work.

The signature for the getter / setter of selected has been changed from Stringto Object
But there ist still a method setSelected(String) doing
getPolymerElement().setAttribute("selected", value);
instead of
getPolymerElement().setSelected(value);

This can cause wrong behave if the menu should have no selection with:
setSelected(null)

Moved from Trello (contains no extra information): https://trello.com/c/DzGAafZK/95-support-for-methods-with-js-function-parameters

With the gwt-api-generator I generated the source for PolymerElements:
gwt-api-generator --package=PolymerElements/paper-elements

After generating I tryied to compile it, but there was on some parts not valid Java code generaded. For example in the class IronOverlayClosedEvent.java on line 37:

@JsProperty JavaScriptObject getEvent.detail();

In Vaadin the tkPid is used to store the connectorId on an element but this has been removed when the saveProperties method is called. If a layout phase is in progress around these elements then Vaadin is not able to retrieve the corresponding Connector which leads to exceptions.

A possible solution could be that the saveProperties ignores the tkPid as well which is anyway a "final" property.

Declarative event handlers inside a "dom-repeat" add the model object to the event. If we make the model available on the elemental.Event then it is possible to get the data from the item when an event is fired.

@JsType(isNative=true, namespace=GLOBAL)
public interface Event {
     ....

    @JsProperty TemplateInstance getModel();

    @JsType(isNative=true, namespace=GLOBAL)
    public interface TemplateInstance {
        @JsProperty <T> T getItem();
    }
}

Example:
So if the "dom-repeat" template contains an event handler (a.e. <paper-button on-tap="onTapFct">) then we get the binded data on each event.

Polymer.function(bindTemplate, "onTapFct", event -> {
    Foo foo = ((Event) event).getModel().getItem();
});

final List<Foo> data = createData();
repeatTemplate.setItems(Polymer.asJsArray(data));

I installed following Polymer components

"dependencies": {
"google-drive": "GoogleWebcomponents/google-drive#^1.0.1",
"google-apis": "GoogleWebcomponents/google-apis#^1.1.5",
"google-signin": "GoogleWebcomponents/google-signin#^1.3.3",
"vaadin-grid": "vaadin/vaadin-grid#1.0.0",
"vaadin-combo-box": "vaadin/vaadin-combo-box#1.0.0",
"paper-elements": "PolymerElements/paper-elements#^1.0.7",
"iron-elements": "PolymerElements/iron-elements#^1.0.10",
"neon-elements": "PolymerElements/neon-elements#^1.0.0",
"vaadin-icons": "vaadin/vaadin-icons#1.0.0"
}

gwt-api-generator --pom
mvn package

bunch of errors ...

[INFO] -------------------------------------------------------------
[ERROR] COMPILATION ERROR : 
[INFO] -------------------------------------------------------------
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.EventHandler.java:[13,80] '{' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.EventHandler.java:[15,74] '(' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.EventHandler.java:[15,150] = expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[23,80] '{' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/PaperButton.java:[574,97] ';' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/PaperButton.java:[574,98] invalid method declaration; return type required
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[19,76] '{' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[19,162] > expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[19,175] '(' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[21,5] illegal start of expression
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[21,12] illegal start of expression
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[21,23] ';' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[21,101] illegal start of expression
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[21,106] illegal start of expression
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[21,107] ';' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[21,116] not a statement
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[21,193] ';' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[22,107] not a statement
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[22,112] ';' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[22,188] ';' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[25,5] illegal start of expression
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[25,82] ';' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[28,5] illegal start of expression
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[28,111] ';' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[32,5] illegal start of expression
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[32,15] illegal start of expression
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[32,28] ';' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[32,112] ';' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[33,82] <identifier> expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[36,5] illegal start of expression
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[36,127] ';' expected
[ERROR] /home/koen/workspace/asics/gwt-api-generator/src/main/java/com/vaadin/polymer/paper/widget/event/TransitionendEventparamnodeObjectdetailContainstheanimatednode.Event.java:[41,2] reached end of file while parsing
[INFO] 32 errors 

I'm trying to use the generator to build google-chart:
https://github.com/GoogleWebComponents/google-chart

The error:

[INFO] -------------------------------------------------------------
[ERROR] COMPILATION ERROR :
[INFO] -------------------------------------------------------------
[ERROR] /D:/vgpe/src/main/java/com/vaadin/polymer/google/widget/event/GoogleChartSelectEvent.java:[46,12] cannot find symbol
  symbol:   class JsArray
  location: class com.vaadin.polymer.google.widget.event.GoogleChartSelectEvent
[ERROR] /D:/vgpe/src/main/java/com/vaadin/polymer/google/event/GoogleChartSelectEvent.java:[37,21] cannot find symbol
  symbol:   class JsArray
  location: interface com.vaadin.polymer.google.event.GoogleChartSelectEvent.Detail
[INFO] 2 errors
[INFO] -------------------------------------------------------------
[INFO] ------------------------------------------------------------------------
[INFO] BUILD FAILURE
[INFO] ------------------------------------------------------------------------
[INFO] Total time: 14.417 s
[INFO] Finished at: 2016-01-25T11:39:03-05:00
[INFO] Final Memory: 21M/244M
[INFO] ------------------------------------------------------------------------
[ERROR] Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.1:compile (default-compile) on project vaadin-gwt-polymer-elements: Compilation failure: Compilation failure:
[ERROR] /D:/vgpe/src/main/java/com/vaadin/polymer/google/widget/event/GoogleChartSelectEvent.java:[46,12] cannot find symbol
[ERROR] symbol:   class JsArray
[ERROR] location: class com.vaadin.polymer.google.widget.event.GoogleChartSelectEvent
[ERROR] /D:/vgpe/src/main/java/com/vaadin/polymer/google/event/GoogleChartSelectEvent.java:[37,21] cannot find symbol
[ERROR] symbol:   class JsArray
[ERROR] location: interface com.vaadin.polymer.google.event.GoogleChartSelectEvent.Detail
[ERROR] -> [Help 1]
[ERROR]

Hi, This is not an issue ... maybe a brainstorming discussion ;)
There is a while from now that I'm looking for the best and long term approach to integrate Polymer with GWT.

I used a lot GWT 2.5 and 2.6 for b2b projects in the past. I followed GWT evolutions, GWT3.0 anticipation projects like The Herald Pehl (from Red Hat) conference at the GWTcon 2016 and WebComponents and Polymer integration initiatives like WeTheInternet/gwtc, and this awesome gwt-api-generator which can be a really source of inspiration.
But I have to confess that, due to many reasons (Obscure GWT roadmap, HTML5 APIs evolutions and too much partials support), I was sure that many of theses initiatives would be deprecated quickly.
And I understand developers and companies reviewing their point of view on GWT usage because of the lacks (for me) of a strong LTS right way and manner to evolve with GWT today.

I'm always convinced by GWT for middle and strong LTS projects. Java8, J2CL, enhance that. And I'm sure that a combination based on the couple GWT/Polymer is the right way for a reliable and new generation UI application. The Polymer project make the exclusion of the widgets API out of GWT a really good thing for UIs.

But for now what is the situation ? If we want to start a development today, what is the right way to proceed for Polymer integration ?
It is mentioned in the README.md that "Vaadin no longer provides support (...) We took this decision because once demonstrated that polymer elements could be easily be integrated in GWT".
Yes It's true. But I did not find on the web any prettier or better alternatives to integrate and manipulate easily Polymer Elements from a GWT application.

So today, If we want to be GWT3 pseudo-compliant (no UiBinder) with a UI based on Polymer 2.0, and builds based or more recent build tools (migration from bower to npm or yarn) what we can use for a LTS GWT app ?

Does we have to continue integration of the gwt-api-generator ? What is the status for Polymer 2.0 ?
Does an API generator stays a good solution for future (due to the elements quantity and the different cases to manage) ?
Do you think that create a fork or start a from scratch project based on elemental2 (in beta at this time) would be a good idea ?

Or, in the state of things and taking into account the Polymer Elements evolution philosophy, does the idea of keeping out Polymer 2.0 (static import) from a GWT app and just communicate through a JSInterop API with separated or combined toolchains would be THE solution to have a reliable application, to avoid DRY code, and keep UI detach from the core of an app ?

Thanks for your advises.

We need a way to pass interfaces from java to javascript and viceversa.

We can use Polymer behavior syntax to generate JsInterop type interfaces and then check those in method arguments and return types

We are looking for collaborators to work on this project. If you want to become a collaborator, please leave a comment below.

Collaborator responsibilities include:

• Responding to issues
• Reviewing and merging pull requests
• Development contributions: add features, fix bugs

Having several polymer components that extend each other in the same folder, the TAG and SRC string do get mixed up:

example i have the following hirachy a folder bower_components/payolution-date-picker:

• i have a custom date picker element called payolution-birthday-date-picker which inherits
• a payolution-date-picker element which again inherits three other custom sub elements

the public static final String SRC of all generated java classes point to payolution-date-picker/payolution-birthday-datepicker.html

For example, when polymerelements/paper-button is installed,

import com.vaadin.components.gwt.polymer.client.widget.event.*;

is added, even though no widget/event classes are generated.

The import should be ignored in the widget templates if there are no widget events.

My problem is that because the existingJsArray is defined as JsArray<T extends JavaScriptObject> extends JavaScriptObject, it is enforcing too harsh a restriction the items stored in the array. I don't want to define my class as extending JavaScriptObject as this is a deprecated API and would prefer my @JsType annotated classes not to have all the restrictions imposed by the compiler.

I propose creating a JsArrayNative type that is included in this generator project which would work as an expected javascript array without any of the restrictions of JsArray. I didn't want to just go ahead and create this and submit a pull request if this is not the preferred approach of dealing with this. Obviously this would be a breaking API change to the generator.

What are your thoughts?

In the compilation result of paper-elements, PaperSliderElement extends two interfaces that both declare the same method but with differing return types. This doesn't compile in Java.

Support as a pre-built package for Polymer Platinum Elements, specially the Service worker platinum-sw.