Bug 1606472 - Fixup some typings that were set to any; r=julienw

Specifically this is fixing up some issues around loading in JSMs.

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

--HG--
extra : moz-landing-system : lando

devtools/client/performance-new/@types/gecko.d.ts

@@ -39,6 +39,7 @@ declare namespace MockedExports {
     selectedTab: BrowserTab;
     selectedBrowser?: ChromeBrowser;
     messageManager: MessageManager;
+    ownerDocument?: ChromeDocument;
   }
 
   interface BrowserTab {
@@ -136,6 +137,11 @@ declare namespace MockedExports {
     };
   };
 
+  // TS-TODO
+  const CustomizableUIJSM: any;
+
+  const CustomizableWidgetsJSM: any;
+
   const Services: Services;
 
   // This class is needed by the Cc importing mechanism. e.g.
@@ -227,6 +233,19 @@ declare module "resource://gre/modules/ProfilerGetSymbols.jsm" {
   export = MockedExports.ProfilerGetSymbolsJSM;
 }
 
+declare module "resource://devtools/client/performance-new/popup/background.jsm.js" {
+  import * as Background from "devtools/client/performance-new/popup/background.jsm.js";
+  export = Background
+}
+
+declare module "resource:///modules/CustomizableUI.jsm" {
+  export = MockedExports.CustomizableUIJSM;
+}
+
+declare module "resource:///modules/CustomizableWidgets.jsm" {
+  export = MockedExports.CustomizableWidgetsJSM;
+}
+
 declare var ChromeUtils: MockedExports.ChromeUtils;
 declare var Cu: MockedExports.ChromeUtils;
 

devtools/client/performance-new/popup/background.jsm.js

@@ -344,16 +344,23 @@ function getDefaultRecordingPreferencesForOlderFirefox() {
   return _defaultPrefsForOlderFirefox;
 }
 
-var EXPORTED_SYMBOLS = [
-  "captureProfile",
-  "startProfiler",
-  "stopProfiler",
-  "restartProfiler",
-  "toggleProfiler",
-  "platform",
-  "getSymbolsFromThisBrowser",
-  "getRecordingPreferencesFromBrowser",
-  "setRecordingPreferencesOnBrowser",
-  "revertRecordingPreferences",
-  "getDefaultRecordingPreferencesForOlderFirefox",
-];
+// Provide a fake module.exports for the JSM to be properly read by TypeScript.
+/** @type {any} */ (this).module = { exports: {} };
+
+module.exports = {
+  captureProfile,
+  startProfiler,
+  stopProfiler,
+  restartProfiler,
+  toggleProfiler,
+  platform,
+  getSymbolsFromThisBrowser,
+  getRecordingPreferencesFromBrowser,
+  setRecordingPreferencesOnBrowser,
+  revertRecordingPreferences,
+  getDefaultRecordingPreferencesForOlderFirefox,
+};
+
+// Object.keys() confuses the linting which expects a static array expression.
+// eslint-disable-next-line
+var EXPORTED_SYMBOLS = Object.keys(module.exports);

devtools/client/performance-new/popup/initializer.js

@@ -48,9 +48,11 @@ const {
   getRecordingPreferencesFromBrowser,
   setRecordingPreferencesOnBrowser,
   getSymbolsFromThisBrowser,
-} = ChromeUtils.import(
-  "resource://devtools/client/performance-new/popup/background.jsm.js"
-);
+} =
+  /** @type {import("resource://devtools/client/performance-new/popup/background.jsm.js")} */
+  (ChromeUtils.import(
+    "resource://devtools/client/performance-new/popup/background.jsm.js"
+  ));
 
 const { receiveProfile } = require("devtools/client/performance-new/browser");
 

devtools/client/performance-new/popup/menu-button.jsm.js

@@ -32,17 +32,20 @@ function requireLazy(callback) {
   };
 }
 
+// Provide an exports object for the JSM to be properly read by TypeScript.
+/** @type {any} */ (this).exports = {};
+
 const lazyServices = requireLazy(() =>
   /** @type {import("resource://gre/modules/Services.jsm")} */
   (ChromeUtils.import("resource://gre/modules/Services.jsm"))
 );
 const lazyCustomizableUI = requireLazy(() =>
   /** @type {import("resource:///modules/CustomizableUI.jsm")} */
-  ChromeUtils.import("resource:///modules/CustomizableUI.jsm")
+  (ChromeUtils.import("resource:///modules/CustomizableUI.jsm"))
 );
 const lazyCustomizableWidgets = requireLazy(() =>
   /** @type {import("resource:///modules/CustomizableWidgets.jsm")} */
-  ChromeUtils.import("resource:///modules/CustomizableWidgets.jsm")
+  (ChromeUtils.import("resource:///modules/CustomizableWidgets.jsm"))
 );
 /** @type {PerformancePref["PopupEnabled"]} */
 const BUTTON_ENABLED_PREF = "devtools.performance.popup.enabled";
@@ -72,7 +75,7 @@ function setMenuItemChecked(document, isChecked) {
 /**
  * Toggle the menu button, and initialize the widget if needed.
  *
- * @param {object} document - The browser's document.
+ * @param {ChromeDocument} document - The browser's document.
  * @return {void}
  */
 function toggle(document) {
@@ -92,7 +95,7 @@ function toggle(document) {
     // The widgets are not being properly destroyed. This is a workaround
     // until Bug 1552565 lands.
     const element = document.getElementById("PanelUI-profiler");
-    delete element._addedEventListeners;
+    delete /** @type {any} */ (element)._addedEventListeners;
   }
 }
 
@@ -258,4 +261,8 @@ function initialize() {
 
 const ProfilerMenuButton = { toggle, initialize, isEnabled };
 
-var EXPORTED_SYMBOLS = ["ProfilerMenuButton"];
+exports.ProfilerMenuButton = ProfilerMenuButton;
+
+// Object.keys() confuses the linting which expects a static array expression.
+// eslint-disable-next-line
+var EXPORTED_SYMBOLS = Object.keys(exports);

devtools/client/performance-new/typescript.md

@@ -27,3 +27,19 @@ const browserLoader = BrowserLoader(...);
 const scope = this;
 scope.require = browserLoader.require;
 ```
+
+## Exports from a JSM
+
+TypeScript does not understand `EXPORTED_SYMBOLS` from the JSM for exports. However, we can get around this by secretly defining and using the `exports` object so that TypeScript reads the file like a CommonJS module.
+
+```js
+// Provide an exports object for the JSM to be properly read by TypeScript.
+/** @type {any} */ (this).exports = {};
+
+exports.ProfilerMenuButton = ProfilerMenuButton;
+
+// The following line confuses the linting which expects a static array expression.
+// for the exported symboles.
+// eslint-disable-next-line
+var EXPORTED_SYMBOLS = Object.keys(exports);
+```