[test-runner/dev-server] JSON.stringify in web socket plugin fails on circular references in object

[Nivisnum]

Hello!
I've recently started to migrate our tests to web-test-runner (thank you very much for it!) but I've stumbled across a possible bug when I've added chai-dom plugin - whenever assertion on DOM element fails, this plugin returns to the test runner the DOM element in the message object. It then silently fails and test case hangs until the timeout.

Expected behavior:

When assertion fails, the message gets back to test runner and shows assertion error.

Current behavior:

When assertion fails, the sendMessage in web socket plugin throws; the test hangs after finish until the timeout and shows error:

 ❌ Browser tests did not finish within 120000ms. You can increase this timeout with the testsFinishTimeout option. Check the browser logs or open the browser in debug mode for more information. 

When debugging browser throws:

Uncaught TypeError: Converting circular structure to JSON

Where it breaks:

Call to JSON.stringify

web/packages/dev-server-core/src/web-sockets/webSocketsPlugin.ts

Lines 65 to 71 in 7aea504

	sendMessage = async (message) => {
	if (!message.type) {
	throw new Error('Missing message type');
	}
	await webSocketOpened;
	webSocket.send(JSON.stringify(message));
	}

It might possibly break here too:

web/packages/dev-server-core/src/web-sockets/webSocketsPlugin.ts

Lines 28 to 31 in 7aea504

	function setupFetch() {
	sendMessage = (message) =>fetch('/__web-test-runner__/wtr-legacy-browser-api', { method: 'POST', body: JSON.stringify(message) });
	sendMessageWaitForResponse = (message) => fetch('/__web-test-runner__/wtr-legacy-browser-api', { method: 'POST', body: JSON.stringify(message) });
	}

Why it breaks:

It seems there is possibility that message may contain circular references. I've seen that there is a mechanism for serialization in code base that solves it, but I'm not sure if this applies to this flow.

This was mentioned in #437 (comment) after the issue got closed.

I could try contributing a fix (with a bit of guidance where it should be fixed - in plugin on dev server side or in test runner) 😃

[LarsDenBakker]

At the least we should have a try catch for this, but it would be nice if we can handle these messages in a proper way as well. The try catch can be added in the code you linked.

[rbquantori]

It looks like the problem is, actually, not in those mentioned places but rather in Mocha: mochajs/mocha#4910