App crashes when devtools are open and react-devtools extension is installed in chrome

[ojkelly]

Hey @iann0036 👋

When the react-devtools extensions is installed in Chrome is emits an event to start a connection with the react-devtools that may be embedded in an app running on the page, when you open chromes dev tools.

Ideally we would just disable the extension on all pages but the ones we need it on.

The bug may be caused by other extensions too, because the contents of message.data could be anything from any other extension, like the JS Object from react-devtools.

A simple fix is probably just a try..catch where you ignore the exceptions. Effectively whats happening now without the app crashing.

former2/js/app.js

Lines 1400 to 1415 in c392397

	window.addEventListener('message', (message) => {
	var evt = JSON.parse(message.data);
	if (evt['event'] == "init") {
	clearDiagram();
	} else if (evt['event'] == "export") {
	var element = document.createElement('a');
	element.setAttribute('href', evt.data);
	element.setAttribute('download', "graph.png");
	element.style.display = 'none';
	document.body.appendChild(element);
	element.click();
	document.body.removeChild(element);
	} else if (evt['event'] == "toggleFullscreen") {
	$('#diagramframe').toggleClass('fullscreen');
	}
	});

[iann0036]

Hey @ojkelly,

Thanks for the heads up!

I'll throw away parsing errors as you've suggested. I believe I technically could verify the sending extension, but as soo many users like to build their own customised version - this is probably the best path forward.