closeBrowser throws error after closeTab when run Headless.

[DrRuhe]

Describe the bug
using openTab and closeTab leads to closeBrowser throwing errors.

BUT ONLY WHEN RUN IN HEADLESS.

To Reproduce

import { closeBrowser, openBrowser, closeTab, openTab } from 'taiko';

async function test() {
    await openBrowser({headless: true});
    await openTab();
    await closeTab();
    await closeBrowser(); // error occurs here 
}

test();

Logs

Error: WebSocket is not open: readyState 2 (CLOSING)
    at sendAfterClose (/home/jakobgerhardt/Projects/ZK2.6/zk-fe-guitest/node_modules/ws/lib/websocket.js:903:17)
    at WebSocket.send (/home/jakobgerhardt/Projects/ZK2.6/zk-fe-guitest/node_modules/ws/lib/websocket.js:405:7)
    at Chrome._enqueueCommand (/home/jakobgerhardt/Projects/ZK2.6/zk-fe-guitest/node_modules/chrome-remote-interface/lib/chrome.js:286:18)
    at /home/jakobgerhardt/Projects/ZK2.6/zk-fe-guitest/node_modules/chrome-remote-interface/lib/chrome.js:88:22
    at new Promise (<anonymous>)
    at Chrome.send (/home/jakobgerhardt/Projects/ZK2.6/zk-fe-guitest/node_modules/chrome-remote-interface/lib/chrome.js:87:20)
    at handler (/home/jakobgerhardt/Projects/ZK2.6/zk-fe-guitest/node_modules/chrome-remote-interface/lib/api.js:33:23)
    at /home/jakobgerhardt/Projects/ZK2.6/zk-fe-guitest/node_modules/taiko/lib/connection.js:31:33
    at new Promise (<anonymous>)
    at Proxy.<anonymous> (/home/jakobgerhardt/Projects/ZK2.6/zk-fe-guitest/node_modules/taiko/lib/connection.js:22:24) 

Expected behavior
No crash

Screenshots

Versions:

• Taiko: Version: 1.2.7 (Chromium: 88.0.4314.0) RELEASE
• OS Pop!_OS 20.04 LTS
• Node.js v16.11.0

Gauge version: 1.4.1
Commit Hash: a82478a

Plugins
-------
html-report (4.1.2)
java (0.7.15)
js (2.3.17)
screenshot (0.1.0)
ts (0.1.0)
xml-report (0.2.3)

Additional context
Add any other context about the problem here.

[hkang1]

We get the same error in our open source CI environment fairly frequently also. For us it occurs when just doing a series of React route changes in chromium (headless).

Versions

• @getgauge/cli: 1.1.8
• taiko: 1.2.5
• node: 14.16.0

CircleCI sample occurence

# Navigation
  ## Navigate to top navigation routes
Error: WebSocket is not open: readyState 2 (CLOSING)
at sendAfterClose (/webui/tests/node_modules/ws/lib/websocket.js:763:17)
at WebSocket.send (/webui/tests/node_modules/ws/lib/websocket.js:345:7)
at Chrome._enqueueCommand (/webui/tests/node_modules/chrome-remote-interface/lib/chrome.js:286:18)
at /webui/tests/node_modules/chrome-remote-interface/lib/chrome.js:88:22
at new Promise (<anonymous>)
at Chrome.send (/webui/tests/node_modules/chrome-remote-interface/lib/chrome.js:87:20)
at handler (/webui/tests/node_modules/chrome-remote-interface/lib/api.js:32:23)
at /webui/tests/node_modules/taiko/lib/connection.js:31:33
at new Promise (<anonymous>)
at Proxy.<anonymous> (/webui/tests/node_modules/taiko/lib/connection.js:22:24)
Error ----------------------------------

[Gauge]
ts runner quit unexpectedly. Check logs for more details.
ErrorMessage: transport is closing

Get Support ----------------------------
	Docs:          https://docs.gauge.org
	Bugs:          https://github.com/getgauge/gauge/issues
	Chat:          https://spectrum.chat/gauge

Your Environment Information -----------
	linux, 1.1.5, f455126
	html-report (4.0.12), screenshot (0.0.1), ts (0.1.0), xml-report (0.2.3)

Exited with code exit status 1
CircleCI received exit code 1

[DCoomer]

On our website in test, we get the same error during downloads.
I'm not able to show our code/website due to security reasons, but after clicking a download link, our website opens a new tab to start the download and closes it after the request is received. Which occasionally causes the same WebSocket error. We don't run in headless, but the same steps from @DrRuhe effectively occurs for us. Quickly opening and closing a new tab.

[zabil]

Thanks for confirming this I ran the script following script was able to replicate it

$ taiko --version
Version: 1.3.2 (Chromium: 100.0.4874.0) RELEASE
$ cat script.js
const { closeBrowser, openBrowser, closeTab, openTab } = require('taiko');

async function test() {
    await openBrowser({headless: true});
    await openTab();
    await closeTab();
    await closeBrowser(); // error occurs here 
}

test();

$ taiko script.js
taiko script.js
 ✔ Browser opened
 ✔ Opened tab with URL about:blank
 ✔ Closed current tab matching about:blank
Error: WebSocket is not open: readyState 2 (CLOSING)
    at sendAfterClose (/opt/homebrew/lib/node_modules/taiko/node_modules/ws/lib/websocket.js:967:17)
    at WebSocket.send (/opt/homebrew/lib/node_modules/taiko/node_modules/ws/lib/websocket.js:405:7)
    at Chrome._enqueueCommand (/opt/homebrew/lib/node_modules/taiko/node_modules/chrome-remote-interface/lib/chrome.js:286:18)
    at /opt/homebrew/lib/node_modules/taiko/node_modules/chrome-remote-interface/lib/chrome.js:88:22
    at new Promise (<anonymous>)
    at Chrome.send (/opt/homebrew/lib/node_modules/taiko/node_modules/chrome-remote-interface/lib/chrome.js:87:20)
    at handler (/opt/homebrew/lib/node_modules/taiko/node_modules/chrome-remote-interface/lib/api.js:33:23)
    at /opt/homebrew/lib/node_modules/taiko/lib/connection.js:31:33
    at new Promise (<anonymous>)
    at Proxy.<anonymous> (/opt/homebrew/lib/node_modules/taiko/lib/connection.js:22:24)
WARNING: Connection to browser lost. This probably isn't a problem with Taiko, inspect logs for possible causes.

Will need to check why this is happening.

[zabil]

As a workaround, try adding a small wait before calling closeBrowser for example

const { waitFor, closeBrowser, openBrowser, closeTab, openTab } = require('taiko');

async function test() {
    await openBrowser({headless: true});
    await openTab();
    await closeTab();
    await waitFor(100)
    await closeBrowser();
}

test();