Description
Describe the bug
@bbc/react-transcript-editor + Electron crashes the app (white screen)
This was initially encountered by @greggcorp while correcting text using the app.
To Reproduce
Steps to reproduce the behavior:
- Go to releases -
1.0.9-alpha.1 - Download an install the app.
- Get to the transcript view
At this point, is unclear how to reproduce. It's been reported that
- This happens while correcting the text of the transcript
- it might be happening when clicking the rollback btn repeatedly?
Expected behavior
Expecting the app not to crash to white screen when correcting text.
Screenshots
NA
Additional context
I have a hunch that It might be a problem with local storage in electron version of chrome v8 maxing out on space, and not handling that very well.
Transcript editor saves to local storage every time you stop typing. (also see bbc/react-transcript-editor#177 (comment))
To test this hypothesis
Used this snippet from stack overlow Find the maximum length of a single string that can be stored in localStorage and copy and pasted it in the console of electron. with minor modification to remove the dependency from the html element on the page.
+window.result = {}
-window.result = window.result || document.getElementById('result');for convenience
//Clear localStorage
for (var item in localStorage) delete localStorage[item];
window.result = {}
result.textContent = 'Test running…';
//Start test
//Defer running so DOM can be updated with "test running" message
setTimeout(function () {
//Variables
var low = 0,
high = 2e9,
half;
//Two billion may be a little low as a starting point, so increase if necessary
while (canStore(high)) high *= 2;
//Keep refining until low and high are equal
while (low !== high) {
half = Math.floor((high - low) / 2 + low);
//Check if we can't scale down any further
if (low === half || high === half) {
console.info(low, high, half);
//Set low to the maximum possible amount that can be stored
low = canStore(high) ? high : low;
high = low;
break;
}
//Check if the maximum storage is no higher than half
if (storageMaxBetween(low, half)) {
high = half;
//The only other possibility is that it's higher than half but not higher than "high"
} else {
low = half + 1;
}
}
//Show the result we found!
result.innerHTML = 'The maximum length of a string that can be stored in localStorage is <strong>' + low + '</strong> characters.';
//Functions
function canStore(strLen) {
try {
delete localStorage.foo;
localStorage.foo = Array(strLen + 1).join('A');
return true;
} catch (ex) {
return false;
}
}
function storageMaxBetween(low, high) {
return canStore(low) && !canStore(high);
}
}, 0);Slowly but surely the page went blank, with no error on the console 🤷♂
If I do the same thing with the web version of the transcript editor component using the storybook demo there doesn't seem to be the same problem. see console log in screenshot below.
possibly related electron/electron#2357 (comment) from a search for "electron white screen crash"