New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Typescript definitions for vertx3-eventbus-client #61

Open
oddeirik opened this Issue Dec 1, 2016 · 19 comments

Comments

7 participants
@oddeirik
Copy link

oddeirik commented Dec 1, 2016

I'm currently using vertx3-eventbus-client in a web client application to communicate with a Java application via the EventBus.

The web client is written in Typescript, but there's no definition file for the eventbus client. Currently I've worked around this by simply adding vertx-eventbus.js and sockjs.js as <script> sources in the index file and then doing declare var EventBus: any; in Typescript source files that need it. That makes the Typescript compiler happy, but not the developer since you don't get any of the actual useful stuff like type checking, auto-completion, etc. 😄

I'm not sure whether this issue is something that would relate to npm-client or vertx-web, since the latter is what actually generates vertx-eventbus.js (?).

@pmlopes

This comment has been minimized.

Copy link
Member

pmlopes commented Dec 1, 2016

@oddeirik Could you provide a pull request for it?

@oddeirik

This comment has been minimized.

Copy link

oddeirik commented Dec 1, 2016

I'm completely new to Typescript myself, but I could certainly give it a try!

@tombensve

This comment has been minimized.

Copy link

tombensve commented Feb 8, 2017

I did the following, but it took me a while to figure it out:

import EventBus from 'vertx3-eventbus-client';
let eventBus = EventBus("http://locahost:8080/eventbus", {});

The transpiled JS looks like this:
var vertx3_eventbus_client_1 = require("vertx3-eventbus-client");
var eventBus = vertx3_eventbus_client_1.default("http://locahost:8080/eventbus", {});

I first tried doing new EventBus(...), but that failed! This seems to work. It is trying to access the specified URL at least. I haven't made the server code yet so I haven't fully verified it yet.

Doing a browserify however make this code fail! I assume it is because vertx3-eventbus-client is not a correct node module, and browserify works with node modules. After browserify the EventBus(...) call produces and error saying that EventBus is not a function.

@neal-eiger

This comment has been minimized.

Copy link

neal-eiger commented Apr 19, 2017

I also am trying to use vertx3-eventbus-client (with an angular 4 app). I used version 2 fine when included via script tag on index.html, but vertx3 does not work via es6 style import when using webpack. I haven't yet tried using vertx3 the old way via including non transpiled via script tag directly from an html page bc want to use with import.

import EventBus from 'vertx3-eventbus-client';
let eventBus = new EventBus("http://locahost/eventbus"); // d.default is not a constructor
let eventBus = EventBus("http://locahost/eventbus"); // d.default is not a function

The webpack transpiled code shows that d is in fact a variable (and not a function). I also checked and the real constructor is not being invoked. The version of sockjs-client vertx3 is using under its local node_module directory looks usual but i checked the version being loaded and it is 1.03 as intended.

It would be great if someone has a suggestion else maybe ill figure it out, seems may not be packaged correctly as stated above.

@pmlopes

This comment has been minimized.

Copy link
Member

pmlopes commented Apr 19, 2017

@neal-eiger can you provide a reproducer?

@neal-eiger

This comment has been minimized.

Copy link

neal-eiger commented Apr 20, 2017

Just to update, I read this which echoes what's been said in this thread: if you include vertx-eventbus.js script directly on the page it works (as well as declaring the type for typescript), but it doesnt work if you try and import it into the bundle and that's a shame. Will follow up later.
https://tombensve.github.io/typescript/solution/vertx3/2017/02/10/Using_vertx3-eventbus-client__and_other_JS_code__from_Typescript..html

@neal-eiger

This comment has been minimized.

Copy link

neal-eiger commented Apr 21, 2017

Hi @pmlopes, I forked a little repo and added vertx3-eventbus-client and you can can see the error. Please clone or fork https://github.com/neal-eiger/angular-webpack, npm i && npm start. Go to localhost:8080 and look at the console. You will find this error:

Unhandled Promise rejection: vertx3_eventbus_client_1.EventBus is not a constructor ; Zone: ; Task: Promise.then ; Value: TypeError: vertx3_eventbus_client_1.EventBus is not a constructor

Would be great if you could suggest the fix. You can also comment out the 2 vertx eventbus related lines I added into src/app/app.component.ts and you will see the app runs fine again.

