chore!: update puppeteer to version 19 (#276)

* update puppeteer to version 15 * lint * update puppeteer v19 * update puppeteer v19 peer * update eslint-config
ChainSafe · Feb 13, 2023 · 2d66fba · 2d66fba
1 parent 54b2f1d
commit 2d66fba
Show file tree

Hide file tree

Showing 10 changed files with 112 additions and 109 deletions.
diff --git a/package.json b/package.json
@@ -57,7 +57,7 @@
     "strict-event-emitter": "^0.2.8"
   },
   "devDependencies": {
-    "@chainsafe/eslint-config": "^1.0.0",
+    "@chainsafe/eslint-config": "^1.1.0",
     "@ganache/console.log": "^0.2.0",
     "@jest/types": "^27.1.1",
     "@metamask/snap-types": "^0.23.0",
@@ -76,7 +76,7 @@
     "mocha": "^10.2.0",
     "playwright": "^1.29.2",
     "prettier": "^2.2.1",
-    "puppeteer": "14.0.0",
+    "puppeteer": "19.6.3",
     "solc": "0.5.2",
     "ts-node": "^10.9.1",
     "typescript": "~4.7",
@@ -85,7 +85,7 @@
   },
   "peerDependencies": {
     "playwright": ">=1",
-    "puppeteer": ">13"
+    "puppeteer": ">19"
   },
   "peerDependenciesMeta": {
     "puppeteer": {

diff --git a/src/element.ts b/src/element.ts
@@ -1,6 +1,6 @@
 export interface DappeteerElementHandle<
   Source = unknown,
-  Element = HTMLElement
+  Element extends Node = HTMLElement
 > {
   $$(selector: string): Promise<DappeteerElementHandle[]>;
   evaluate(fn: (e: Element) => void | Promise<void>): Promise<void>;

diff --git a/src/page.ts b/src/page.ts
@@ -69,8 +69,8 @@ export interface DappeteerPage<P = unknown> {
 
   waitForTimeout(timeout: number): Promise<void>;
 
-  evaluate<Params extends Serializable, Result>(
-    evaluateFn: (params: Unboxed<Params>) => Result,
+  evaluate<Params, Result>(
+    evaluateFn: (params: Params) => Result | string,
     params?: Params
   ): Promise<Result>;
 

diff --git a/src/playwright/page.ts b/src/playwright/page.ts
@@ -119,7 +119,7 @@ export class DPlaywrightPage implements DappeteerPage<Page> {
   }
 
   evaluate<Params, Result>(
-    evaluateFn: (params?: Unboxed<Params>) => Result | Promise<Result>,
+    evaluateFn: (params?: Params) => Result | string,
     params?: Params
   ): Promise<Result> {
     //@ts-expect-error

diff --git a/src/puppeteer/elements.ts b/src/puppeteer/elements.ts
@@ -2,13 +2,11 @@ import { ElementHandle } from "puppeteer";
 import { DappeteerElementHandle } from "../element";
 
 export class DPuppeteerElementHandle
-  implements DappeteerElementHandle<ElementHandle<HTMLElement>>
+  implements DappeteerElementHandle<ElementHandle<Element>>
 {
-  constructor(protected element: ElementHandle<HTMLElement>) {}
+  constructor(protected element: ElementHandle<Element>) {}
 
-  async $$(
-    selector: string
-  ): Promise<DappeteerElementHandle<unknown, HTMLElement>[]> {
+  async $$(selector: string): Promise<DappeteerElementHandle[]> {
     return (await this.element.$$(selector)).map(
       (e) => new DPuppeteerElementHandle(e as ElementHandle<HTMLElement>)
     );
@@ -19,10 +17,10 @@ export class DPuppeteerElementHandle
   }
 
   evaluate(fn: (e: HTMLElement) => void | Promise<void>): Promise<void> {
-    return this.element.evaluate(async (e) => await fn(e));
+    return this.element.evaluate(async (e) => await fn(e as HTMLElement));
   }
   getSource(): ElementHandle<HTMLElement> {
-    return this.element;
+    return this.element as ElementHandle<HTMLElement>;
   }
 
   async type(value: string): Promise<void> {

diff --git a/src/puppeteer/page.ts b/src/puppeteer/page.ts
@@ -1,7 +1,14 @@
-import { Browser, ElementHandle, Page, WaitForOptions } from "puppeteer";
+import {
+  Browser,
+  ElementHandle,
+  EvaluateFunc,
+  NodeFor,
+  Page,
+  WaitForOptions,
+} from "puppeteer";
 import { DappeteerBrowser } from "../browser";
 import { DappeteerElementHandle } from "../element";
-import { DappeteerPage, Response, Serializable, Unboxed } from "../page";
+import { DappeteerPage, Response, Serializable } from "../page";
 import { DPuppeteerElementHandle } from "./elements";
 
 export class DPupeteerPage implements DappeteerPage<Page> {
@@ -21,11 +28,15 @@ export class DPupeteerPage implements DappeteerPage<Page> {
     return new DPuppeteerElementHandle(await this.page.$(selector));
   }
 
-  $eval<T>(
-    selector: string,
-    evalFn: (e: HTMLElement) => T | Promise<T>
-  ): Promise<T> {
-    return this.page.$eval<T>(selector, evalFn) as Promise<T>;
+  $eval<
+    Selector extends string,
+    Params extends unknown[],
+    Func extends EvaluateFunc<[ElementHandle<NodeFor<Selector>>, ...Params]>
+  >(selector: Selector, evalFn: Func): Promise<any> {
+    return this.page.$eval<Selector, unknown[], Func>(
+      selector,
+      evalFn
+    ) as Promise<Func>;
   }
 
   $$eval<T>(
@@ -102,12 +113,9 @@ export class DPupeteerPage implements DappeteerPage<Page> {
   async waitForSelector(
     selector: string,
     opts?: Partial<{ visible: boolean; timeout: number; hidden: boolean }>
-  ): Promise<DappeteerElementHandle<ElementHandle<HTMLElement>>> {
+  ): Promise<DappeteerElementHandle<ElementHandle<Element>>> {
     return new DPuppeteerElementHandle(
-      (await this.page.waitForSelector(
-        selector,
-        opts
-      )) as ElementHandle<HTMLElement>
+      await this.page.waitForSelector(selector, opts)
     );
   }
 
@@ -124,28 +132,25 @@ export class DPupeteerPage implements DappeteerPage<Page> {
   async waitForXPath(
     xpath: string,
     opts?: Partial<{ visible: boolean; timeout: number }>
-  ): Promise<DappeteerElementHandle<ElementHandle>> {
+  ): Promise<DappeteerElementHandle<ElementHandle<Node>>> {
     return new DPuppeteerElementHandle(
-      await this.page.waitForXPath(xpath, opts)
+      (await this.page.waitForXPath(xpath, opts)) as ElementHandle<HTMLElement>
     );
   }
 
   waitForTimeout(timeout: number): Promise<void> {
     return this.page.waitForTimeout(timeout);
   }
 
-  evaluate<Params extends Serializable, Result>(
-    evaluateFn: (params?: Unboxed<Params>) => Result | Promise<Result>,
+  evaluate<Params, Result>(
+    evaluateFn: (params?: Params) => Result | string,
     params?: Params
   ): Promise<Result> {
-    return this.page.evaluate<typeof evaluateFn>(
-      evaluateFn,
-      params
-    ) as Promise<Result>;
+    return this.page.evaluate(evaluateFn, params) as Promise<Result>;
   }
 
   async waitForFunction<Params extends Serializable>(
-    pageFunction: (params?: Unboxed<Params>) => void | string,
+    pageFunction: () => {} | string,
     params?: Params
   ): Promise<void> {
     await this.page.waitForFunction(pageFunction, {}, params);

diff --git a/src/setup/puppeteer.ts b/src/setup/puppeteer.ts
@@ -18,7 +18,7 @@ export async function launchPuppeteer(
       `--disable-extensions-except=${metamaskPath}`,
       `--load-extension=${metamaskPath}`,
       ...(options.puppeteerOptions?.args || []),
-      ...(options.headless ? ["--headless=chrome"] : []),
+      ...(options.headless ? ["--headless=new"] : []),
     ],
   });
   const { DPuppeteerBrowser } = await import("../puppeteer");

diff --git a/src/snap/invokeSnap.ts b/src/snap/invokeSnap.ts
@@ -1,4 +1,4 @@
-import { DappeteerPage, Serializable, Unboxed } from "../page";
+import { DappeteerPage, Serializable } from "../page";
 import { flaskOnly, isMetaMaskErrorObject } from "./utils";
 
 export async function invokeSnap<
@@ -13,7 +13,7 @@ export async function invokeSnap<
   flaskOnly(page);
 
   const result = await page.evaluate(
-    async (opts: { snapId: string; method: string; params: Unboxed<P> }) => {
+    async (opts: { snapId: string; method: string; params: P }) => {
       try {
         return await window.ethereum.request<R>({
           method: "wallet_invokeSnap",

diff --git a/src/snap/utils.ts b/src/snap/utils.ts
@@ -40,7 +40,7 @@ function getWaitingPromise(
   page: DappeteerPage,
   selectorOrXpath: string,
   timeout: number
-): Promise<DappeteerElementHandle<unknown, HTMLElement>> {
+): Promise<DappeteerElementHandle> {
   if (selectorOrXpath.startsWith("//")) {
     return page.waitForXPath(selectorOrXpath, { timeout });
   } else {