mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-11-26 19:47:20 +00:00
Add a global error trapper for the browser
JavaScript errors are invisible unless you've got developer tools open, which is making it hard for users to report errors. This change makes JavaScript errors popup a big red alert
This commit is contained in:
parent
204bd69e83
commit
c631916441
@ -6,9 +6,10 @@ Basic styles used before we boot up the parsing engine
|
||||
*/
|
||||
|
||||
/*
|
||||
Password prompt
|
||||
Error message and password prompt
|
||||
*/
|
||||
.tw-password-wrapper {
|
||||
|
||||
.tw-password-wrapper, .tw-error-form {
|
||||
font-family: sans-serif;
|
||||
z-index: 20000;
|
||||
position: fixed;
|
||||
@ -21,6 +22,25 @@ Password prompt
|
||||
-webkit-border-radius: 8px;
|
||||
-moz-border-radius: 8px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.tw-error-form {
|
||||
color: #fff;
|
||||
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
|
||||
background-color: rgb(255, 75, 75);
|
||||
border: 8px solid rgb(255, 0, 0);
|
||||
}
|
||||
|
||||
.tw-error-form div {
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
.tw-error-prompt {
|
||||
color: #000;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.tw-password-wrapper {
|
||||
color: #000;
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
|
||||
background-color: rgb(197, 235, 183);
|
||||
@ -35,4 +55,3 @@ Password prompt
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
|
38
boot/boot.js
38
boot/boot.js
@ -66,14 +66,51 @@ $tw.utils.log = function(/* args */) {
|
||||
Display an error and exit
|
||||
*/
|
||||
$tw.utils.error = function(err) {
|
||||
// Prepare the error message
|
||||
var errHeading = "Internal JavaScript Error",
|
||||
promptMsg = "Well, this is embarrassing. It is recommended that you restart TiddlyWiki by refreshing your browser";
|
||||
// Log the error to the console
|
||||
console.error(err);
|
||||
if($tw.browser) {
|
||||
// Display an error message to the user
|
||||
var form = document.createElement("form"),
|
||||
heading = document.createElement("h1"),
|
||||
prompt = document.createElement("div"),
|
||||
message = document.createElement("div"),
|
||||
button = document.createElement("button");
|
||||
heading.appendChild(document.createTextNode(errHeading));
|
||||
prompt.appendChild(document.createTextNode(promptMsg));
|
||||
prompt.className = "tw-error-prompt";
|
||||
message.appendChild(document.createTextNode(err));
|
||||
button.appendChild(document.createTextNode("close"));
|
||||
form.className = "tw-error-form";
|
||||
form.appendChild(heading);
|
||||
form.appendChild(prompt);
|
||||
form.appendChild(message);
|
||||
form.appendChild(button);
|
||||
document.body.insertBefore(form,document.body.firstChild);
|
||||
form.addEventListener("submit",function(event) {
|
||||
document.body.removeChild(form);
|
||||
event.preventDefault();
|
||||
return false;
|
||||
},true);
|
||||
return null;
|
||||
} else {
|
||||
// Exit if we're under node.js
|
||||
process.exit(1);
|
||||
}
|
||||
};
|
||||
|
||||
/*
|
||||
Use our custom error handler if we're in the browser
|
||||
*/
|
||||
if($tw.browser) {
|
||||
window.addEventListener("error",function(event) {
|
||||
$tw.utils.error(event.message);
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
/*
|
||||
Check if an object has a property
|
||||
*/
|
||||
@ -1276,4 +1313,5 @@ $tw.boot.decryptEncryptedTiddlers(function() {
|
||||
$tw.boot.startup();
|
||||
});
|
||||
|
||||
|
||||
})();
|
||||
|
Loading…
Reference in New Issue
Block a user