Bug 1796585 - Introduce logging presets for about:logging. r=mossop,flod

Differential Revision: https://phabricator.services.mozilla.com/D160212

toolkit/content/aboutLogging.html

@@ -31,9 +31,14 @@
       </div>
       <div>
         <label for="log-modules" data-l10n-id="about-logging-new-log-modules"></label>
-        <input type="text" name="log-modules" id="log-modules" value="timestamp,sync,nsHttp:5,cache2:5,nsSocketTransport:5,nsHostResolver:5">
+        <input type="text" name="log-modules" id="log-modules" value="">
         <button id="set-log-modules-button" data-l10n-id="about-logging-set-log-modules"></button>
       </div>
+      <div id=preset-selector-section>
+        <label for="logging-preset-selector" data-l10n-id="about-logging-logging-preset-selector-text"></label>
+        <select name="logging-preset-selector" id=logging-preset-dropdown></select>
+        <div id="logging-preset-description"></div>
+      </div>
     </div>
     <div id=logging-output class=page-section>
       <div>

toolkit/content/aboutLogging.js

@@ -12,6 +12,63 @@ const gDirServ = Cc["@mozilla.org/file/directory_service;1"].getService(
 
 const $ = document.querySelector.bind(document);
 
+const gLoggingPresets = {
+  networking: {
+    modules:
+      "timestamp,sync,nsHttp:5,cache2:5,nsSocketTransport:5,nsHostResolver:5",
+    l10nIds: {
+      label: "about-logging-preset-networking-label",
+      description: "about-logging-preset-networking-description",
+    },
+  },
+  "media-playback": {
+    modules:
+      "cubeb:5,PlatformDecoderModule:5,AudioSink:5,AudioSinkWrapper:5,MediaDecoderStateMachine:4,MediaDecoder:4",
+    l10nIds: {
+      label: "about-logging-preset-media-playback-label",
+      description: "about-logging-preset-media-playback-description",
+    },
+  },
+  custom: {
+    modules: "",
+    l10nIds: {
+      label: "about-logging-preset-custom-label",
+      description: "about-logging-preset-custom-description",
+    },
+  },
+};
+
+function populatePresets() {
+  let dropdown = $("#logging-preset-dropdown");
+  for (let presetName in gLoggingPresets) {
+    let preset = gLoggingPresets[presetName];
+    let option = document.createElement("option");
+    document.l10n.setAttributes(option, preset.l10nIds.label);
+    option.value = presetName;
+    dropdown.appendChild(option);
+  }
+
+  function setPresetAndDescription(preset) {
+    document.l10n.setAttributes(
+      $("#logging-preset-description"),
+      gLoggingPresets[preset].l10nIds.description
+    );
+  }
+
+  dropdown.onchange = function() {
+    $("#log-modules").value = gLoggingPresets[dropdown.value].modules;
+    setPresetAndDescription(dropdown.value);
+    Services.prefs.setCharPref("logging.config.preset", dropdown.value);
+    setLogModules();
+  };
+
+  $("#log-modules").value = gLoggingPresets[dropdown.value].modules;
+  setPresetAndDescription(dropdown.value);
+  $("#log-modules").oninput = e => {
+    dropdown.value = "custom";
+  };
+}
+
 let gInited = false;
 function init() {
   if (gInited) {
@@ -40,6 +97,8 @@ function init() {
     console.error(e);
   }
 
+  populatePresets();
+
   // Update the value of the log file.
   updateLogFile();
 

toolkit/locales/en-US/toolkit/about/aboutLogging.ftl

@@ -23,3 +23,13 @@ about-logging-new-log-modules = New log modules:
 about-logging-logging-output-selection = Logging output
 about-logging-logging-to-file = Logging to a file
 about-logging-no-log-modules = None
+about-logging-logging-preset-selector-text = Logging preset:
+
+## Logging presets
+
+about-logging-preset-networking-label = Networking
+about-logging-preset-networking-description = Log modules to diagnose networking issues
+about-logging-preset-media-playback-label = Media playback
+about-logging-preset-media-playback-description = Log modules to diagnose media playback issues (not video-conferencing issues)
+about-logging-preset-custom-label = Custom
+about-logging-preset-custom-description = Log modules manually selected

toolkit/themes/shared/aboutLogging.css

@@ -28,6 +28,7 @@ div.page-section {
 
 div.page-section > div {
   padding-inline-start: 0.5em;
+  padding-bottom: 2em;
 }
 
 #current-log-modules,
@@ -42,6 +43,10 @@ div.page-section > div {
   padding-inline-start: 8px;
 }
 
+#logging-preset-description {
+  padding-inline-start: 8px;
+}
+
 input[type=text] {
   width: 100%;
   font-family: monospace;