feat: dev mode menu commands & directives

src/constants.ts

@@ -4,9 +4,9 @@ const modeRaw = "{{MODE}}";
 const branchRaw = "{{BRANCH}}";
 
 /** The mode in which the script was built (production or development) */
-export const mode = modeRaw.match(/^{{.+}}$/) ? "production" : modeRaw;
+export const mode = (modeRaw.match(/^{{.+}}$/) ? "production" : modeRaw) as "production" | "development";
 /** The branch to use in various URLs that point to the GitHub repo */
-export const branch = branchRaw.match(/^{{.+}}$/) ? "main" : branchRaw;
+export const branch = (branchRaw.match(/^{{.+}}$/) ? "main" : branchRaw) as "main" | "develop";
 
 /**
  * How much info should be logged to the devtools console  

src/index.ts

@@ -1,6 +1,6 @@
 import { addGlobalStyle, initOnSelector, onSelector } from "@sv443-network/userutils";
-import { getFeatures, initConfig } from "./config";
-import { logLevel, scriptInfo } from "./constants";
+import { clearConfig, getFeatures, initConfig } from "./config";
+import { logLevel, mode, scriptInfo } from "./constants";
 import { error, getDomain, log, setLogLevel } from "./utils";
 import { initSiteEvents } from "./events";
 import {
@@ -8,12 +8,15 @@ import {
   initQueueButtons, addWatermark,
   preInitLayout, removeUpgradeTab,
   initVolumeFeatures, initAutoCloseToasts,
+  removeShareTrackingParam,
   // lyrics
   addMediaCtrlLyricsBtn, geniUrlBase,
   // input
-  initArrowKeySkip, initSiteSwitch, addAnchorImprovements,
+  initArrowKeySkip, initSiteSwitch,
+  initBeforeUnloadHook, disableBeforeUnload,
+  addAnchorImprovements, initNumKeysSkip,
   // menu
-  initMenu, addMenu, initBeforeUnloadHook, addConfigMenuOption, disableBeforeUnload, removeShareTrackingParam,
+  initMenu, addMenu, addConfigMenuOption,
 } from "./features/index";
 
 {
@@ -51,12 +54,22 @@ function preInit() {
 }
 
 async function init() {
+  try {
+    registerMenuCommands();
+  }
+  catch(e) {
+    void e;
+  }
+
+  // init DOM-dependant stuff like features
   try {
     document.addEventListener("DOMContentLoaded", onDomLoad);
   }
   catch(err) {
     error("General Error:", err);
   }
+
+  // init config
   try {
     preInitLayout(await initConfig());
 
@@ -67,6 +80,7 @@ async function init() {
     error("Error while initializing ConfigManager:", err);
   }
 
+  // init menu separately from features
   try {
     void ["TODO(v1.1):", initMenu];
     // initMenu();
@@ -124,6 +138,9 @@ async function onDomLoad() {
       if(features.removeShareTrackingParam)
         removeShareTrackingParam();
 
+      if(features.numKeysSkipToTime)
+        initNumKeysSkip();
+
       initVolumeFeatures();
     }
 
@@ -137,4 +154,38 @@ async function onDomLoad() {
   }
 }
 
+function registerMenuCommands() {
+  if(mode === "development") {
+    GM.registerMenuCommand("Reset config", async () => {
+      if(confirm("Are you sure you want to reset the configuration to its default values?\nThis will automatically reload the page.")) {
+        await clearConfig();
+        location.reload();
+      }
+    }, "r");
+
+    GM.registerMenuCommand("List GM values", async () => {
+      alert("See console.");
+      const keys = await GM.listValues();
+      log("GM values:");
+      if(keys.length === 0)
+        log("  No values found.");
+      for(const key of keys)
+        log(`  ${key} -> ${await GM.getValue(key)}`);
+    }, "l");
+
+    GM.registerMenuCommand("Clear all GM values", async () => {
+      if(confirm("Are you sure you want to clear all GM values?")) {
+        const keys = await GM.listValues();
+        log("Clearing GM values:");
+        if(keys.length === 0)
+          log("  No values found.");
+        for(const key of keys) {
+          await GM.deleteValue(key);
+          log(`  Deleted ${key}`);
+        }
+      }
+    }, "c");
+  }
+}
+
 preInit();

src/tools/post-build.ts

@@ -34,6 +34,13 @@ type BuildStats = {
   timestamp: number;
 };
 
+/** Directives that are only added in dev mode */
+const devDirectives = mode === "development" ? `
+// @grant          GM.deleteValue
+// @grant          GM.registerMenuCommand
+// @grant          GM.listValues\
+` : undefined;
+
 (async () => {
   const resourcesDirectives = await getResourceDirectives();
 
@@ -60,7 +67,8 @@ type BuildStats = {
 // @grant          GM.getResourceUrl
 // @grant          unsafeWindow
 // @noframes\
-${resourcesDirectives ? "\n" + resourcesDirectives : ""}
+${resourcesDirectives ? "\n" + resourcesDirectives : ""}\
+${devDirectives ?? ""}
 // ==/UserScript==
 /*
 ▄▄▄                    ▄   ▄▄▄▄▄▄   ▄