fix: fix compatibility with Puppeteer v21 (#566)

Author: swissspidy

.eslintrc.js

@@ -14,6 +14,7 @@ module.exports = {
     jestPuppeteer: "readonly",
     page: "readonly",
   },
+
   overrides: [
     {
       files: ["*.test.?(m|t)js"],
@@ -37,6 +38,9 @@ module.exports = {
         tsconfigRootDir: __dirname,
       },
       plugins: ["@typescript-eslint"],
+      rules: {
+        "@typescript-eslint/no-explicit-any": "warn",
+      },
     },
   ],
 };

lerna.json

@@ -1,5 +1,4 @@
 {
-  "useWorkspaces": true,
   "version": "9.0.0",
   "$schema": "node_modules/lerna/schemas/lerna-schema.json"
 }

package-lock.json

@@ -15,20 +15,20 @@
   },
   "devDependencies": {
     "@swc/cli": "^0.1.62",
-    "@swc/core": "^1.3.59",
-    "@swc/jest": "^0.2.26",
-    "@typescript-eslint/eslint-plugin": "^5.59.7",
-    "@typescript-eslint/parser": "^5.59.7",
+    "@swc/core": "^1.3.90",
+    "@swc/jest": "^0.2.29",
+    "@typescript-eslint/eslint-plugin": "^6.7.3",
+    "@typescript-eslint/parser": "^6.7.3",
     "conventional-github-releaser": "^3.1.5",
     "cross-env": "^7.0.3",
-    "eslint": "^8.41.0",
-    "eslint-plugin-jest": "^27.2.1",
+    "eslint": "^8.50.0",
+    "eslint-plugin-jest": "^27.4.2",
     "express": "^4.18.2",
-    "jest": "^29.5.0",
-    "lerna": "^6.6.2",
-    "prettier": "^2.8.8",
-    "puppeteer": "^20.3.0",
-    "typescript": "^5.0.4"
+    "jest": "^29.7.0",
+    "lerna": "^7.3.0",
+    "prettier": "^3.0.3",
+    "puppeteer": "^21.3.6",
+    "typescript": "^5.2.2"
   },
   "name": "jest-puppeteer",
   "engines": {

package.json

@@ -204,7 +204,7 @@ import { join } from "node:path";
 
 await expect(page).toUploadFile(
   'input[type="file"]',
-  join(__dirname, "file.txt")
+  join(__dirname, "file.txt"),
 );
 ```
 

packages/expect-puppeteer/README.md

@@ -3,4 +3,5 @@ module.exports = {
   transform: {
     "^.+\\.(t|j)sx?$": ["@swc/jest"],
   },
+  testTimeout: 10000,
 };

packages/expect-puppeteer/jest.config.js

@@ -44,9 +44,9 @@
     "build": "rollup -c"
   },
   "devDependencies": {
-    "puppeteer": "^20.3.0",
-    "rollup": "^3.23.0",
-    "rollup-plugin-dts": "^5.3.0",
-    "rollup-plugin-swc3": "^0.8.1"
+    "puppeteer": "^21.3.6",
+    "rollup": "^3.29.4",
+    "rollup-plugin-dts": "^6.0.2",
+    "rollup-plugin-swc3": "^0.10.1"
   }
 }

packages/expect-puppeteer/package.json

@@ -1,5 +1,6 @@
 import { swc, defineRollupSwcOption } from "rollup-plugin-swc3";
 import dts from "rollup-plugin-dts";
+import * as url from "node:url";
 
 const bundle = (config) => ({
   input: "src/index.ts",
@@ -12,14 +13,14 @@ const bundle = (config) => ({
 const swcPlugin = swc(
   defineRollupSwcOption({
     jsc: {
+      baseUrl: url.fileURLToPath(new URL(".", import.meta.url)),
       parser: {
         syntax: "typescript",
       },
+      target: "es2022",
+      externalHelpers: false,
     },
-    env: {
-      targets: "node 16",
-    },
-  })
+  }),
 );
 
 export default [

packages/expect-puppeteer/rollup.config.mjs

@@ -1,4 +1,4 @@
-/* eslint-disable @typescript-eslint/ban-ts-comment, @typescript-eslint/no-namespace, no-use-before-define, no-restricted-syntax, no-await-in-loop */
+/* eslint-disable @typescript-eslint/ban-ts-comment, @typescript-eslint/no-namespace, no-use-before-define, no-restricted-syntax, no-await-in-loop, @typescript-eslint/no-unused-vars */
 import {
   checkIsPuppeteerInstance,
   checkIsElementHandle,
@@ -100,7 +100,7 @@ const jestExpect = global.expect as JestExpect;
 
 const wrapMatcher = <TPage extends PuppeteerInstance>(
   matcher: Matcher<TPage>,
-  instance: PuppeteerInstance
+  instance: PuppeteerInstance,
 ) => {
   return async function throwingMatcher(...args: any[]) {
     jestExpect.getState().assertionCalls += 1;
@@ -116,7 +116,7 @@ const wrapMatcher = <TPage extends PuppeteerInstance>(
 
 const createExpect = <T extends PuppeteerInstance>(
   instance: T,
-  matchers: MatcherSet<T>
+  matchers: MatcherSet<T>,
 ) => {
   const expectation = {
     not: {} as Record<string, any>,
@@ -134,7 +134,7 @@ const createExpect = <T extends PuppeteerInstance>(
 };
 
 const expectPuppeteerInstance = <TInstance extends PuppeteerInstance>(
-  actual: TInstance
+  actual: TInstance,
 ): PuppeteerMatchers => {
   if (checkIsPage(actual)) {
     return createExpect(actual, pageMatchers) as PuppeteerMatchers;

packages/expect-puppeteer/src/index.ts

@@ -15,7 +15,7 @@ export type GetElementOptions = {
 export async function getElementFactory(
   instance: PuppeteerInstance,
   selector: Selector,
-  options: GetElementOptions
+  options: GetElementOptions,
 ) {
   const { text: searchExpr, visible = false } = options;
 
@@ -24,7 +24,7 @@ export async function getElementFactory(
   const { text, regexp } = serializeSearchExpression(searchExpr);
 
   const parseSearchExpressionHandle = await evaluateParseSearchExpression(
-    ctx.page
+    ctx.page,
   );
 
   const getElementArgs = [
@@ -43,9 +43,9 @@ export async function getElementFactory(
     regexp: string | null,
     visible: boolean,
     parseSearchExpression: (
-      expr: SerializedSearchExpression
+      expr: SerializedSearchExpression,
     ) => ((value: string) => boolean) | null,
-    type: "element" | "positive" | "negative"
+    type: "element" | "positive" | "negative",
   ) => {
     const hasVisibleBoundingBox = (element: Element): boolean => {
       const rect = element.getBoundingClientRect();