Fix Secure API hangs (#3927)

* Use proxy for WS in dev

* Update SecureAPI

* Update webpack config

* Fix dev contract

* Update webpack

* Linting fixes

* Refactor Secure API logic : Promise based, no wastes of req

* Fix tests

* Add try 'intitial' token

js/src/api/transport/ws/ws.js

@@ -22,7 +22,7 @@ import TransportError from '../error';
 
 /* global WebSocket */
 export default class Ws extends JsonRpcBase {
-  constructor (url, token) {
+  constructor (url, token, connect = true) {
     super();
 
     this._url = url;
@@ -32,23 +32,34 @@ export default class Ws extends JsonRpcBase {
     this._connecting = false;
     this._connected = false;
     this._lastError = null;
-    this._autoConnect = true;
+    this._autoConnect = false;
     this._retries = 0;
     this._reconnectTimeoutId = null;
 
-    this._connect();
+    this._connectPromise = null;
+    this._connectPromiseFunctions = {};
+
+    if (connect) {
+      this.connect();
+    }
   }
 
-  updateToken (token) {
+  updateToken (token, connect = true) {
     this._token = token;
-    this._autoConnect = true;
+    // this._autoConnect = true;
 
-    this._connect();
+    if (connect) {
+      this.connect();
+    }
   }
 
-  _connect () {
+  connect () {
+    if (this._connected) {
+      return Promise.resolve();
+    }
+
     if (this._connecting) {
-      return;
+      return this._connectPromise || Promise.resolve();
     }
 
     if (this._reconnectTimeoutId) {
@@ -104,10 +115,17 @@ export default class Ws extends JsonRpcBase {
 
       window._parityWS = this;
     }
+
+    this._connectPromise = new Promise((resolve, reject) => {
+      this._connectPromiseFunctions = { resolve, reject };
+    });
+
+    return this._connectPromise;
   }
 
   _onOpen = (event) => {
-    console.log('ws:onOpen', event);
+    console.log('ws:onOpen');
+
     this._connected = true;
     this._connecting = false;
     this._autoConnect = true;
@@ -116,6 +134,11 @@ export default class Ws extends JsonRpcBase {
     Object.keys(this._messages)
       .filter((id) => this._messages[id].queued)
       .forEach(this._send);
+
+    this._connectPromiseFunctions.resolve();
+
+    this._connectPromise = null;
+    this._connectPromiseFunctions = {};
   }
 
   _onClose = (event) => {
@@ -135,13 +158,20 @@ export default class Ws extends JsonRpcBase {
       console.log('ws:onClose', `trying again in ${time}...`);
 
       this._reconnectTimeoutId = setTimeout(() => {
-        this._connect();
+        this.connect();
       }, timeout);
 
       return;
     }
 
-    console.log('ws:onClose', event);
+    if (this._connectPromise) {
+      this._connectPromiseFunctions.reject(event);
+
+      this._connectPromise = null;
+      this._connectPromiseFunctions = {};
+    }
+
+    console.log('ws:onClose');
   }
 
   _onError = (event) => {
@@ -149,10 +179,17 @@ export default class Ws extends JsonRpcBase {
     // ie. don't print if error == closed
     window.setTimeout(() => {
       if (this._connected) {
-        console.error('ws:onError', event);
+        console.error('ws:onError');
 
         event.timestamp = Date.now();
         this._lastError = event;
+
+        if (this._connectPromise) {
+          this._connectPromiseFunctions.reject(event);
+
+          this._connectPromise = null;
+          this._connectPromiseFunctions = {};
+        }
       }
     }, 50);
   }