@pmlopes

This comment has been minimized.

Copy link
Member

pmlopes commented Apr 21, 2017

@neal-eiger @tombensve you're importing the module not correctly.

The original module exports a single function, not a object so in order to import it correctly you should do:

import * as EventBus from 'vertx3-eventbus-client';
@neal-eiger

This comment has been minimized.

Copy link

neal-eiger commented Apr 21, 2017

Thanks! Thought I tried that as I use that import syntax with momentjs, however appears not. It may be worth making a note in your readme as a number of others seem to have had the same issue. Have a good weekend and thanks again.

@tombensve

This comment has been minimized.

Copy link

tombensve commented Apr 22, 2017

Interesting! I've been away from my "hobby project" for a while. I'll give this a try. Thanks.

@mikeagarza

This comment has been minimized.

Copy link

mikeagarza commented May 4, 2017

I ran across this TypeScript version of the EventBus the other day: https://gist.github.com/benorama/93373c3c1c3574732d6cc1b4754aab9f

@oddeirik

This comment has been minimized.

Copy link

oddeirik commented May 19, 2017

I added the definitions as a PR to the DefinitelyTyped project, and it has now been merged. So anyone using the EventBus bridge in a Typescript project should now be able to just add @types/vertx3-eventbus-client as a dependency:

npm install --save @types/vertx3-eventbus-client
(https://www.npmjs.com/package/@types/vertx3-eventbus-client)

Ideally, I'd like to see "official" typings (or even better, a Typescript version, similar to what's done in the gist above) from the Vertx team, but this works well enough for me at the moment, so I'd rather they focus their efforts on the JVM side of things 😄

@pmlopes

This comment has been minimized.

Copy link
Member

pmlopes commented May 19, 2017

I'm not sure if a port to TypeScript would make it better but i believe that we could work on getting the JS code to play better with both typescript type definitions or other typing systems out there such as flow.

This way we could have the same base for browser, server, typescript and ES6+

@oddeirik

This comment has been minimized.

Copy link

oddeirik commented May 19, 2017

Absolutely, that would be good! I wasn't implying that a TS version would be better, just that this would give us typings for "free".

@kalpsnuti

This comment has been minimized.

Copy link

kalpsnuti commented Jun 13, 2017

Can ES6 Version of EventBus be of an use?

@tombensve

This comment has been minimized.

Copy link

tombensve commented Aug 13, 2017

I tried the "https://gist.github.com/benorama/93373c3c1c3574732d6cc1b4754aab9f" posted by mikeagarza. This one works perfectly from Typescript, probably due to it being written in Typescript :-)

@SanthoshKumarKatta

This comment has been minimized.

Copy link

SanthoshKumarKatta commented Oct 8, 2018

Hi,

eb.send always getting null. The connection was established and Service returned one JSON object.

var eb = new EventBus('http://localhost:40400/test');
eb.onopen = function () {
console.log('eb.onopen start.');
eb.send('MY_SERVICE',OBJ, function (reply) {
console.log("receive message: " + JSON.stringify(reply)); // This is getting null always//
});

I'm using - Angular (vertx3-eventbus-client) and Java Vertx. Please help me in fixing this.

Thanks,
Santhosh Katta

@pmlopes

This comment has been minimized.

Copy link
Member

pmlopes commented Oct 8, 2018

@SanthoshKumarKatta your callback should follow the node style:

function (error, reply) {
  ...
}
@SanthoshKumarKatta

This comment has been minimized.

Copy link

SanthoshKumarKatta commented Oct 31, 2018

Can anyone suggest on writing Observables using EventBus in Angular? Tried many ways to do this and failing. I'm having a very hard time to do this.

Thanks in advance!

Here is my Service.

export class Login {

res: any = {};
login(user: any): Observable{
var eb = new EventBus('http://localhost:40400/test');
eb.enableReconnect(true);
eb.onopen = function () {
};
eb.enableReconnect(true);
return eb.send(s.test, user, (error, reply) => {
console.log("reply:"+ JSON.stringify(reply));
this.res = reply;
// observer.next(this.res);
}).map((res: Response) => res.json());
// return Observable.create(observer => {
// console.log("this.res:" + JSON.stringify(this.res));
// observer.next(this.res);
// })
}
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment