@memlab/e2e 1.0.19 → 1.0.21

package/dist/E2EInteractionManager.d.ts

@@ -7,21 +7,24 @@
  * @format
  * @oncall web_perf_infra
  */
-import type { AnyFunction, OperationArgs, MemLabConfig } from '@memlab/core';
-import type { CDPSession, Page } from 'puppeteer';
+import type { Browser, CDPSession, Page, Target } from 'puppeteer';
+import type { AnyFunction, Nullable, OperationArgs, MemLabConfig } from '@memlab/core';
 import { TestPlanner } from './lib/operations/TestPlanner';
 declare type PageInteractOptions = {
     config?: MemLabConfig;
     testPlanner?: TestPlanner;
 };
 export default class E2EInteractionManager {
-    private cdpsession;
+    private mainThreadCdpsession;
     private page;
+    private browser;
     private pageHistoryLength;
     private evalFuncAfterInitLoad;
     private networkManager;
-    constructor(page: Page);
-    getCDPSession(): Promise<CDPSession>;
+    constructor(page: Page, browser: Browser);
+    getChosenCDPSession(): Promise<CDPSession>;
+    getMainThreadCDPSession(): Promise<CDPSession>;
+    selectCDPSession(predicate: (t: Target) => boolean): Promise<Nullable<CDPSession>>;
     clearCDPSession(): void;
     setEvalFuncAfterInitLoad(func: AnyFunction | null): void;
     protected initialLoad(page: Page, url: string, opArgs?: OperationArgs): Promise<void>;
@@ -35,7 +38,7 @@ export default class E2EInteractionManager {
     private writeSnapshotFileFromCDPSession;
     private saveHeapSnapshotToFile;
     private fullGC;
-    private forceGC;
+    private forceMainThreadGC;
     private collectMetrics;
 }
 export {};

package/dist/E2EInteractionManager.js

@@ -30,23 +30,56 @@ const TestPlanner_1 = __importDefault(require("./lib/operations/TestPlanner"));
 const NetworkManager_1 = __importDefault(require("./NetworkManager"));
 const { logMetaData, setPermissions, logTabProgress, maybeWaitForConsoleInput, applyAsyncWithRetry, compareURL, waitExtraForTab, checkURL, injectPageReloadChecker, checkPageReload, dispatchOperation, clearConsole, getNavigationHistoryLength, checkLastSnapshotChunk, getURLParameter, } = E2EUtils_1.default;
 class E2EInteractionManager {
-    constructor(page) {
+    constructor(page, browser) {
         this.pageHistoryLength = [];
         this.evalFuncAfterInitLoad = null;
         this.page = page;
+        this.browser = browser;
         this.networkManager = new NetworkManager_1.default(page);
     }
-    getCDPSession() {
+    getChosenCDPSession() {
         return __awaiter(this, void 0, void 0, function* () {
-            if (!this.cdpsession) {
-                this.cdpsession = yield this.page.target().createCDPSession();
-                this.networkManager.setCDPSession(this.cdpsession);
+            if (core_1.config.isAnalyzingMainThread) {
+                return this.getMainThreadCDPSession();
+            }
+            // get web worker thread target
+            const cdpSession = yield this.selectCDPSession(target => {
+                var _a, _b;
+                const t = target;
+                const isWorker = ((_a = t._targetInfo) === null || _a === void 0 ? void 0 : _a.type) === 'worker';
+                let isTitleMatch = true;
+                if (core_1.config.targetWorkerTitle != null) {
+                    isTitleMatch = ((_b = t._targetInfo) === null || _b === void 0 ? void 0 : _b.title) === core_1.config.targetWorkerTitle;
+                }
+                return isWorker && isTitleMatch;
+            });
+            if (cdpSession == null) {
+                throw core_1.utils.haltOrThrow('web worker or main thread heap under analysis not found');
+            }
+            return cdpSession;
+        });
+    }
+    getMainThreadCDPSession() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!this.mainThreadCdpsession) {
+                this.mainThreadCdpsession = yield this.page.target().createCDPSession();
+                this.networkManager.setCDPSession(this.mainThreadCdpsession);
+            }
+            return this.mainThreadCdpsession;
+        });
+    }
+    selectCDPSession(predicate) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const targets = yield this.browser.targets();
+            const target = targets.find(predicate);
+            if (!target) {
+                return null;
             }
-            return this.cdpsession;
+            return yield target.createCDPSession();
         });
     }
     clearCDPSession() {
-        this.cdpsession = null;
+        this.mainThreadCdpsession = null;
     }
     setEvalFuncAfterInitLoad(func) {
         this.evalFuncAfterInitLoad = func;
@@ -73,7 +106,8 @@ class E2EInteractionManager {
     }
     beforeInteractions() {
         return __awaiter(this, void 0, void 0, function* () {
-            const session = yield this.getCDPSession();
+            // tracking main thread for network interception
+            const session = yield this.getMainThreadCDPSession();
             if (core_1.config.interceptScript) {
                 this.networkManager.setCDPSession(session);
                 yield this.networkManager.interceptScript();
@@ -270,7 +304,7 @@ class E2EInteractionManager {
             if (core_1.config.verbose) {
                 core_1.info.lowLevel('Start tracking JS heap');
             }
-            const session = yield this.getCDPSession();
+            const session = yield this.getMainThreadCDPSession();
             yield session.send('HeapProfiler.enable');
         });
     }
@@ -305,7 +339,7 @@ class E2EInteractionManager {
         return __awaiter(this, void 0, void 0, function* () {
             core_1.info.beginSection('heap snapshot');
             const start = Date.now();
-            const session = yield this.getCDPSession();
+            const session = yield this.getChosenCDPSession();
             yield this.writeSnapshotFileFromCDPSession(file, session);
             const spanMs = Date.now() - start;
             if (core_1.config.verbose) {
@@ -328,12 +362,12 @@ class E2EInteractionManager {
                 core_1.info.overwrite('running a full GC...');
             }
             // force GC 6 times to release feedback_cells
-            yield this.forceGC(6);
+            yield this.forceMainThreadGC(6);
         });
     }
-    forceGC(repeat = 1) {
+    forceMainThreadGC(repeat = 1) {
         return __awaiter(this, void 0, void 0, function* () {
-            const client = yield this.getCDPSession();
+            const client = yield this.getMainThreadCDPSession();
             for (let i = 0; i < repeat; i++) {
                 yield client.send('HeapProfiler.collectGarbage');
                 // wait for a while and let GC do the job
@@ -351,7 +385,7 @@ class E2EInteractionManager {
             if (!core_1.config.runningMode.shouldGetMetrics(tabInfo)) {
                 return;
             }
-            yield this.forceGC();
+            yield this.forceMainThreadGC();
             // collect heap size
             const builtInMetrics = yield this.page.metrics();
             const size = core_1.utils.getReadableBytes(builtInMetrics.JSHeapUsedSize);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@memlab/e2e",
-  "version": "1.0.19",
+  "version": "1.0.21",
   "license": "MIT",
   "description": "memlab browser E2E interaction libraries",
   "author": "Liang Gong <lgong@fb.com>",

package/static/links/index.html

@@ -1,18 +1,41 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <link rel="icon" href="/favicon.ico" />
-    <meta name="viewport" content="width=device-width,initial-scale=1" />
-    <meta name="theme-color" content="#000000" />
-    <meta
-      name="description"
-      content="Web page for e2e tests"
-    />
-    <title>React App</title>
-    <script defer="defer" src="min.js"></script>
-  </head>
-  <body>
-    <div id="root"></div>
-  </body>
+
+<head>
+  <meta charset="utf-8" />
+  <link rel="icon" href="/favicon.ico" />
+  <meta name="viewport" content="width=device-width,initial-scale=1" />
+  <meta name="theme-color" content="#000000" />
+  <meta name="description" content="Web page for e2e tests" />
+  <title>React App</title>
+  <script>
+    // create a web worker
+    var blobURL = URL.createObjectURL(
+      new Blob(
+        [
+          '(',
+          function () {
+            function WorkerTestObject() {
+              this.idx = Math.random();
+            }
+            setInterval(() => {
+              self.holder = self.holder || [];
+              self.holder.push(new WorkerTestObject());
+            }, 5);
+          }.toString(),
+          ')()',
+        ],
+        { type: 'application/javascript' },
+      ),
+    );
+    var worker = new Worker(blobURL, {name: 'test-worker'});
+    URL.revokeObjectURL(blobURL);
+  </script>
+  <script defer="defer" src="min.js"></script>
+</head>
+
+<body>
+  <div id="root"></div>
+</body>
+
 </html>