error occurs in IE11 and edge when connection is closed

[houyaowei]

Environment: React 16.2, webpack 4.10, sockette 2.0.0

in the react lifecycle method componentWillUnmount method, I will close the socket instance , the error occurs ,

the code blow

error blow

when I add annotation to the ws close method , it get ok,

How can I fix this problem , thx.

[lukeed]

How are you constructing the Sockette instance? Are you using new Sockette(...)? Are you experiencing the same issue on other browsers, or is it only IE11?

Thanks!

[houyaowei]

I use Sockette with npm package
the code like blow:

`import Sockette from "sockette";

this.ws = new Sockette(url, {
timeout: 100,
maxAttempts: 10,
},
onmessage: e => { },
onmaximum: e => {
that.ws.reconnect;
},
onerror: e => { },
onclose: e => {},
onreconnect: e => { }
});
`
the errors orrcured on the IE11 and Edge, other browsers(Chrome, Firefox, Opera) work fine.

Thanks!

[lukeed]

@houyaowei Try this:

this.ws ? this.ws.close(1000) : null

---

Unrelated, but when the opts.maximum is reached, Sockette quits. If you want to restart it, you need to call open and not reconnect because open starts the series whereas reconnect is a single attempt.

onmaximum: e => {
-  that.ws.reconnect;
+ this.ws.open();
},

[elliotaplant]

@lukeed I know this issue is closed, but it seems a bit concerning that the default close .close() call throws an error in IE. Also, MDN states that specifying any code except 1000 and 3000 is illegal (in FireFox): https://developer.mozilla.org/en-US/docs/Web/API/CloseEvent#Status_codes.

Could we make it so that the .close() method simply passes along its args to the native .close() method?

...
$.close = ws.close;
...

[lukeed]

@elliotaplant Thanks, this actually matches what I had thought initially, but I changed it to 1005 at the last second. Can you re-verify for me that sending code 1000 on close works on IE and your copy of Firefox? (I don't have access to any IE)

Thanks!

[elliotaplant]

I can verify that tomorrow!

[elliotaplant]

Sending ws.close(1000) Works on IE and Firefox for me!

I'm pretty busy right now but I could make a PR for this in January.

If you want to make the change, I think it would just be:

// src/index.js
...
-  $.close = function (x, y) {
-    ws.close(x || 1005, y);
-  };
+  $.close = ws.close
...

[lukeed]

Awesome, thank you 🙇

It cannot be your suggestion because the internal ws changes over any given Sockette instance's lifespan. After all, the purpose of Sockette is to swap out & setup new WebSocket instances without your concern.

Plus, ws isn't defined until $.open() is called, whereas $.close = ws.close would run (and $ returned) instantly