pladaria / reconnecting-websocket

Reconnecting WebSocket. For Web, React Native, cli (Node.js)
MIT License
1.22k stars 197 forks source link

[Release 4.1.0]: TS type checking fails | data property missing from Event. #77

Closed stonecauldron closed 6 years ago

stonecauldron commented 6 years ago

Hello,

We've recently updated our version of reconnecting-websocket to 4.1.0 and we are having problems with type checking. Code that passed the static type check is now failing.

Here is a sample of the code that is failing:

socket.addEventListener('message', event => {
  ...
  console.log(event.data); // accessing data generates a type error
}

The error states: Property 'data' does not exist on type 'Event | CloseEvent | MessageEvent'. Property 'data' does not exist on type 'Event'.

This I Imagine is due to the fact that Event does not have any data property and the static type checker wants to prevent type errors when event is of type Event and not MessageEvent.

As such I solved the issue by putting a type guard ensuring that event is of type MessageEvent e.g.:

socket.addEventListener('message', event => {
  ...
  if (event instanceof MessageEvent) {
    console.log(event.data); // there is no longer an error here
  }
}

My questions are:

  1. Was this the correct way to solve this problem? Or is there a better way?
  2. What change in the update triggered this issue?

Thank you for your time.

pladaria commented 6 years ago

Hi, thanks for reporting

This should work:

ws.addEventListener("message", (e: MessageEvent) => {
  console.log(e.data);
});

I've released a new version with stricter type checks, please let me know if you find any problems

stonecauldron commented 6 years ago

Perfect, thank you for taking care of the problem so quickly 👍

I'll report back if I find any issue with this new release.

stonecauldron commented 6 years ago

Hi,

Unfortunately it seems I'm still having problems with the new release, namely now the type checker is complaining about the event listeners having events with an implicit any typing e.g.

this.socket.addEventListener('error', err => { // error TS7006: Parameter 'event' implicitly has an 'any' type.
...
}

this.socket.addEventListener('message', event => { // error TS7006: Parameter 'event' implicitly has an 'any' 
...
}

I can fix the error on the 'message' event listener by explicitly typing event to MessageEvent but doing the same for err—typing it as ErrorEvent—does not work. Do you know how to fix this?

Thank you for your time.

pladaria commented 6 years ago

Hi,

Please update to latest version. You can now import required types

import RWS, { Event, ErrorEvent, CloseEvent } from "reconnecting-websocket";

const rws = new RWS("wss://example.com");

rws.addEventListener("error", (e: ErrorEvent) => {
  console.log(e);
});

rws.addEventListener("message", (e: MessageEvent) => {
  console.log(e);
});

rws.addEventListener("open", (e: Event) => {
  console.log(e);
});

rws.addEventListener("close", (e: CloseEvent) => {
  console.log(e);
});

Note that you don't need to import MessageEvent (it uses TS definition of it)