Merge pull request #10 from yorickshan/perf/dependencies

chore: upgrade jest

.eslintrc

@@ -5,7 +5,7 @@
         "prettier"
     ],
     "parserOptions": {
-        "project": "./tsconfig.json",
+        "project": ["./tsconfig.json", "./tests/tsconfig.json"],
         "ecmaVersion": 2018,
         "sourceType": "module"
     },

.prettierignore

@@ -0,0 +1,3 @@
+/build
+/dist
+/node_modules

package.json

@@ -40,15 +40,15 @@
     "@types/chai": "^4.1.7",
     "@types/express": "^4.17.13",
     "@types/glob": "^7.1.1",
-    "@types/jest": "^26.0.24",
-    "@types/jest-image-snapshot": "^4.3.1",
+    "@types/jest": "^29.5.12",
+    "@types/jest-image-snapshot": "^6.4.0",
     "@types/karma": "^6.3.0",
     "@types/mocha": "^8.2.3",
     "@types/node": "^16.3.1",
     "@types/platform": "^1.3.4",
     "@types/promise-polyfill": "^6.0.3",
-    "@typescript-eslint/eslint-plugin": "^4.28.2",
-    "@typescript-eslint/parser": "^4.28.2",
+    "@typescript-eslint/eslint-plugin": "^4.33.0",
+    "@typescript-eslint/parser": "^4.33.0",
     "appium-ios-simulator": "^3.10.0",
     "babel-eslint": "^10.0.1",
     "babel-loader": "^8.0.5",
@@ -61,16 +61,17 @@
     "cors": "^2.8.5",
     "cz-conventional-changelog": "^3.3.0",
     "es6-promise": "^4.2.8",
-    "eslint": "^7.30.0",
+    "eslint": "^7.32.0",
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-prettier": "3.4.0",
     "express": "^4.17.1",
     "filenamify-url": "1.0.0",
     "glob": "7.1.3",
     "html2canvas-proxy": "1.0.1",
     "husky": "^8.0.0",
-    "jest": "^27.0.6",
-    "jest-image-snapshot": "^4.5.1",
+    "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
+    "jest-image-snapshot": "^6.4.0",
     "jquery": "^3.5.1",
     "js-polyfills": "^0.1.42",
     "karma": "^6.3.2",
@@ -95,11 +96,11 @@
     "serve-index": "^1.9.1",
     "slash": "1.0.0",
     "standard-version": "^9.5.0",
-    "ts-jest": "^27.0.3",
+    "ts-jest": "^29.1.5",
     "ts-loader": "^8.3.0",
-    "ts-node": "^10.1.0",
+    "ts-node": "^10.9.2",
     "tslib": "^2.3.0",
-    "typescript": "^4.3.5",
+    "typescript": "^4.9.5",
     "uglify-js": "^3.13.10",
     "webpack": "^4.46.0",
     "webpack-cli": "^3.3.12",
