Improve debug logging

2 files changed, 28 insertions, 5 deletions

diff --git a/ext/bg/js/request.js b/ext/bg/js/request.js
index 778f933b..02eed6fb 100644
--- a/ext/bg/js/request.js
+++ b/ext/bg/js/request.js
@@ -36,8 +36,9 @@ async function requestJson(url, action, params) {
     const responseText = await requestText(url, action, params);
     try {
         return JSON.parse(responseText);
-    }
-    catch (e) {
-        throw new Error('Invalid response');
+    } catch (e) {
+        const error = new Error(`Invalid response (${e.message || e})`);
+        error.data = {url, action, params, responseText};
+        throw error;
     }
 }
diff --git a/ext/bg/js/settings/anki.js b/ext/bg/js/settings/anki.js
index 5f7989b8..9adb2f2a 100644
--- a/ext/bg/js/settings/anki.js
+++ b/ext/bg/js/settings/anki.js
@@ -37,13 +37,35 @@ function _ankiSetError(error) {
     if (error) {
         node.hidden = false;
         node.textContent = `${error}`;
-    }
-    else {
+        _ankiSetErrorData(node, error);
+    } else {
         node.hidden = true;
         node.textContent = '';
     }
 }
 
+function _ankiSetErrorData(node, error) {
+    const data = error.data;
+    let message = '';
+    if (typeof data !== 'undefined') {
+        message += `${JSON.stringify(data, null, 4)}\n\n`;
+    }
+    message += `${error.stack}`.trimRight();
+
+    const button = document.createElement('a');
+    button.className = 'error-data-show-button';
+
+    const content = document.createElement('div');
+    content.className = 'error-data-container';
+    content.textContent = message;
+    content.hidden = true;
+
+    button.addEventListener('click', () => content.hidden = !content.hidden, false);
+
+    node.appendChild(button);
+    node.appendChild(content);
+}
+
 function _ankiSetDropdownOptions(dropdown, optionValues) {
     const fragment = document.createDocumentFragment();
     for (const optionValue of optionValues) {