Add client-side crash report page

Automatically generate a crash report page on the client-side for API errors that return tracing information like exception class, error message and stack trace. Signed-off-by: Christoph Wurst <christoph@winzerhof-wurst.at>

Add client-side crash report page
4da136ce · Christoph Wurst · cae4d337 · 4da136ce · 4da136ce · 4da136ce
Unverified Commit 4da136ce authored 7 years ago by Christoph Wurst
--- a/js/controller/foldercontroller.js
+++ b/js/controller/foldercontroller.js
@@ -24,6 +24,7 @@ define(function(require) {

 	var $ = require('jquery');
 	var _ = require('underscore');
+	var CrashReport = require('crashreport');
 	var Radio = require('radio');
 	var ErrorMessageFactory = require('util/errormessagefactory');

@@ -35,9 +36,7 @@ define(function(require) {
 	 */
 	function loadFolders(account) {
 		return Radio.folder.request('entities', account)
-			.catch(function() {
-				Radio.ui.trigger('error:show', t('mail', 'Error while loading the selected account.'));
-			});
+			.catch(CrashReport.report);
 	}

 	/**

--- a/js/crashreport.js
+++ b/js/crashreport.js
+/**
+ * @copyright 2017 Christoph Wurst <christoph@winzerhof-wurst.at>
+ *
+ * @author 2017 Christoph Wurst <christoph@winzerhof-wurst.at>
+ *
+ * @license GNU AGPL version 3 or any later version
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+
+define(function(require) {
+	'use strict';
+
+	var $ = require('jquery');
+	var OC = require('OC');
+	var crashReportTemplate = require('templates/crash-report.html')
+
+	function isDebugMode() {
+		return $('#debug-mode').val() === 'true';
+	}
+
+	function report(error) {
+		console.error(error);
+		var message = error.message || 'An unkown error occurred.';
+		if (!message.endsWith('.')) {
+			message += '.';
+		}
+		var debug = isDebugMode();
+
+		var $notification = $('<div>');
+		var $message = $('<span>');
+		$message.text('Error: ' + message);
+		if (debug) {
+			$message.append(' Click for more information.');
+			$message.click(function() {
+				var w = window.open();
+				var reportHTML = crashReportTemplate(error);
+				$(w.document.body).html(reportHTML);
+			});
+		}
+		$notification.append($message);
+
+		OC.Notification.showTemporary($notification, {
+			isHTML: true
+		});
+	}
+
+	return {
+		report: report
+	};
+});
--- a/js/service/folderservice.js
+++ b/js/service/folderservice.js
@@ -48,16 +48,22 @@ define(function(require) {
 		}

 		return Promise.resolve($.get(url))
-			.then(function(data) {
-				for (var prop in data) {
-					if (prop === 'folders') {
-						account.folders.reset();
-						_.each(data.folders, account.addFolder, account);
-					} else {
-						account.set(prop, data[prop]);
+				.then(function(data) {
+					for (var prop in data) {
+						if (prop === 'folders') {
+							account.folders.reset();
+							_.each(data.folders, account.addFolder, account);
+						} else {
+							account.set(prop, data[prop]);
+						}
 					}
-				}
-				return account.folders;
-			});
+					return account.folders;
+				})
+				.catch(function(xhr) {
+					if (xhr.responseJSON) {
+						throw xhr.responseJSON;
+					}
+					throw xhr;
+				});
 	}
 });
--- a/js/templates/crash-report.html
+++ b/js/templates/crash-report.html
+<head>
+	<title>Nextcloud Mail Crash Report</title>
+</head>
+<body>
+	<h1>Nextcloud Crash Report</h1>
+	<p>
+		This is an automatically generated report of an unuexpected application
+		error. Use the information on this page to file a new ticket at
+		<a href="https://github.com/nextcloud/mail/issues/new">https://github.com/nextcloud/mail/issues/new</a>
+	</p>
+	<p>
+		<strong>Error type and code:</strong> {{type}}, code {{code}}
+	</p>
+	<p>
+		<strong>Error message:</strong> {{message}}
+	</p>
+
+	<h2>Stack Trace</h2>
+	{{#if trace}}
+	<code>
+		{{#each trace}}
+		{{@index}}: {{#if class}}{{class}}::{{/if}}{{function}}<br>
+		{{#if file}}{{file}}, line {{line}}<br>{{/if}}
+		{{/each}}
+	<code>
+	{{else}}
+	No trace available.
+	{{/if}}
+</body>
--- a/lib/Controller/FoldersController.php
+++ b/lib/Controller/FoldersController.php
@@ -68,6 +68,7 @@ class FoldersController extends Controller {
 	 */
 	public function index($accountId) {
 		$account = $this->accountService->find($this->currentUserId, $accountId);
+		throw new \OCA\Mail\Exception\ServiceException('nope');

 		$folders = $this->mailManager->getFolders($account);
 		return new JSONResponse([

--- a/templates/index.php
+++ b/templates/index.php
@@ -29,6 +29,7 @@ script('mail', 'searchproxy');
 script('mail', 'build/build');
 ?>

+<input type="hidden" id="debug-mode" value="<?php p($_['debug'] ? 'true' : 'false'); ?>">
 <input type="hidden" id="config-installed-version" value="<?php p($_['app-version']); ?>">
 <input type="hidden" id="serialized-accounts" value="<?php p($_['accounts']); ?>">
 <input type="hidden" id="external-avatars" value="<?php p($_['external-avatars']); ?>">