Merge pull request #300 from Joe-Dowd/debug-output

Added copy debug information to clipboard options element.

public/_locales/en/messages.json

@@ -440,5 +440,17 @@
     },
     "incorrectlyFormattedOptions": {
         "message": "This JSON is not formatted correctly. Your options have not been changed."
+    },
+    "copyDebugInformation": {
+        "message": "Copy Debug Information To Clipboard"
+    },
+    "copyDebugInformationFailed": {
+        "message": "Failed to write to clipboard"
+    },
+    "copyDebugInformationOptions": {
+        "message": "Copies information to the clipboard to be provided to a developer when raising a bug / when a developer requests it. Sensitive information such as your user ID, whitelisted channels, and custom server address have been removed. However it does contain information such as your useragent, browser, operating system, and extension version number. "
+    },
+    "copyDebugInformationComplete": {
+        "message": "The debug information has been copied to the clip board. Feel free to remove any information you would rather not share. Save this in a text file or paste into the bug report."
     }
 }

public/options/options.html

@@ -334,6 +334,20 @@
 			<br/>
 			<br/>
 
+			<div option-type="button-press" sync-option="copyDebugInformation" confirm-message="copyDebugInformation">
+				<div class="option-button trigger-button">
+					__MSG_copyDebugInformation__
+				</div>
+	
+				<br/>
+	
+				<div class="small-description">__MSG_copyDebugInformationOptions__</div>
+			</div>
+
+			<br/>
+			<br/>
+
+
 			<div option-type="text-change" sync-option="serverAddress">
 				<label class="text-label-container">
 					<div>__MSG_customServerAddress__</div>

src/config.ts

@@ -33,6 +33,10 @@ interface SBObject {
     defaults: SBConfig;
     localConfig: SBConfig;
     config: SBConfig;
+
+    // Functions
+    encodeStoredItem<T>(data: T): T | Array<any>;
+    convertJSON(): void;
 }
 
 // Allows a SBMap to be conveted into json form
@@ -119,7 +123,11 @@ var Config: SBObject = {
         mobileUpdateShowCount: 0
     },
     localConfig: null,
-    config: null
+    config: null,
+    
+    // Functions
+    encodeStoredItem,
+    convertJSON
 };
 
 // Function setup
@@ -130,7 +138,7 @@ var Config: SBObject = {
  * 
  * @param data 
  */
-function encodeStoredItem(data) {
+function encodeStoredItem<T>(data: T): T | Array<any>  {
     // if data is SBMap convert to json for storing
     if(!(data instanceof SBMap)) return data;
     return Array.from(data.entries());
@@ -142,7 +150,7 @@ function encodeStoredItem(data) {
  * 
  * @param {*} data 
  */
-function decodeStoredItem(id: string, data) {
+function decodeStoredItem<T>(id: string, data: T): T | SBMap<string, any> {
     if (!Config.defaults[id]) return data;
 
     if (Config.defaults[id] instanceof SBMap) {
@@ -239,7 +247,7 @@ function resetConfig() {
     Config.config = Config.defaults;
 };
 
-function convertJSON() {
+function convertJSON(): void {
     Object.keys(Config.localConfig).forEach(key => {
         Config.localConfig[key] = decodeStoredItem(key, Config.localConfig[key]);
     });

src/options.ts

@@ -1,4 +1,6 @@
 import Config from "./config";
+import * as CompileConfig from "../config.json";
+
 // Make the config public for debugging purposes
 (<any> window).SB = Config;
 
@@ -126,6 +128,16 @@ async function init() {
                         invidiousInstanceAddInit(<HTMLElement> optionsElements[i], privateTextChangeOption);
                 }
 
+                break;
+            case "button-press":
+                let actionButton = optionsElements[i].querySelector(".trigger-button");
+
+                switch(optionsElements[i].getAttribute("sync-option")) {
+                    case "copyDebugInformation":
+                        actionButton.addEventListener("click", copyDebugOutputToClipboard);
+                        break;
+                }
+
                 break;
             case "keybind-change":
                 let keybindButton = optionsElements[i].querySelector(".trigger-button");
@@ -367,7 +379,12 @@ function activatePrivateTextChange(element: HTMLElement) {
     // See if anything extra must be done
     switch (option) {
         case "*":
-            result = JSON.stringify(Config.localConfig);
+            let jsonData = JSON.parse(JSON.stringify(Config.localConfig));
+
+            // Fix sponsorTimes data as it is destroyed from the JSON stringify
+            jsonData.sponsorTimes = Config.encodeStoredItem(Config.localConfig.sponsorTimes);
+
+            result = JSON.stringify(jsonData);
             break;
     }
 
@@ -387,7 +404,9 @@ function activatePrivateTextChange(element: HTMLElement) {
                         for (const key in newConfig) {
                             Config.config[key] = newConfig[key];
                         }
+                        Config.convertJSON();
 
+                        // Reload options on page
                         init();
 
                         if (newConfig.supportInvidious) {
@@ -433,3 +452,35 @@ function validateServerAddress(input: string): string {
 
     return input;
 }
+
+function copyDebugOutputToClipboard() {
+    // Build output debug information object
+    let output = {
+        debug: {
+            userAgent: navigator.userAgent,
+            platform: navigator.platform,
+            language: navigator.language,
+            extensionVersion: chrome.runtime.getManifest().version
+        },
+        config: JSON.parse(JSON.stringify(Config.localConfig)) // Deep clone config object
+    };
+
+    // Fix sponsorTimes data as it is destroyed from the JSON stringify
+    output.config.sponsorTimes = Config.encodeStoredItem(Config.localConfig.sponsorTimes);
+    
+    // Sanitise sensitive user config values
+    delete output.config.userID;
+    output.config.serverAddress = (output.config.serverAddress === CompileConfig.serverAddress) 
+        ? "Default server address" : "Custom server address";
+    output.config.invidiousInstances = output.config.invidiousInstances.length;
+    output.config.whitelistedChannels = output.config.whitelistedChannels.length;
+
+    // Copy object to clipboard
+    navigator.clipboard.writeText(JSON.stringify(output, null, 4))
+      .then(() => {
+        alert(chrome.i18n.getMessage("copyDebugInformationComplete"));
+      })
+      .catch(err => {
+        alert(chrome.i18n.getMessage("copyDebugInformationFailed"));
+      });;
+}