@@ -133,7 +134,7 @@
     "text-segmentation": "^1.0.3"
   },
   "lint-staged": {
-    "**/*.{ts}": [
+    "**/*.ts": [
       "prettier --write",
       "eslint --fix"
     ]

scripts/create-reftests.js

@@ -1,6 +1,6 @@
 const puppeteer = require('puppeteer');
 const path = require('path');
-const fs = require('fs/promises'); // Using promises for cleaner async/await syntax
+const fs = require('fs/promises');
 const express = require('express');
 const reftests = require('../tests/reftests');
 
@@ -10,17 +10,22 @@ app.use('/', express.static(path.resolve(__dirname, '../')));
 const listener = app.listen(0, async () => {
     const browser = await puppeteer.launch();
     const page = await browser.newPage();
+    page.setViewport({ width: 800, height: 600 }); // Set a desired viewport size
 
     const tests = Object.keys(reftests.testList);
     for (const filename of tests) {
         const url = `http://localhost:${listener.address().port}/${filename}?reftest&run=false`;
-        await page.goto(url);
+        try {
+            await page.goto(url);
+            // Wait for page to load (adjust wait strategy as needed)
+            await page.waitForSelector('body'); // Example wait strategy
 
-        // Capture the full page screenshot (adjust clipping as needed)
-        const screenshot = await page.screenshot({ fullPage: true });
-
-        // Save screenshot with modified filename
-        await fs.writeFile(path.resolve(__dirname, `..${filename.replace(/\.html$/i, '.png')}`), screenshot);
+            const screenshot = await page.screenshot({ fullPage: true });
+            await fs.writeFile(path.resolve(__dirname, `..${filename.replace(/\.html$/i, '.png')}`), screenshot);
+        } catch (error) {
+            console.error(`Error processing ${filename}:`, error);
+            // Handle errors appropriately (e.g., log, retry)
+        }
     }
 
     await browser.close();

tests/server.ts

@@ -1,10 +1,12 @@
+/* eslint-disable */
 import * as express from 'express';
+import yargs from 'yargs';
+import { Argv, ScreenshotRequest } from './types';
+
 const cors = require('cors');
 const path = require('path');
 const serveIndex = require('serve-index');
 const proxy = require('html2canvas-proxy');
-import yargs from 'yargs';
-import { ScreenshotRequest } from './types';
 const fs = require('fs');
 const bodyParser = require('body-parser');
 const filenamifyUrl = require('filenamify-url');
@@ -51,34 +53,37 @@ const writeScreenshot = (buffer: Buffer, body: ScreenshotRequest) => {
     return filename;
 };
 
-screenshotApp.post('/screenshot', (req: express.Request<{}, void, ScreenshotRequest>, res: express.Response) => {
-    if (!req.body || !req.body.screenshot) {
-        return res.sendStatus(400);
-    }
+screenshotApp.post(
+    '/screenshot',
+    (req: express.Request<Record<string, never>, void, ScreenshotRequest>, res: express.Response) => {
+        if (!req.body || !req.body.screenshot) {
+            return res.sendStatus(400);
+        }
 
-    const buffer = Buffer.from(req.body.screenshot.substring(prefix.length), 'base64');
-    const filename = writeScreenshot(buffer, req.body);
-    fs.writeFileSync(
-        path.resolve(__dirname, metadataFolder, `${filename}.json`),
-        JSON.stringify({
-            windowWidth: req.body.windowWidth,
-            windowHeight: req.body.windowHeight,
-            platform: req.body.platform,
-            devicePixelRatio: req.body.devicePixelRatio,
-            test: req.body.test,
-            id: process.env.TARGET_BROWSER,
-            screenshot: filename
-        })
-    );
-    return res.sendStatus(200);
-});
+        const buffer = Buffer.from(req.body.screenshot.substring(prefix.length), 'base64');
+        const filename = writeScreenshot(buffer, req.body);
+        fs.writeFileSync(
+            path.resolve(__dirname, metadataFolder, `${filename}.json`),
+            JSON.stringify({
+                windowWidth: req.body.windowWidth,
+                windowHeight: req.body.windowHeight,
+                platform: req.body.platform,
+                devicePixelRatio: req.body.devicePixelRatio,
+                test: req.body.test,
+                id: process.env.TARGET_BROWSER,
+                screenshot: filename
+            })
+        );
+        return res.sendStatus(200);
+    }
+);
 
 screenshotApp.use((error: Error, _req: express.Request, _res: express.Response, next: express.NextFunction) => {
     console.error(error);
     next();
 });
 
-const args = yargs(process.argv.slice(2)).number(['port', 'cors']).argv;
+const args = yargs(process.argv.slice(2)).number(['port', 'cors']).argv as Argv;
 
 if (args.port) {
     app.listen(args.port, () => {

tests/tsconfig.json

@@ -3,7 +3,8 @@
     "compilerOptions": {
         "types": ["node", "mocha"],
         "rootDir": "../",
-        "declaration": false
+        "declaration": false,
+        "declarationDir": null
     },
     "include": ["**/*.ts"]
-}
+}

tests/types.ts

@@ -11,3 +11,8 @@ export interface ScreenshotRequest {
     windowWidth: number;
     windowHeight: number;
 }
+
+export interface Argv {
+    port?: number;
+    cors?: number;
+}

tsconfig.json

@@ -12,10 +12,10 @@
         "sourceMap": true,
         "outDir": "dist/lib",
         "declaration": true,
+        "skipLibCheck": true,
         "declarationDir": "dist/types",
         "resolveJsonModule": true
     },
-    "include": [
-        "src"
-    ]
-}
+    "include": ["src", "scripts/**/*.ts"],
+    "exclude": ["dist", "build", "node_modules"]
+}