@memlab/cli 1.0.19 → 1.0.21

package/bin/memlab.js

@@ -1,4 +1,4 @@
-#!/usr/bin/env -S node --expose-gc --max-old-space-size=4096
+#!/usr/bin/env node --expose-gc --max-old-space-size=4096
 
 /**
  * Copyright (c) Meta Platforms, Inc. and affiliates.

package/dist/commands/RunMeasureCommand.js

@@ -44,6 +44,7 @@ const NumberOfRunsOption_1 = __importDefault(require("../options/NumberOfRunsOpt
 const HeadfulBrowserOption_1 = __importDefault(require("../options/e2e/HeadfulBrowserOption"));
 const DisableWebSecurityOption_1 = __importDefault(require("../options/e2e/DisableWebSecurityOption"));
 const EnableJSRewriteOption_1 = __importDefault(require("../options/e2e/EnableJSRewriteOption"));
+const EnableJSInterceptOption_1 = __importDefault(require("../options/e2e/EnableJSInterceptOption"));
 class RunMeasureCommand extends BaseCommand_1.default {
     getCommandName() {
         return 'measure';
@@ -81,6 +82,7 @@ class RunMeasureCommand extends BaseCommand_1.default {
             new DisableXvfbOption_1.default(),
             new DisableWebSecurityOption_1.default(),
             new EnableJSRewriteOption_1.default(),
+            new EnableJSInterceptOption_1.default(),
         ];
     }
     run(options) {

package/dist/commands/WarmupAppCommand.js

@@ -37,6 +37,7 @@ const CheckXvfbSupportCommand_1 = __importDefault(require("./snapshot/CheckXvfbS
 const HeadfulBrowserOption_1 = __importDefault(require("../options/e2e/HeadfulBrowserOption"));
 const DisableWebSecurityOption_1 = __importDefault(require("../options/e2e/DisableWebSecurityOption"));
 const EnableJSRewriteOption_1 = __importDefault(require("../options/e2e/EnableJSRewriteOption"));
+const EnableJSInterceptOption_1 = __importDefault(require("../options/e2e/EnableJSInterceptOption"));
 class FBWarmupAppCommand extends BaseCommand_1.default {
     getCommandName() {
         return 'warmup';
@@ -67,6 +68,7 @@ class FBWarmupAppCommand extends BaseCommand_1.default {
             new DisableWebSecurityOption_1.default(),
             new SkipWarmupOption_1.default(),
             new EnableJSRewriteOption_1.default(),
+            new EnableJSInterceptOption_1.default(),
         ];
     }
     // eslint-disable-next-line @typescript-eslint/no-unused-vars

package/dist/commands/heap/interactive/ui-components/CliScreen.js

@@ -85,7 +85,13 @@ class CliScreen {
     initCallbacks(controller, screen) {
         const selectDebounce = (0, HeapViewUtils_1.debounce)(150);
         const selectCallback = (componentId, index, content, selectInfo) => {
-            if (selectInfo.keyName === 'enter') {
+            if (selectInfo.keyName === 'd' || selectInfo.keyName === 'D') {
+                selectDebounce(() => {
+                    controller.displaySourceCode(componentId, index);
+                    screen.render();
+                });
+            }
+            else if (selectInfo.keyName === 'enter') {
                 selectDebounce(() => {
                     controller.setCurrentHeapObjectFromComponent(componentId, index);
                     screen.render();
@@ -161,6 +167,7 @@ class CliScreen {
     }
     initClusteredObjectBox(callbacks) {
         const box = new ListComponent_1.default([], callbacks, Object.assign({}, this.getClusteredObjectBoxSize()));
+        box.setController(this.heapController);
         box.setFocusKey(this.getNextFocusKey());
         box.setLabel('Clustered Objects');
         this.screen.append(box.element);
@@ -177,6 +184,7 @@ class CliScreen {
     }
     initReferrerBox(callbacks) {
         const box = new ListComponent_1.default([], callbacks, Object.assign({}, this.getReferrerBoxSize()));
+        box.setController(this.heapController);
         box.setFocusKey(this.getNextFocusKey());
         box.setLabel('Referrers');
         this.screen.append(box.element);
@@ -193,6 +201,7 @@ class CliScreen {
     }
     initObjectBox(callbacks) {
         const box = new ListComponent_1.default([], callbacks, Object.assign({}, this.getObjectBoxSize()));
+        box.setController(this.heapController);
         box.setFocusKey(this.getNextFocusKey());
         box.setLabel('Objects');
         this.screen.append(box.element);
@@ -211,6 +220,7 @@ class CliScreen {
     }
     initObjectPropertyBox(callbacks) {
         const box = new ListComponent_1.default([], callbacks, Object.assign({}, this.getObjectPropertyBoxSize()));
+        box.setController(this.heapController);
         box.setFocusKey(this.getNextFocusKey());
         box.setLabel('Objects Detail');
         this.screen.append(box.element);
@@ -229,6 +239,7 @@ class CliScreen {
     }
     initReferenceBox(callbacks) {
         const box = new ListComponent_1.default([], callbacks, Object.assign({}, this.getReferenceBoxSize()));
+        box.setController(this.heapController);
         box.setFocusKey(this.getNextFocusKey());
         box.setLabel('References');
         this.screen.append(box.element);
@@ -246,6 +257,7 @@ class CliScreen {
     }
     initRetainerTraceBox(callbacks) {
         const box = new ListComponent_1.default([], callbacks, Object.assign({}, this.getRetainerTraceBoxSize()));
+        box.setController(this.heapController);
         box.setFocusKey(this.getNextFocusKey());
         box.setLabel('Retainer Trace');
         this.screen.append(box.element);

package/dist/commands/heap/interactive/ui-components/HeapViewController.d.ts

@@ -1,13 +1,4 @@
-/**
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- *
- * @format
- * @oncall web_perf_infra
- */
-import type { IHeapSnapshot, IHeapNode } from '@memlab/core';
+import type { IHeapSnapshot, IHeapNode, Nullable } from '@memlab/core';
 import type ListComponent from './ListComponent';
 import { ComponentDataItem, ComponentData } from './HeapViewUtils';
 declare type SelectHeapObjectOption = {
@@ -37,11 +28,13 @@ export default class HeapViewController {
     private referenceBox;
     private objectPropertyBox;
     private retainerTracePropertyBox;
+    private scriptManager;
     constructor(heap: IHeapSnapshot, objectCategory: ObjectCategory);
     private getFlattenHeapObjectsInfo;
     private getFlattenClusteredObjectsInfo;
     private shouldClusterCategory;
     private clusterComponentDataItems;
+    getComponentDataById(componentId: number): Nullable<ComponentData>;
     getContent(componentId: number): string[];
     setClusteredBox(component: ListComponent): void;
     getClusteredBoxData(): ComponentData;
@@ -59,6 +52,10 @@ export default class HeapViewController {
     private getKeyValuePairString;
     setRetainerTraceBox(component: ListComponent): void;
     getRetainerTraceData(): ComponentData;
+    private getHeapObject;
+    displaySourceCode(componentId: number, itemIndex: number): void;
+    private displayClosureInfo;
+    private getClosureNodeScopeVarEdges;
     setCurrentHeapObjectFromComponent(componentId: number, itemIndex: number, options?: {
         skipFocus?: boolean;
     }): void;

package/dist/commands/heap/interactive/ui-components/HeapViewController.js

@@ -3,8 +3,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const path_1 = __importDefault(require("path"));
 const chalk_1 = __importDefault(require("chalk"));
+const worker_threads_1 = require("worker_threads");
 const core_1 = require("@memlab/core");
+const e2e_1 = require("@memlab/e2e");
 const HeapViewUtils_1 = require("./HeapViewUtils");
 /**
  * HeapViewController managers all the data associated with each
@@ -21,6 +24,8 @@ class HeapViewController {
         this.currentHeapObject = (0, HeapViewUtils_1.getHeapObjectAt)(this.currentHeapObjectsInfo, 0);
         this.componentIdToDataMap = new Map();
         this.componentIdToComponentMap = new Map();
+        this.scriptManager = new e2e_1.ScriptManager();
+        this.scriptManager.loadFromFiles();
     }
     getFlattenHeapObjectsInfo(objectCategory) {
         let ret = [];
@@ -66,6 +71,10 @@ class HeapViewController {
         });
         return ret;
     }
+    getComponentDataById(componentId) {
+        var _a;
+        return (_a = this.componentIdToDataMap.get(componentId)) !== null && _a !== void 0 ? _a : null;
+    }
     getContent(componentId) {
         const ret = [];
         const data = this.componentIdToDataMap.get(componentId);
@@ -178,12 +187,6 @@ class HeapViewController {
         // if the node has associated location info
         const location = node.location;
         if (location) {
-            const url = core_1.utils.getClosureSourceUrl(node);
-            if (url) {
-                data.items.push({
-                    stringContent: this.getKeyValuePairString('code link', url),
-                });
-            }
             data.items.push({
                 stringContent: this.getKeyValuePairString('script id', location.script_id),
             });
@@ -215,16 +218,18 @@ class HeapViewController {
             });
         }
         if (node.type === 'closure') {
-            const contextNode = node.getReferenceNode('context', 'internal');
-            if (contextNode) {
-                contextNode.forEachReference(edge => {
-                    data.items.push({
-                        tag: chalk_1.default.grey('Scope Variable'),
-                        referrerEdge: edge,
-                        heapObject: edge.toNode,
-                    });
+            const url = core_1.utils.getClosureSourceUrl(node);
+            if (url) {
+                data.items.push({
+                    stringContent: this.getKeyValuePairString('code link', url),
                 });
             }
+            const closureVars = this.getClosureNodeScopeVarEdges(node);
+            closureVars.forEach(edge => data.items.push({
+                tag: chalk_1.default.grey('Outer Scope Var'),
+                referrerEdge: edge,
+                heapObject: edge.toNode,
+            }));
         }
         data.selectedIdx = data.items.length > 0 ? 0 : -1;
         return data;
@@ -261,33 +266,79 @@ class HeapViewController {
         data.selectedIdx = data.items.length > 0 ? 0 : -1;
         return data;
     }
-    setCurrentHeapObjectFromComponent(componentId, itemIndex, options = {}) {
+    getHeapObject(componentId, itemIndex) {
         const data = this.componentIdToDataMap.get(componentId);
         if (!data) {
-            return;
+            return null;
         }
         const item = data.items[itemIndex];
         if (!item) {
-            return;
+            return null;
         }
         const heapObject = item.heapObject;
         if (!heapObject) {
+            return null;
+        }
+        return heapObject;
+    }
+    displaySourceCode(componentId, itemIndex) {
+        const node = this.getHeapObject(componentId, itemIndex);
+        if (node && node.type === 'closure') {
+            this.displayClosureInfo(node);
+        }
+    }
+    // locate and display source code of a closure node
+    // in a worker thread
+    displayClosureInfo(node) {
+        const url = core_1.utils.getClosureSourceUrl(node);
+        if (!url) {
             return;
         }
-        this.setCurrentHeapObject(heapObject, options);
+        const closureVars = this.getClosureNodeScopeVarEdges(node).map(edge => `${edge.name_or_index}`);
+        const workerData = {
+            url,
+            closureVars,
+        };
+        new worker_threads_1.Worker(path_1.default.join(__dirname, '..', 'worker', 'LocateClosureSourceWorker.js'), { workerData });
+    }
+    getClosureNodeScopeVarEdges(node) {
+        const internalReferences = new Set(['map', 'scope_info', 'previous']);
+        const contextNode = node.getReferenceNode('context', 'internal');
+        const ret = [];
+        if (contextNode) {
+            contextNode.forEachReference(edge => {
+                const name = `${edge.name_or_index}`;
+                if (!internalReferences.has(name)) {
+                    ret.push(edge);
+                }
+            });
+        }
+        return ret;
+    }
+    setCurrentHeapObjectFromComponent(componentId, itemIndex, options = {}) {
+        const heapObject = this.getHeapObject(componentId, itemIndex);
+        if (heapObject) {
+            this.setCurrentHeapObject(heapObject, options);
+        }
     }
     setCurrentHeapObject(node, options = {}) {
         this.currentHeapObject = node;
-        // set parent box's data and content
+        // set clustered box's data and content
         const clusteredBoxData = this.getClusteredBoxData();
         this.componentIdToDataMap.set(this.clusteredBox.id, clusteredBoxData);
         this.clusteredBox.setContent(this.getContent(this.clusteredBox.id));
         this.clusteredBox.selectIndex(clusteredBoxData.selectedIdx);
+        // must set label here again so the additional label info
+        // can render with updated component data
+        this.clusteredBox.setLabel('Clustered Objects');
         // set object box's data and content
         const objectBoxData = this.getObjectBoxData();
         this.componentIdToDataMap.set(this.objectBox.id, objectBoxData);
         this.objectBox.setContent(this.getContent(this.objectBox.id));
         this.objectBox.selectIndex(objectBoxData.selectedIdx);
+        // must set label here again so the additional label info
+        // can render with updated component data
+        this.objectBox.setLabel('Objects');
         this.setSelectedHeapObject(node);
         if (!options.skipFocus) {
             this.focusOnComponent(this.objectBox.id);

package/dist/commands/heap/interactive/ui-components/ListComponent.d.ts

@@ -8,6 +8,7 @@
  * @oncall web_perf_infra
  */
 import type { Widgets } from 'blessed';
+import type HeapViewController from './HeapViewController';
 export declare type ListComponentOption = {
     width: number;
     height: number;
@@ -18,6 +19,9 @@ export declare type ListComponentOption = {
 export declare type ListItemSelectInfo = {
     keyName: string;
 };
+export declare type LabelOption = {
+    nextTick?: boolean;
+};
 export declare type ListCallbacks = {
     selectCallback?: (componentId: number, index: number, content: string[], selectInfo: ListItemSelectInfo) => void;
     updateContent?: (oldContent: string[], newContent: string[]) => void;
@@ -32,6 +36,8 @@ export declare type ListCallbacks = {
 export default class ListComponent {
     element: Widgets.ListElement;
     id: number;
+    private labelText;
+    private controller;
     private listIndex;
     private content;
     private callbacks;
@@ -44,6 +50,7 @@ export default class ListComponent {
     private static nextComponentId;
     private static nextId;
     constructor(content: string[], callbacks: ListCallbacks, options: ListComponentOption);
+    setController(controller: HeapViewController): void;
     private render;
     private static createEntryForMore;
     protected registerKeys(): void;
@@ -53,7 +60,7 @@ export default class ListComponent {
     loseFocus(): void;
     selectIndex(index: number): void;
     setFocusKey(key: string): void;
-    setLabel(label: string): void;
+    setLabel(label: string, option?: LabelOption): void;
     setContent(content: string[]): void;
     loadMoreContent(): void;
     private removeDisplayMoreEntry;

package/dist/commands/heap/interactive/ui-components/ListComponent.js

@@ -14,6 +14,8 @@ const HeapViewUtils_1 = require("./HeapViewUtils");
  */
 class ListComponent {
     constructor(content, callbacks, options) {
+        this.labelText = '';
+        this.controller = null;
         this.listIndex = 0;
         this.content = [];
         this.moreEntryIndex = -1;
@@ -41,6 +43,9 @@ class ListComponent {
     static nextId() {
         return ListComponent.nextComponentId++;
     }
+    setController(controller) {
+        this.controller = controller;
+    }
     // render the whole screen
     render() {
         if (this.callbacks.render) {
@@ -64,6 +69,12 @@ class ListComponent {
                 self.loadMoreContent();
                 return;
             }
+            // if press 'd'
+            if (key.name === 'd' || key.name === 'D') {
+                self.selectUpdate(self.listIndex, content, {
+                    keyName: key.name,
+                });
+            }
             // move selection down
             if (key.name === 'down' && self.listIndex < self.displayedItems - 1) {
                 self.element.select(++self.listIndex);
@@ -160,9 +171,23 @@ class ListComponent {
     setFocusKey(key) {
         this.focusKey = key;
     }
-    setLabel(label) {
-        const componentLabel = label + chalk_1.default.grey(` (press ${chalk_1.default.inverse(this.focusKey)} to focus)`);
-        this.element.setLabel(componentLabel);
+    setLabel(label, option = {}) {
+        this.labelText = label;
+        let componentLabel = label + chalk_1.default.grey(` (press ${chalk_1.default.inverse(this.focusKey)} to focus)`);
+        if (this.controller) {
+            const data = this.controller.getComponentDataById(this.id);
+            if (data) {
+                componentLabel += chalk_1.default.grey(` ${data.items.length} items`);
+            }
+        }
+        if (option.nextTick) {
+            process.nextTick(() => {
+                this.element.setLabel(componentLabel);
+            });
+        }
+        else {
+            this.element.setLabel(componentLabel);
+        }
     }
     setContent(content) {
         const oldContent = this.content;

package/dist/commands/heap/interactive/worker/LocateClosureSourceWorker.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @oncall web_perf_infra
+ */
+export {};
+//# sourceMappingURL=LocateClosureSourceWorker.d.ts.map

package/dist/commands/heap/interactive/worker/LocateClosureSourceWorker.js

@@ -0,0 +1,69 @@
+"use strict";
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @oncall web_perf_infra
+ */
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const fs_1 = __importDefault(require("fs"));
+const worker_threads_1 = require("worker_threads");
+const core_1 = require("@memlab/core");
+const e2e_1 = require("@memlab/e2e");
+if (!worker_threads_1.isMainThread) {
+    try {
+        displaySourceCode();
+    }
+    catch (ex) {
+        // do nothing
+    }
+}
+function displaySourceCode() {
+    return __awaiter(this, void 0, void 0, function* () {
+        const scriptManager = new e2e_1.ScriptManager();
+        scriptManager.loadFromFiles();
+        const { url, closureVars } = worker_threads_1.workerData;
+        const code = scriptManager.loadCodeForUrl(url);
+        const scope = scriptManager.getClosureScopeTreeForUrl(url);
+        if (!code || !scope) {
+            return;
+        }
+        const file = core_1.fileManager.getDebugSourceFile();
+        fs_1.default.writeFileSync(file, code, 'UTF-8');
+        iterateClosures(scope, closureScope => {
+            const varSet = new Set(closureScope.variablesDefined);
+            const found = closureVars.reduce((acc, v) => varSet.has(v) && acc, true);
+            if (found && closureScope.loc) {
+                const startLine = closureScope.loc.start.line;
+                core_1.utils.runShell(`code -g ${file}:${startLine}`, { disconnectStdio: true });
+            }
+            return found;
+        });
+    });
+}
+function iterateClosures(scope, callback) {
+    if (callback(scope)) {
+        return true;
+    }
+    for (const subScope of scope.nestedClosures) {
+        if (iterateClosures(subScope, callback)) {
+            return true;
+        }
+    }
+    return false;
+}

package/dist/commands/snapshot/TakeSnapshotCommand.js

@@ -43,6 +43,7 @@ const HeadfulBrowserOption_1 = __importDefault(require("../../options/e2e/Headfu
 const SetUserAgentOption_1 = __importDefault(require("../../options/e2e/SetUserAgentOption"));
 const DisableWebSecurityOption_1 = __importDefault(require("../../options/e2e/DisableWebSecurityOption"));
 const EnableJSRewriteOption_1 = __importDefault(require("../../options/e2e/EnableJSRewriteOption"));
+const EnableJSInterceptOption_1 = __importDefault(require("../../options/e2e/EnableJSInterceptOption"));
 class TakeSnapshotCommand extends BaseCommand_1.default {
     getCommandName() {
         return 'snapshot';
@@ -83,6 +84,7 @@ class TakeSnapshotCommand extends BaseCommand_1.default {
             new DisableXvfbOption_1.default(),
             new DisableWebSecurityOption_1.default(),
             new EnableJSRewriteOption_1.default(),
+            new EnableJSInterceptOption_1.default(),
         ];
     }
     // eslint-disable-next-line @typescript-eslint/no-unused-vars

package/dist/options/constant.d.ts

@@ -1,3 +1,12 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @oncall web_perf_infra
+ */
 export declare const OptionNames: {
     DEBUG: string;
     HELP: string;

package/dist/options/constant.js

@@ -1,4 +1,13 @@
 "use strict";
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @oncall web_perf_infra
+ */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.OptionShortcuts = exports.OptionNames = void 0;
 exports.OptionNames = {

package/dist/options/e2e/HeadfulBrowserOption.js

@@ -28,7 +28,7 @@ class HeadfulBrowserOption extends core_1.BaseOption {
         return OptionConstant_1.default.optionNames.HEADFUL;
     }
     getDescription() {
-        return 'start the browser in headful mode, but default it is headless';
+        return 'start the browser in headful mode, by default it is headless';
     }
     parse(config, args) {
         return __awaiter(this, void 0, void 0, function* () {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@memlab/cli",
-  "version": "1.0.19",
+  "version": "1.0.21",
   "license": "MIT",
   "description": "command line interface for memlab",
   "author": "Liang Gong <lgong@fb.com>",
@@ -60,7 +60,7 @@
   "scripts": {
     "preinstall": "node bin/preinstall",
     "build-pkg": "tsc",
-    "publish-patch": "npm version patch --force && npm publish",
+    "publish-patch": "npm publish",
     "clean-pkg": "rm -rf ./dist && rm -rf ./node_modules && rm -f ./tsconfig.tsbuildinfo"
   },
   "bugs": {